diff --git a/src/content/blog/2023/03/16/introducing-react-dev.md b/src/content/blog/2023/03/16/introducing-react-dev.md
index da98f6472..4f1af129a 100644
--- a/src/content/blog/2023/03/16/introducing-react-dev.md
+++ b/src/content/blog/2023/03/16/introducing-react-dev.md
@@ -1,17 +1,24 @@
---
-title: "Introducing react.dev"
+title: "Presentiamo react.dev"
author: Dan Abramov and Rachel Nabors
date: 2023/03/16
-description: Today we are thrilled to launch react.dev, the new home for React and its documentation. In this post, we would like to give you a tour of the new site.
+description: Oggi siamo entusiasti di lanciare react.dev, la nuova casa di React e della sua documentazione. In questo post ti facciamo fare un tour del nuovo sito.
+translationStatus: ai-draft
---
-March 16, 2023 by [Dan Abramov](https://bsky.app/profile/danabra.mov) and [Rachel Nabors](https://twitter.com/rachelnabors)
+16 marzo 2023 di [Dan Abramov](https://bsky.app/profile/danabra.mov) e [Rachel Nabors](https://twitter.com/rachelnabors)
---
+
+
+Questa pagina è stata tradotta automaticamente e supervisionata da un maintainer. Un'ulteriore revisione da parte della community sarebbe comunque utile. [Migliora questa traduzione](https://github.com/reactjs/it.react.dev/edit/main/src/content/blog/2023/03/16/introducing-react-dev.md).
+
+
+
-Today we are thrilled to launch [react.dev](https://react.dev), the new home for React and its documentation. In this post, we would like to give you a tour of the new site.
+Oggi siamo entusiasti di lanciare [react.dev](https://react.dev), la nuova casa di React e della sua documentazione. In questo post ti facciamo fare un tour del nuovo sito.
@@ -19,44 +26,44 @@ Today we are thrilled to launch [react.dev](https://react.dev), the new home for
## tl;dr {/*tldr*/}
-* The new React site ([react.dev](https://react.dev)) teaches modern React with function components and Hooks.
-* We've included diagrams, illustrations, challenges, and over 600 new interactive examples.
-* The previous React documentation site has now moved to [legacy.reactjs.org](https://legacy.reactjs.org).
+* Il nuovo sito React ([react.dev](https://react.dev)) insegna React moderno con componenti funzione e Hooks.
+* Abbiamo incluso diagrammi, illustrazioni, sfide e oltre 600 nuovi esempi interattivi.
+* Il precedente sito di documentazione React è ora su [legacy.reactjs.org](https://legacy.reactjs.org).
-## New site, new domain, new homepage {/*new-site-new-domain-new-homepage*/}
+## Nuovo sito, nuovo dominio, nuova homepage {/*new-site-new-domain-new-homepage*/}
-First, a little bit of housekeeping.
+Prima, un po' di organizzazione.
-To celebrate the launch of the new docs and, more importantly, to clearly separate the old and the new content, we've moved to the shorter [react.dev](https://react.dev) domain. The old [reactjs.org](https://reactjs.org) domain will now redirect here.
+Per celebrare il lancio della nuova documentazione e, soprattutto, per separare chiaramente i contenuti vecchi e nuovi, ci siamo spostati sul dominio più corto [react.dev](https://react.dev). Il vecchio dominio [reactjs.org](https://reactjs.org) ora reindirizza qui.
-The old React docs are now archived at [legacy.reactjs.org](https://legacy.reactjs.org). All existing links to the old content will automatically redirect there to avoid "breaking the web", but the legacy site will not get many more updates.
+La vecchia documentazione React è archiviata su [legacy.reactjs.org](https://legacy.reactjs.org). Tutti i link esistenti ai contenuti vecchi reindirizzeranno automaticamente lì per evitare di "rompere il web", ma il sito legacy non riceverà molti altri aggiornamenti.
-Believe it or not, React will soon be ten years old. In JavaScript years, it's like a whole century! We've [refreshed the React homepage](https://react.dev) to reflect why we think React is a great way to create user interfaces today, and updated the getting started guides to more prominently mention modern React-based frameworks.
+Che tu ci creda o no, React compirà presto dieci anni. In anni JavaScript, è come un secolo intero! Abbiamo [rinnovato la homepage React](https://react.dev) per riflettere perché pensiamo che React sia un ottimo modo per creare interfacce utente oggi, e abbiamo aggiornato le guide per iniziare menzionando più in evidenza i framework moderni basati su React.
-If you haven't seen the new homepage yet, check it out!
+Se non hai ancora visto la nuova homepage, dagli un'occhiata!
-## Going all-in on modern React with Hooks {/*going-all-in-on-modern-react-with-hooks*/}
+## Tutto su React moderno con gli Hooks {/*going-all-in-on-modern-react-with-hooks*/}
-When we released React Hooks in 2018, the Hooks docs assumed the reader is familiar with class components. This helped the community adopt Hooks very swiftly, but after a while the old docs failed to serve the new readers. New readers had to learn React twice: once with class components and then once again with Hooks.
+Quando abbiamo rilasciato React Hooks nel 2018, la documentazione sugli Hooks presupponeva che il lettore conoscesse i componenti class. Questo ha aiutato la community ad adottare gli Hooks molto rapidamente, ma col tempo la vecchia documentazione non serviva più i nuovi lettori. I nuovi lettori dovevano imparare React due volte: prima con i componenti class e poi di nuovo con gli Hooks.
-**The new docs teach React with Hooks from the beginning.** The docs are divided in two main sections:
+**La nuova documentazione insegna React con gli Hooks fin dall'inizio.** La documentazione è divisa in due sezioni principali:
-* **[Learn React](/learn)** is a self-paced course that teaches React from scratch.
-* **[API Reference](/reference)** provides the details and usage examples for every React API.
+* **[Impara React](/learn)** è un corso autogestito che insegna React da zero.
+* **[API Reference](/reference)** fornisce i dettagli e gli esempi d'uso per ogni API React.
-Let's have a closer look at what you can find in each section.
+Vediamo più da vicino cosa trovi in ciascuna sezione.
-There are still a few rare class component use cases that do not yet have a Hook-based equivalent. Class components remain supported, and are documented in the [Legacy API](/reference/react/legacy) section of the new site.
+Ci sono ancora alcuni rari casi d'uso con componenti class che non hanno ancora un equivalente basato su Hook. I componenti class restano supportati e sono documentati nella sezione [Legacy API](/reference/react/legacy) del nuovo sito.
## Avvio Rapido {/*quick-start*/}
-The Learn section begins with the [Avvio Rapido](/learn) page. It is a short introductory tour of React. It introduces the syntax for concepts like components, props, and state, but doesn't go into much detail on how to use them.
+La sezione Impara React inizia con la pagina [Avvio Rapido](/learn). È un breve tour introduttivo di React. Introduce la sintassi per concetti come componenti, props e state, ma non entra in molto dettaglio su come usarli.
-If you like to learn by doing, we recommend checking out the [Tic-Tac-Toe Tutorial](/learn/tutorial-tic-tac-toe) next. It walks you through building a little game with React, while teaching the skills you'll use every day. Here's what you'll build:
+Se ti piace imparare facendo, ti consigliamo di provare subito dopo il [Tutorial: Tic-Tac-Toe](/learn/tutorial-tic-tac-toe). Ti guida nella costruzione di un piccolo gioco con React, insegnandoti le competenze che userai ogni giorno. Ecco cosa costruirai:
@@ -225,43 +232,43 @@ body {
-We'd also like to highlight [Pensare in React](/learn/thinking-in-react)—that's the tutorial that made React "click" for many of us. **We've updated both of these classic tutorials to use function components and Hooks,** so they're as good as new.
+Vorremmo anche evidenziare [Pensare in React](/learn/thinking-in-react) — è il tutorial che ha fatto "cliccare" React per molti di noi. **Abbiamo aggiornato entrambi questi tutorial classici per usare componenti funzione e Hooks,** quindi sono come nuovi.
-The example above is a *sandbox*. We've added a lot of sandboxes—over 600!—everywhere throughout the site. You can edit any sandbox, or press "Fork" in the upper right corner to open it in a separate tab. Sandboxes let you quickly play with the React APIs, explore your ideas, and check your understanding.
+L'esempio sopra è una *sandbox*. Abbiamo aggiunto molte sandbox — oltre 600! — ovunque nel sito. Puoi modificare qualsiasi sandbox, o premere "Fork" nell'angolo in alto a destra per aprirla in una scheda separata. Le sandbox ti permettono di sperimentare rapidamente con le API React, esplorare le tue idee e verificare la comprensione.
-## Learn React step by step {/*learn-react-step-by-step*/}
+## Impara React passo dopo passo {/*learn-react-step-by-step*/}
-We'd like everyone in the world to have an equal opportunity to learn React for free on their own.
+Vorremmo che tutti nel mondo avessero la stessa opportunità di imparare React gratuitamente, in autonomia.
-This is why the Learn section is organized like a self-paced course split into chapters. The first two chapters describe the fundamentals of React. If you're new to React, or want to refresh it in your memory, start here:
+Ecco perché la sezione Impara React è organizzata come un corso autogestito diviso in capitoli. I primi due capitoli descrivono i fondamentali di React. Se sei nuovo a React, o vuoi rinfrescarlo in memoria, inizia da qui:
-- **[Describing the UI](/learn/describing-the-ui)** teaches how to display information with components.
-- **[Adding Interactivity](/learn/adding-interactivity)** teaches how to update the screen in response to user input.
+- **[Descrivere la UI](/learn/describing-the-ui)** insegna come mostrare informazioni con i componenti.
+- **[Aggiungere le Interazioni](/learn/adding-interactivity)** insegna come aggiornare lo schermo in risposta all'input dell'utente.
-The next two chapters are more advanced, and will give you a deeper insight into the trickier parts:
+I prossimi due capitoli sono più avanzati e ti daranno una comprensione più profonda delle parti più complesse:
-- **[Managing State](/learn/managing-state)** teaches how to organize your logic as your app grows in complexity.
-- **[Escape Hatches](/learn/escape-hatches)** teaches how you can "step outside" React, and when it makes most sense to do so.
+- **[Gestione dello state](/learn/managing-state)** insegna come organizzare la logica man mano che la tua app cresce in complessità.
+- **[Soluzioni alternative](/learn/escape-hatches)** insegna come puoi "uscire" da React e quando ha più senso farlo.
-Every chapter consists of several related pages. Most of these pages teach a specific skill or a technique—for example, [Writing Markup with JSX](/learn/writing-markup-with-jsx), [Updating Objects in State](/learn/updating-objects-in-state), or [Sharing State Between Components](/learn/sharing-state-between-components). Some of the pages focus on explaining an idea—like [Render and Commit](/learn/render-and-commit), or [State as a Snapshot](/learn/state-as-a-snapshot). And there are a few, like [You Might Not Need an Effect](/learn/you-might-not-need-an-effect), that share our suggestions based on what we've learned over these years.
+Ogni capitolo consiste di diverse pagine correlate. La maggior parte di queste pagine insegna una competenza o una tecnica specifica — ad esempio [Scrivere Markup con JSX](/learn/writing-markup-with-jsx), [Aggiornare gli Oggetti nello State](/learn/updating-objects-in-state), o [Condividere lo State tra Componenti](/learn/sharing-state-between-components). Alcune pagine si concentrano sull'esplicazione di un'idea — come [Renderizzare e Aggiornare](/learn/render-and-commit), o [Lo State come un'Istantanea](/learn/state-as-a-snapshot). E ce ne sono alcune, come [Potresti non avere bisogno di un Effetto](/learn/you-might-not-need-an-effect), che condividono i nostri suggerimenti basati su ciò che abbiamo imparato in questi anni.
-You don't have to read these chapters as a sequence. Who has the time for this?! But you could. Pages in the Learn section only rely on concepts introduced by the earlier pages. If you want to read it like a book, go for it!
+Non devi leggere questi capitoli in sequenza. Chi ha tempo per questo?! Ma potresti. Le pagine nella sezione Impara React si basano solo su concetti introdotti dalle pagine precedenti. Se vuoi leggerlo come un libro, fallo pure!
-### Check your understanding with challenges {/*check-your-understanding-with-challenges*/}
+### Verifica la comprensione con le sfide {/*check-your-understanding-with-challenges*/}
-Most pages in the Learn section end with a few challenges to check your understanding. For example, here are a few challenges from the page about [Conditional Rendering](/learn/conditional-rendering#challenges).
+La maggior parte delle pagine nella sezione Impara React termina con alcune sfide per verificare la comprensione. Ad esempio, ecco alcune sfide dalla pagina sulla [Renderizzazione Condizionale](/learn/conditional-rendering#challenges).
-You don't have to solve them right now! Unless you *really* want to.
+Non devi risolverle adesso! A meno che *non* voglia *davvero*.
-#### Show an icon for incomplete items with `? :` {/*show-an-icon-for-incomplete-items-with--*/}
+#### Mostra un'icona per gli elementi incompleti con `? :` {/*show-an-icon-for-incomplete-items-with--*/}
-Use the conditional operator (`cond ? a : b`) to render a ❌ if `isPacked` isn’t `true`.
+Usa l'operatore condizionale (`cond ? a : b`) per renderizzare un ❌ se `isPacked` non è `true`.
@@ -339,15 +346,15 @@ export default function PackingList() {
-#### Show the item importance with `&&` {/*show-the-item-importance-with-*/}
+#### Mostra l'importanza dell'elemento con `&&` {/*show-the-item-importance-with-*/}
-In this example, each `Item` receives a numerical `importance` prop. Use the `&&` operator to render "_(Importance: X)_" in italics, but only for items that have non-zero importance. Your item list should end up looking like this:
+In questo esempio, ogni `Item` riceve una prop numerica `importance`. Usa l'operatore `&&` per renderizzare "_(Importance: X)_" in corsivo, ma solo per gli elementi con importanza diversa da zero. La tua lista dovrebbe finire così:
* Space suit _(Importance: 9)_
* Helmet with a golden leaf
* Photo of Tam _(Importance: 6)_
-Don't forget to add a space between the two labels!
+Non dimenticare di aggiungere uno spazio tra le due etichette!
@@ -387,7 +394,7 @@ export default function PackingList() {
-This should do the trick:
+Questo dovrebbe funzionare:
@@ -429,53 +436,53 @@ export default function PackingList() {
-Note that you must write `importance > 0 && ...` rather than `importance && ...` so that if the `importance` is `0`, `0` isn't rendered as the result!
+Nota che devi scrivere `importance > 0 && ...` piuttosto che `importance && ...` così se `importance` è `0`, non viene renderizzato `0` come risultato!
-In this solution, two separate conditions are used to insert a space between then name and the importance label. Alternatively, you could use a Fragment with a leading space: `importance > 0 && <> ...` or add a space immediately inside the ``: `importance > 0 && ...`.
+In questa soluzione, due condizioni separate vengono usate per inserire uno spazio tra il nome e l'etichetta di importanza. In alternativa, potresti usare un Fragment con uno spazio iniziale: `importance > 0 && <> ...` o aggiungere uno spazio subito dentro ``: `importance > 0 && ...`.
-Notice the "Show solution" button in the left bottom corner. It's handy if you want to check yourself!
+Nota il pulsante "Mostra soluzione" nell'angolo in basso a sinistra. È comodo se vuoi verificare da solo!
-### Build an intuition with diagrams and illustrations {/*build-an-intuition-with-diagrams-and-illustrations*/}
+### Costruisci un'intuizione con diagrammi e illustrazioni {/*build-an-intuition-with-diagrams-and-illustrations*/}
-When we couldn't figure out how to explain something with code and words alone, we've added diagrams that help provide some intuition. For example, here is one of the diagrams from [Preserving and Resetting State](/learn/preserving-and-resetting-state):
+Quando non riuscivamo a spiegare qualcosa solo con codice e parole, abbiamo aggiunto diagrammi che aiutano a fornire intuizione. Ad esempio, ecco uno dei diagrammi da [Preservare e Resettare lo Stato](/learn/preserving-and-resetting-state):
-
+
-When `section` changes to `div`, the `section` is deleted and the new `div` is added
+Quando `section` diventa `div`, la `section` viene eliminata e viene aggiunto il nuovo `div`
-You'll also see some illustrations throughout the docs--here's one of the [browser painting the screen](/learn/render-and-commit#epilogue-browser-paint):
+Vedrai anche alcune illustrazioni in tutta la documentazione — ecco una del [browser che dipinge lo schermo](/learn/render-and-commit#epilogue-browser-paint):
-
+
-We've confirmed with the browser vendors that this depiction is 100% scientifically accurate.
+Abbiamo confermato con i vendor dei browser che questa rappresentazione è scientificamente accurata al 100%.
-## A new, detailed API Reference {/*a-new-detailed-api-reference*/}
+## Una nuova API Reference dettagliata {/*a-new-detailed-api-reference*/}
-In the [API Reference](/reference/react), every React API now has a dedicated page. This includes all kinds of APIs:
+Nell'[API Reference](/reference/react), ogni API React ha ora una pagina dedicata. Questo include tutti i tipi di API:
-- Built-in Hooks like [`useState`](/reference/react/useState).
-- Built-in components like [``](/reference/react/Suspense).
-- Built-in browser components like [``](/reference/react-dom/components/input).
-- Framework-oriented APIs like [`renderToPipeableStream`](/reference/react-dom/server/renderToReadableStream).
-- Other React APIs like [`memo`](/reference/react/memo).
+- Hooks integrati come [`useState`](/reference/react/useState).
+- Componenti integrati come [``](/reference/react/Suspense).
+- Componenti browser integrati come [``](/reference/react-dom/components/input).
+- API orientate ai framework come [`renderToPipeableStream`](/reference/react-dom/server/renderToReadableStream).
+- Altre API React come [`memo`](/reference/react/memo).
-You'll notice that every API page is split into at least two segments: *Reference* and *Usage*.
+Noterai che ogni pagina API è divisa in almeno due segmenti: *Reference* e *Usage*.
-[Reference](/reference/react/useState#reference) describes the formal API signature by listing its arguments and return values. It's concise, but it can feel a bit abstract if you're not familiar with that API. It describes what an API does, but not how to use it.
+[Reference](/reference/react/useState#reference) descrive la firma formale dell'API elencando argomenti e valori di ritorno. È concisa, ma può sembrare un po' astratta se non conosci quell'API. Descrive cosa fa un'API, ma non come usarla.
-[Usage](/reference/react/useState#usage) shows why and how you would use this API in practice, like a colleague or a friend might explain. It shows the **canonical scenarios for how each API was meant to be used by the React team.** We've added color-coded snippets, examples of using different APIs together, and recipes that you can copy and paste from:
+[Usage](/reference/react/useState#usage) mostra perché e come useresti questa API in pratica, come potrebbe spiegare un collega o un amico. Mostra gli **scenari canonici di come ogni API era pensata per essere usata dal team React.** Abbiamo aggiunto snippet con codifica colori, esempi di uso di API diverse insieme e ricette che puoi copiare e incollare:
-
+
-#### Counter (number) {/*counter-number*/}
+#### Contatore (numero) {/*counter-number*/}
-In this example, the `count` state variable holds a number. Clicking the button increments it.
+In questo esempio, la variabile di state `count` contiene un numero. Cliccando il pulsante lo incrementi.
@@ -501,9 +508,9 @@ export default function Counter() {
-#### Text field (string) {/*text-field-string*/}
+#### Campo di testo (stringa) {/*text-field-string*/}
-In this example, the `text` state variable holds a string. When you type, `handleChange` reads the latest input value from the browser input DOM element, and calls `setText` to update the state. This allows you to display the current `text` below.
+In questo esempio, la variabile di state `text` contiene una stringa. Quando digiti, `handleChange` legge l'ultimo valore di input dall'elemento DOM input del browser e chiama `setText` per aggiornare lo state. Questo ti permette di mostrare il `text` corrente sotto.
@@ -533,9 +540,9 @@ export default function MyInput() {
-#### Checkbox (boolean) {/*checkbox-boolean*/}
+#### Checkbox (booleano) {/*checkbox-boolean*/}
-In this example, the `liked` state variable holds a boolean. When you click the input, `setLiked` updates the `liked` state variable with whether the browser checkbox input is checked. The `liked` variable is used to render the text below the checkbox.
+In questo esempio, la variabile di state `liked` contiene un booleano. Quando clicchi l'input, `setLiked` aggiorna la variabile di state `liked` in base a se la checkbox del browser è selezionata. La variabile `liked` viene usata per renderizzare il testo sotto la checkbox.
@@ -569,9 +576,9 @@ export default function MyCheckbox() {
-#### Form (two variables) {/*form-two-variables*/}
+#### Form (due variabili) {/*form-two-variables*/}
-You can declare more than one state variable in the same component. Each state variable is completely independent.
+Puoi dichiarare più di una variabile di state nello stesso componente. Ogni variabile di state è completamente indipendente.
@@ -607,42 +614,42 @@ button { display: block; margin-top: 10px; }
-Some API pages also include [Troubleshooting](/reference/react/useEffect#troubleshooting) (for common problems) and [Alternatives](/reference/react-dom/findDOMNode#alternatives) (for deprecated APIs).
+Alcune pagine API includono anche [Troubleshooting](/reference/react/useEffect#troubleshooting) (per problemi comuni) e [Alternatives](/reference/react-dom/findDOMNode#alternatives) (per API deprecate).
-We hope that this approach will make the API reference useful not only as a way to look up an argument, but as a way to see all the different things you can do with any given API—and how it connects to the other ones.
+Speriamo che questo approccio renda l'API reference utile non solo per cercare un argomento, ma per vedere tutte le cose diverse che puoi fare con una data API — e come si collega alle altre.
-## What's next? {/*whats-next*/}
+## Cosa c'è dopo? {/*whats-next*/}
-That's a wrap for our little tour! Have a look around the new website, see what you like or don't like, and keep the feedback coming in our [issue tracker](https://github.com/reactjs/react.dev/issues).
+Questo conclude il nostro piccolo tour! Dai un'occhiata al nuovo sito, vedi cosa ti piace o non ti piace e continua a inviarci feedback nel nostro [issue tracker](https://github.com/reactjs/react.dev/issues).
-We acknowledge this project has taken a long time to ship. We wanted to maintain a high quality bar that the React community deserves. While writing these docs and creating all of the examples, we found mistakes in some of our own explanations, bugs in React, and even gaps in the React design that we are now working to address. We hope that the new documentation will help us hold React itself to a higher bar in the future.
+Riconosciamo che questo progetto ha impiegato molto tempo per essere rilasciato. Volevamo mantenere un alto standard di qualità che la community React merita. Mentre scrivevamo questa documentazione e creavamo tutti gli esempi, abbiamo trovato errori in alcune nostre spiegazioni, bug in React e persino lacune nel design di React che stiamo ora lavorando per affrontare. Speriamo che la nuova documentazione ci aiuti a tenere React stesso a uno standard più alto in futuro.
-We've heard many of your requests to expand the content and functionality of the website, for example:
+Abbiamo sentito molte delle vostre richieste di espandere contenuti e funzionalità del sito, ad esempio:
-- Providing a TypeScript version for all examples;
-- Creating the updated performance, testing, and accessibility guides;
-- Documenting React Server Components independently from the frameworks that support them;
-- Working with our international community to get the new docs translated;
-- Adding missing features to the new website (for example, RSS for this blog).
+- Fornire una versione TypeScript per tutti gli esempi;
+- Creare le guide aggiornate su performance, testing e accessibilità;
+- Documentare React Server Components indipendentemente dai framework che li supportano;
+- Lavorare con la nostra community internazionale per tradurre la nuova documentazione;
+- Aggiungere funzionalità mancanti al nuovo sito (ad esempio, RSS per questo blog).
-Now that [react.dev](https://react.dev/) is out, we will be able to shift our focus from "catching up" with the third-party React educational resources to adding new information and further improving our new website.
+Ora che [react.dev](https://react.dev/) è uscito, potremo spostare il focus dal "recuperare" le risorse educative React di terze parti all'aggiungere nuove informazioni e migliorare ulteriormente il nostro nuovo sito.
-We think there's never been a better time to learn React.
+Pensiamo che non ci sia mai stato un momento migliore per imparare React.
-## Who worked on this? {/*who-worked-on-this*/}
+## Chi ha lavorato a questo? {/*who-worked-on-this*/}
-On the React team, [Rachel Nabors](https://twitter.com/rachelnabors/) led the project (and provided the illustrations), and [Dan Abramov](https://bsky.app/profile/danabra.mov) designed the curriculum. They co-authored most of the content together as well.
+Nel team React, [Rachel Nabors](https://twitter.com/rachelnabors/) ha guidato il progetto (e fornito le illustrazioni), e [Dan Abramov](https://bsky.app/profile/danabra.mov) ha progettato il curriculum. Hanno anche co-autorato la maggior parte dei contenuti insieme.
-Of course, no project this large happens in isolation. We have a lot of people to thank!
+Naturalmente, nessun progetto così grande avviene in isolamento. Abbiamo molte persone da ringraziare!
-[Sylwia Vargas](https://twitter.com/SylwiaVargas) overhauled our examples to go beyond "foo/bar/baz" and kittens, and feature scientists, artists and cities from around the world. [Maggie Appleton](https://twitter.com/Mappletons) turned our doodles into a clear diagram system.
+[Sylwia Vargas](https://twitter.com/SylwiaVargas) ha rinnovato i nostri esempi andando oltre "foo/bar/baz" e gattini, includendo scienziati, artisti e città da tutto il mondo. [Maggie Appleton](https://twitter.com/Mappletons) ha trasformato i nostri scarabocchi in un chiaro sistema di diagrammi.
-Thanks to [David McCabe](https://twitter.com/mcc_abe), [Sophie Alpert](https://twitter.com/sophiebits), [Rick Hanlon](https://twitter.com/rickhanlonii), [Andrew Clark](https://twitter.com/acdlite), and [Matt Carroll](https://twitter.com/mattcarrollcode) for additional writing contributions. We'd also like to thank [Natalia Tepluhina](https://twitter.com/n_tepluhina) and [Sebastian Markbåge](https://twitter.com/sebmarkbage) for their ideas and feedback.
+Grazie a [David McCabe](https://twitter.com/mcc_abe), [Sophie Alpert](https://twitter.com/sophiebits), [Rick Hanlon](https://twitter.com/rickhanlonii), [Andrew Clark](https://twitter.com/acdlite), e [Matt Carroll](https://twitter.com/mattcarrollcode) per i contributi di scrittura aggiuntivi. Vorremmo anche ringraziare [Natalia Tepluhina](https://twitter.com/n_tepluhina) e [Sebastian Markbåge](https://twitter.com/sebmarkbage) per le loro idee e feedback.
-Thanks to [Dan Lebowitz](https://twitter.com/lebo) for the site design and [Razvan Gradinar](https://dribbble.com/GradinarRazvan) for the sandbox design.
+Grazie a [Dan Lebowitz](https://twitter.com/lebo) per il design del sito e [Razvan Gradinar](https://dribbble.com/GradinarRazvan) per il design delle sandbox.
-On the development front, thanks to [Jared Palmer](https://twitter.com/jaredpalmer) for prototype development. Thanks to [Dane Grant](https://twitter.com/danecando) and [Dustin Goodman](https://twitter.com/dustinsgoodman) from [ThisDotLabs](https://www.thisdot.co/) for their support on UI development. Thanks to [Ives van Hoorne](https://twitter.com/CompuIves), [Alex Moldovan](https://twitter.com/alexnmoldovan), [Jasper De Moor](https://twitter.com/JasperDeMoor), and [Danilo Woznica](https://twitter.com/danilowoz) from [CodeSandbox](https://codesandbox.io/) for their work with sandbox integration. Thanks to [Rick Hanlon](https://twitter.com/rickhanlonii) for spot development and design work, finessing our colors and finer details. Thanks to [Harish Kumar](https://www.strek.in/) and [Luna Ruan](https://twitter.com/lunaruan) for adding new features to the site and helping maintain it.
+Sul fronte dello sviluppo, grazie a [Jared Palmer](https://twitter.com/jaredpalmer) per lo sviluppo del prototipo. Grazie a [Dane Grant](https://twitter.com/danecando) e [Dustin Goodman](https://twitter.com/dustinsgoodman) di [ThisDotLabs](https://www.thisdot.co/) per il supporto allo sviluppo UI. Grazie a [Ives van Hoorne](https://twitter.com/CompuIves), [Alex Moldovan](https://twitter.com/alexnmoldovan), [Jasper De Moor](https://twitter.com/JasperDeMoor), e [Danilo Woznica](https://twitter.com/danilowoz) di [CodeSandbox](https://codesandbox.io/) per il lavoro sull'integrazione delle sandbox. Grazie a [Rick Hanlon](https://twitter.com/rickhanlonii) per sviluppo spot e lavoro di design, perfezionando colori e dettagli. Grazie a [Harish Kumar](https://www.strek.in/) e [Luna Ruan](https://twitter.com/lunaruan) per aver aggiunto nuove funzionalità al sito e aiutato a mantenerlo.
-Huge thanks to the folks who volunteered their time to participate in the alpha and beta testing program. Your enthusiasm and invaluable feedback helped us shape these docs. A special shout out to our beta tester, [Debbie O'Brien](https://twitter.com/debs_obrien), who gave a talk about her experience using the React docs at React Conf 2021.
+Enormi grazie alle persone che hanno donato il loro tempo per partecipare al programma di alpha e beta testing. Il vostro entusiasmo e feedback inestimabile ci hanno aiutato a plasmare questa documentazione. Un ringraziamento speciale alla nostra beta tester, [Debbie O'Brien](https://twitter.com/debs_obrien), che ha tenuto un talk sulla sua esperienza usando la documentazione React a React Conf 2021.
-Finally, thanks to the React community for being the inspiration behind this effort. You are the reason we do this, and we hope that the new docs will help you use React to build any user interface that you want.
+Infine, grazie alla community React per essere l'ispirazione dietro questo sforzo. Siete la ragione per cui lo facciamo, e speriamo che la nuova documentazione vi aiuti a usare React per costruire qualsiasi interfaccia utente desideriate.
diff --git a/src/content/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023.md b/src/content/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023.md
index df1fd085d..7813ce63a 100644
--- a/src/content/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023.md
+++ b/src/content/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023.md
@@ -1,17 +1,24 @@
---
-title: "React Labs: What We've Been Working On – March 2023"
+title: "React Labs: su cosa stiamo lavorando – marzo 2023"
author: Joseph Savona, Josh Story, Lauren Tan, Mengdi Chen, Samuel Susla, Sathya Gunasekaran, Sebastian Markbage, and Andrew Clark
date: 2023/03/22
-description: In React Labs posts, we write about projects in active research and development. We've made significant progress on them since our last update, and we'd like to share what we learned.
+description: Nei post React Labs scriviamo di progetti in ricerca e sviluppo attivi. Abbiamo fatto progressi significativi da [l'ultimo aggiornamento](/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022) e vorremmo condividere cosa abbiamo imparato.
+translationStatus: ai-draft
---
-March 22, 2023 by [Joseph Savona](https://twitter.com/en_JS), [Josh Story](https://twitter.com/joshcstory), [Lauren Tan](https://twitter.com/potetotes), [Mengdi Chen](https://twitter.com/mengdi_en), [Samuel Susla](https://twitter.com/SamuelSusla), [Sathya Gunasekaran](https://twitter.com/_gsathya), [Sebastian Markbåge](https://twitter.com/sebmarkbage), and [Andrew Clark](https://twitter.com/acdlite)
+22 marzo 2023 di [Joseph Savona](https://twitter.com/en_JS), [Josh Story](https://twitter.com/joshcstory), [Lauren Tan](https://twitter.com/potetotes), [Mengdi Chen](https://twitter.com/mengdi_en), [Samuel Susla](https://twitter.com/SamuelSusla), [Sathya Gunasekaran](https://twitter.com/_gsathya), [Sebastian Markbåge](https://twitter.com/sebmarkbage) e [Andrew Clark](https://twitter.com/acdlite)
---
+
+
+Questa pagina è stata tradotta automaticamente e supervisionata da un maintainer. Un'ulteriore revisione da parte della community sarebbe comunque utile. [Migliora questa traduzione](https://github.com/reactjs/it.react.dev/edit/main/src/content/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023.md).
+
+
+
-In React Labs posts, we write about projects in active research and development. We've made significant progress on them since our [last update](/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022), and we'd like to share what we learned.
+Nei post React Labs scriviamo di progetti in ricerca e sviluppo attivi. Abbiamo fatto progressi significativi da [l'ultimo aggiornamento](/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022) e vorremmo condividere cosa abbiamo imparato.
@@ -19,87 +26,87 @@ In React Labs posts, we write about projects in active research and development.
## React Server Components {/*react-server-components*/}
-React Server Components (or RSC) is a new application architecture designed by the React team.
+React Server Components (o RSC) è una nuova architettura applicativa progettata dal team React.
-We've first shared our research on RSC in an [introductory talk](/blog/2020/12/21/data-fetching-with-react-server-components) and an [RFC](https://github.com/reactjs/rfcs/pull/188). To recap them, we are introducing a new kind of component--Server Components--that run ahead of time and are excluded from your JavaScript bundle. Server Components can run during the build, letting you read from the filesystem or fetch static content. They can also run on the server, letting you access your data layer without having to build an API. You can pass data by props from Server Components to the interactive Client Components in the browser.
+Abbiamo condiviso per la prima volta la nostra ricerca su RSC in un [talk introduttivo](/blog/2020/12/21/data-fetching-with-react-server-components) e in un [RFC](https://github.com/reactjs/rfcs/pull/188). Per riassumerli, stiamo introducendo un nuovo tipo di componente — i componenti Server — che vengono eseguiti in anticipo ed esclusi dal tuo bundle JavaScript. I componenti Server possono essere eseguiti durante la build, permettendoti di leggere dal filesystem o recuperare contenuti statici. Possono anche essere eseguiti sul server, permettendoti di accedere al tuo data layer senza dover costruire un'API. Puoi passare dati tramite props dai componenti Server ai componenti Client interattivi nel browser.
-RSC combines the simple "request/response" mental model of server-centric Multi-Page Apps with the seamless interactivity of client-centric Single-Page Apps, giving you the best of both worlds.
+RSC combina il semplice modello mentale request/response delle Multi-Page App server-centric con l'interattività fluida delle Single-Page App client-centric, dandoti il meglio di entrambi i mondi.
-Since our last update, we have merged the [React Server Components RFC](https://github.com/reactjs/rfcs/blob/main/text/0188-server-components.md) to ratify the proposal. We resolved outstanding issues with the [React Server Module Conventions](https://github.com/reactjs/rfcs/blob/main/text/0227-server-module-conventions.md) proposal, and reached consensus with our partners to go with the `"use client"` convention. These documents also act as specification for what an RSC-compatible implementation should support.
+Dall'ultimo aggiornamento, abbiamo mergiato l'[RFC di React Server Components](https://github.com/reactjs/rfcs/blob/main/text/0188-server-components.md) per ratificare la proposta. Abbiamo risolto i problemi aperti con la proposta [React Server Module Conventions](https://github.com/reactjs/rfcs/blob/main/text/0227-server-module-conventions.md) e raggiunto consenso con i nostri partner per adottare la convenzione `"use client"`. Questi documenti fungono anche da specifica per ciò che un'implementazione compatibile con RSC dovrebbe supportare.
-The biggest change is that we introduced [`async` / `await`](https://github.com/reactjs/rfcs/pull/229) as the primary way to do data fetching from Server Components. We also plan to support data loading from the client by introducing a new Hook called `use` that unwraps Promises. Although we can't support `async / await` in arbitrary components in client-only apps, we plan to add support for it when you structure your client-only app similar to how RSC apps are structured.
+Il cambiamento più grande è che abbiamo introdotto [`async` / `await`](https://github.com/reactjs/rfcs/pull/229) come modo principale per fare data fetching dai componenti Server. Prevediamo anche di supportare il caricamento dati dal client introducendo un nuovo Hook chiamato `use` che estrae i valori dalle Promise. Anche se non possiamo supportare `async / await` in componenti arbitrari in app solo-client, prevediamo di aggiungere supporto quando strutturi la tua app solo-client in modo simile a come sono strutturate le app RSC.
-Now that we have data fetching pretty well sorted, we're exploring the other direction: sending data from the client to the server, so that you can execute database mutations and implement forms. We're doing this by letting you pass Server Action functions across the server/client boundary, which the client can then call, providing seamless RPC. Server Actions also give you progressively enhanced forms before JavaScript loads.
+Ora che abbiamo il data fetching abbastanza a posto, stiamo esplorando l'altra direzione: inviare dati dal client al server, così puoi eseguire mutazioni del database e implementare form. Lo facciamo permettendoti di passare funzioni Server Action attraverso il confine server/client, che il client può poi chiamare, fornendo RPC fluido. Le Server Action ti danno anche form progressivamente migliorati prima che JavaScript carichi.
-React Server Components has shipped in [Next.js App Router](/learn/creating-a-react-app#nextjs-app-router). This showcases a deep integration of a router that really buys into RSC as a primitive, but it's not the only way to build a RSC-compatible router and framework. There's a clear separation for features provided by the RSC spec and implementation. React Server Components is meant as a spec for components that work across compatible React frameworks.
+React Server Components è stato rilasciato in [Next.js App Router](/learn/creating-a-react-app#nextjs-app-router). Questo mostra un'integrazione profonda di un router che abbraccia RSC come primitiva, ma non è l'unico modo per costruire un router e framework compatibile con RSC. C'è una chiara separazione tra funzionalità fornite dalla specifica RSC e dall'implementazione. React Server Components è pensato come specifica per componenti che funzionano tra framework React compatibili.
-We generally recommend using an existing framework, but if you need to build your own custom framework, it is possible. Building your own RSC-compatible framework is not as easy as we'd like it to be, mainly due to the deep bundler integration needed. The current generation of bundlers are great for use on the client, but they weren't designed with first-class support for splitting a single module graph between the server and the client. This is why we're now partnering directly with bundler developers to get the primitives for RSC built-in.
+In generale consigliamo di usare un framework esistente, ma se devi costruire il tuo framework custom, è possibile. Costruire un framework compatibile con RSC non è facile come vorremmo, principalmente per l'integrazione profonda con il bundler necessaria. La generazione attuale di bundler è ottima per l'uso sul client, ma non è stata progettata con supporto di prima classe per dividere un singolo module graph tra server e client. Ecco perché ora collaboriamo direttamente con gli sviluppatori di bundler per integrare le primitive per RSC.
-## Asset Loading {/*asset-loading*/}
+## Caricamento delle risorse {/*asset-loading*/}
-[Suspense](/reference/react/Suspense) lets you specify what to display on the screen while the data or code for your components is still being loaded. This lets your users progressively see more content while the page is loading as well as during the router navigations that load more data and code. However, from the user's perspective, data loading and rendering do not tell the whole story when considering whether new content is ready. By default, browsers load stylesheets, fonts, and images independently, which can lead to UI jumps and consecutive layout shifts.
+[Suspense](/reference/react/Suspense) ti permette di specificare cosa mostrare sullo schermo mentre i dati o il codice per i tuoi componenti sono ancora in caricamento. Questo permette ai tuoi utenti di vedere progressivamente più contenuto mentre la pagina carica e durante le navigazioni del router che caricano più dati e codice. Tuttavia, dal punto di vista dell'utente, data loading e renderizzazione non raccontano tutta la storia quando si considera se il nuovo contenuto è pronto. Di default, i browser caricano stylesheet, font e immagini in modo indipendente, il che può portare a salti dell'UI e layout shift consecutivi.
-We're working to fully integrate Suspense with the loading lifecycle of stylesheets, fonts, and images, so that React takes them into account to determine whether the content is ready to be displayed. Without any change to the way you author your React components, updates will behave in a more coherent and pleasing manner. As an optimization, we will also provide a manual way to preload assets like fonts directly from components.
+Stiamo lavorando per integrare completamente Suspense con il lifecycle di caricamento di stylesheet, font e immagini, così React li tiene in considerazione per determinare se il contenuto è pronto per essere mostrato. Senza alcuna modifica al modo in cui scrivi i tuoi componenti React, gli aggiornamenti si comporteranno in modo più coerente e gradevole. Come ottimizzazione, forniremo anche un modo manuale per precaricare risorse come i font direttamente dai componenti.
-We are currently implementing these features and will have more to share soon.
+Stiamo attualmente implementando queste funzionalità e avremo presto altro da condividere.
-## Document Metadata {/*document-metadata*/}
+## Metadati del documento {/*document-metadata*/}
-Different pages and screens in your app may have different metadata like the `` tag, description, and other `<meta>` tags specific to this screen. From the maintenance perspective, it's more scalable to keep this information close to the React component for that page or screen. However, the HTML tags for this metadata need to be in the document `<head>` which is typically rendered in a component at the very root of your app.
+Pagine e schermate diverse nella tua app possono avere metadati diversi come il tag `<title>`, la description e altri tag `<meta>` specifici per quella schermata. Dal punto di vista della manutenzione, è più scalabile tenere queste informazioni vicine al componente React per quella pagina o schermata. Tuttavia, i tag HTML per questi metadati devono essere nel `<head>` del documento, che tipicamente viene renderizzato in un componente alla radice dell'app.
-Today, people solve this problem with one of the two techniques.
+Oggi le persone risolvono questo problema con una di due tecniche.
-One technique is to render a special third-party component that moves `<title>`, `<meta>`, and other tags inside it into the document `<head>`. This works for major browsers but there are many clients which do not run client-side JavaScript, such as Open Graph parsers, and so this technique is not universally suitable.
+Una tecnica è renderizzare un componente di terze parti speciale che sposta `<title>`, `<meta>` e altri tag al suo interno nel `<head>` del documento. Funziona per i browser principali, ma ci sono molti client che non eseguono JavaScript lato client, come i parser Open Graph, quindi questa tecnica non è universalmente adatta.
-Another technique is to server-render the page in two parts. First, the main content is rendered and all such tags are collected. Then, the `<head>` is rendered with these tags. Finally, the `<head>` and the main content are sent to the browser. This approach works, but it prevents you from taking advantage of the [React 18's Streaming Server Renderer](/reference/react-dom/server/renderToReadableStream) because you'd have to wait for all content to render before sending the `<head>`.
+Un'altra tecnica è server-renderizzare la pagina in due parti. Prima viene renderizzato il contenuto principale e vengono raccolti tutti questi tag. Poi il `<head>` viene renderizzato con questi tag. Infine `<head>` e contenuto principale vengono inviati al browser. Questo approccio funziona, ma ti impedisce di sfruttare lo [Streaming Server Renderer di React 18](/reference/react-dom/server/renderToReadableStream) perché dovresti aspettare che tutto il contenuto sia renderizzato prima di inviare il `<head>`.
-This is why we're adding built-in support for rendering `<title>`, `<meta>`, and metadata `<link>` tags anywhere in your component tree out of the box. It would work the same way in all environments, including fully client-side code, SSR, and in the future, RSC. We will share more details about this soon.
+Ecco perché stiamo aggiungendo supporto integrato per renderizzare tag `<title>`, `<meta>` e `<link>` di metadati ovunque nell'albero dei componenti out of the box. Funzionerebbe allo stesso modo in tutti gli ambienti, incluso codice completamente lato client, SSR e in futuro RSC. Condivideremo presto più dettagli.
## React Optimizing Compiler {/*react-optimizing-compiler*/}
-Since our previous update we've been actively iterating on the design of [React Forget](/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022#react-compiler), an optimizing compiler for React. We've previously talked about it as an "auto-memoizing compiler", and that is true in some sense. But building the compiler has helped us understand React's programming model even more deeply. A better way to understand React Forget is as an automatic *reactivity* compiler.
+Dall'aggiornamento precedente abbiamo iterato attivamente sul design di [React Forget](/blog/2022/06/15/react-labs-what-we-have-been-working-on-june-2022#react-compiler), un optimizing compiler per React. In precedenza ne abbiamo parlato come di un "compilatore auto-memoizing", e in un certo senso è vero. Ma costruire il compilatore ci ha aiutato a capire ancora più a fondo il modello di programmazione di React. Un modo migliore di capire React Forget è come un compilatore automatico di *reattività*.
-The core idea of React is that developers define their UI as a function of the current state. You work with plain JavaScript values — numbers, strings, arrays, objects — and use standard JavaScript idioms — if/else, for, etc — to describe your component logic. The mental model is that React will re-render whenever the application state changes. We believe this simple mental model and keeping close to JavaScript semantics is an important principle in React's programming model.
+L'idea centrale di React è che gli sviluppatori definiscono la loro UI come funzione dello state corrente. Lavori con valori JavaScript semplici — numeri, stringhe, array, oggetti — e usi idiomi JavaScript standard — if/else, for, ecc. — per descrivere la logica del componente. Il modello mentale è che React ri-renderizza ogni volta che lo state dell'applicazione cambia. Crediamo che questo semplice modello mentale e restare vicini alla semantica JavaScript sia un principio importante nel modello di programmazione di React.
-The catch is that React can sometimes be *too* reactive: it can re-render too much. For example, in JavaScript we don't have cheap ways to compare if two objects or arrays are equivalent (having the same keys and values), so creating a new object or array on each render may cause React to do more work than it strictly needs to. This means developers have to explicitly memoize components so as to not over-react to changes.
+Il problema è che React a volte può essere *troppo* reattivo: può ri-renderizzare troppo. Ad esempio, in JavaScript non abbiamo modi economici per confrontare se due oggetti o array sono equivalenti (stesse chiavi e valori), quindi creare un nuovo oggetto o array a ogni render può far fare a React più lavoro del necessario. Questo significa che gli sviluppatori devono memorizzare esplicitamente i componenti per non reagire eccessivamente ai cambiamenti.
-Our goal with React Forget is to ensure that React apps have just the right amount of reactivity by default: that apps re-render only when state values *meaningfully* change. From an implementation perspective this means automatically memoizing, but we believe that the reactivity framing is a better way to understand React and Forget. One way to think about this is that React currently re-renders when object identity changes. With Forget, React re-renders when the semantic value changes — but without incurring the runtime cost of deep comparisons.
+Il nostro obiettivo con React Forget è assicurare che le app React abbiano di default la giusta quantità di reattività: che le app ri-renderizzino solo quando i valori di state cambiano in modo *significativo*. Dal punto di vista dell'implementazione significa memorizzare automaticamente, ma crediamo che l'inquadratura della reattività sia un modo migliore di capire React e Forget. Un modo di pensarci è che React attualmente ri-renderizza quando cambia l'identità dell'oggetto. Con Forget, React ri-renderizza quando cambia il valore semantico — senza il costo runtime di confronti profondi.
-In terms of concrete progress, since our last update we have substantially iterated on the design of the compiler to align with this automatic reactivity approach and to incorporate feedback from using the compiler internally. After some significant refactors to the compiler starting late last year, we've now begun using the compiler in production in limited areas at Meta. We plan to open-source it once we've proved it in production.
+In termini di progressi concreti, dall'ultimo aggiornamento abbiamo iterato sostanzialmente sul design del compilatore per allinearlo a questo approccio di reattività automatica e incorporare feedback dall'uso interno del compilatore. Dopo rifattorizzazioni significative al compilatore a fine scorso anno, abbiamo iniziato a usarlo in produzione in aree limitate in Meta. Prevediamo di rilasciarlo in open source una volta provato in produzione.
-Finally, a lot of people have expressed interest in how the compiler works. We're looking forward to sharing a lot more details when we prove the compiler and open-source it. But there are a few bits we can share now:
+Infine, molte persone hanno espresso interesse su come funziona il compilatore. Non vediamo l'ora di condividere molti più dettagli quando avremo provato il compilatore e lo rilasceremo in open source. Ma ci sono alcuni punti che possiamo condividere ora:
-The core of the compiler is almost completely decoupled from Babel, and the core compiler API is (roughly) old AST in, new AST out (while retaining source location data). Under the hood we use a custom code representation and transformation pipeline in order to do low-level semantic analysis. However, the primary public interface to the compiler will be via Babel and other build system plugins. For ease of testing we currently have a Babel plugin which is a very thin wrapper that calls the compiler to generate a new version of each function and swap it in.
+Il core del compilatore è quasi completamente disaccoppiato da Babel, e l'API core del compilatore è (approssimativamente) old AST in, new AST out (mantenendo i dati di posizione nel sorgente). Sotto il cofano usiamo una rappresentazione del codice custom e una pipeline di trasformazione per fare analisi semantica a basso livello. Tuttavia, l'interfaccia pubblica principale al compilatore sarà tramite Babel e altri plugin del build system. Per facilitare i test abbiamo attualmente un plugin Babel che è un wrapper molto sottile che chiama il compilatore per generare una nuova versione di ogni funzione e sostituirla.
-As we refactored the compiler over the last few months, we wanted to focus on refining the core compilation model to ensure we could handle complexities such as conditionals, loops, reassignment, and mutation. However, JavaScript has a lot of ways to express each of those features: if/else, ternaries, for, for-in, for-of, etc. Trying to support the full language up-front would have delayed the point where we could validate the core model. Instead, we started with a small but representative subset of the language: let/const, if/else, for loops, objects, arrays, primitives, function calls, and a few other features. As we gained confidence in the core model and refined our internal abstractions, we expanded the supported language subset. We're also explicit about syntax we don't yet support, logging diagnostics and skipping compilation for unsupported input. We have utilities to try the compiler on Meta's codebases and see what unsupported features are most common so we can prioritize those next. We'll continue incrementally expanding towards supporting the whole language.
+Mentre rifattorizzavamo il compilatore negli ultimi mesi, volevamo concentrarci sul perfezionare il modello di compilazione core per assicurarci di gestire complessità come condizionali, loop, riassegnazioni e mutazioni. Tuttavia JavaScript ha molti modi di esprimere ciascuna di queste funzionalità: if/else, ternari, for, for-in, for-of, ecc. Cercare di supportare l'intero linguaggio fin dall'inizio avrebbe ritardato il punto in cui avremmo potuto validare il modello core. Invece abbiamo iniziato con un sottoinsieme piccolo ma rappresentativo del linguaggio: let/const, if/else, for loop, oggetti, array, primitivi, chiamate di funzione e altre poche funzionalità. Man mano che acquisivamo fiducia nel modello core e perfezionavamo le nostre astrazioni interne, abbiamo espanso il sottoinsieme supportato. Siamo anche espliciti sulla sintassi non ancora supportata, loggando diagnostiche e saltando la compilazione per input non supportato. Abbiamo utility per provare il compilatore sui codebase Meta e vedere quali funzionalità non supportate sono più comuni così da prioritizzarle. Continueremo ad espandere incrementalmente verso il supporto dell'intero linguaggio.
-Making plain JavaScript in React components reactive requires a compiler with a deep understanding of semantics so that it can understand exactly what the code is doing. By taking this approach, we're creating a system for reactivity within JavaScript that lets you write product code of any complexity with the full expressivity of the language, instead of being limited to a domain specific language.
+Rendere reattivo il JavaScript semplice nei componenti React richiede un compilatore con profonda comprensione della semantica così da capire esattamente cosa fa il codice. Con questo approccio stiamo creando un sistema di reattività in JavaScript che ti permette di scrivere codice di prodotto di qualsiasi complessità con la piena espressività del linguaggio, invece di essere limitati a un linguaggio specifico del dominio.
## Offscreen Rendering {/*offscreen-rendering*/}
-Offscreen rendering is an upcoming capability in React for rendering screens in the background without additional performance overhead. You can think of it as a version of the [`content-visibility` CSS property](https://developer.mozilla.org/en-US/docs/Web/CSS/content-visibility) that works not only for DOM elements but React components, too. During our research, we've discovered a variety of use cases:
+L'offscreen rendering è una funzionalità in arrivo in React per renderizzare schermate in background senza overhead aggiuntivo di performance. Puoi pensarla come una versione della [proprietà CSS `content-visibility`](https://developer.mozilla.org/it/docs/Web/CSS/content-visibility) che funziona non solo per elementi DOM ma anche per componenti React. Durante la ricerca abbiamo scoperto vari casi d'uso:
-- A router can prerender screens in the background so that when a user navigates to them, they're instantly available.
-- A tab switching component can preserve the state of hidden tabs, so the user can switch between them without losing their progress.
-- A virtualized list component can prerender additional rows above and below the visible window.
-- When opening a modal or popup, the rest of the app can be put into "background" mode so that events and updates are disabled for everything except the modal.
+* Un router può prerenderizzare schermate in background così quando un utente ci naviga, sono immediatamente disponibili.
+* Un componente per il cambio tab può preservare lo state delle tab nascoste, così l'utente può passare tra di esse senza perdere i progressi.
+* Un componente lista virtualizzata può prerenderizzare righe aggiuntive sopra e sotto la finestra visibile.
+* Quando apri un modal o popup, il resto dell'app può essere messo in modalità "background" così eventi e aggiornamenti sono disabilitati per tutto tranne il modal.
-Most React developers will not interact with React's offscreen APIs directly. Instead, offscreen rendering will be integrated into things like routers and UI libraries, and then developers who use those libraries will automatically benefit without additional work.
+La maggior parte degli sviluppatori React non interagirà direttamente con le API offscreen di React. Invece, l'offscreen rendering sarà integrato in cose come router e librerie UI, e gli sviluppatori che usano quelle librerie ne beneficeranno automaticamente senza lavoro aggiuntivo.
-The idea is that you should be able to render any React tree offscreen without changing the way you write your components. When a component is rendered offscreen, it does not actually *mount* until the component becomes visible — its effects are not fired. For example, if a component uses `useEffect` to log analytics when it appears for the first time, prerendering won't mess up the accuracy of those analytics. Similarly, when a component goes offscreen, its effects are unmounted, too. A key feature of offscreen rendering is that you can toggle the visibility of a component without losing its state.
+L'idea è che dovresti poter renderizzare qualsiasi albero React offscreen senza cambiare il modo in cui scrivi i tuoi componenti. Quando un componente è renderizzato offscreen, non *monta* effettivamente finché il componente non diventa visibile — i suoi Effetti non vengono attivati. Ad esempio, se un componente usa `useEffect` per loggare analytics quando appare per la prima volta, il prerendering non compromette l'accuratezza di quelle analytics. Allo stesso modo, quando un componente va offscreen, anche i suoi Effetti vengono smontati. Una caratteristica chiave dell'offscreen rendering è che puoi cambiare la visibilità di un componente senza perdere il suo state.
-Since our last update, we've tested an experimental version of prerendering internally at Meta in our React Native apps on Android and iOS, with positive performance results. We've also improved how offscreen rendering works with Suspense — suspending inside an offscreen tree will not trigger Suspense fallbacks. Our remaining work involves finalizing the primitives that are exposed to library developers. We expect to publish an RFC later this year, alongside an experimental API for testing and feedback.
+Dall'ultimo aggiornamento abbiamo testato internamente in Meta una versione sperimentale del prerendering nelle nostre app React Native su Android e iOS, con risultati positivi sulle performance. Abbiamo anche migliorato come l'offscreen rendering funziona con Suspense — sospendere dentro un albero offscreen non attiva i fallback di Suspense. Il lavoro rimanente consiste nel finalizzare le primitive esposte agli sviluppatori di librerie. Ci aspettiamo di pubblicare un RFC più avanti quest'anno, insieme a un'API sperimentale per test e feedback.
## Transition Tracing {/*transition-tracing*/}
-The Transition Tracing API lets you detect when [React Transitions](/reference/react/useTransition) become slower and investigate why they may be slow. Following our last update, we have completed the initial design of the API and published an [RFC](https://github.com/reactjs/rfcs/pull/238). The basic capabilities have also been implemented. The project is currently on hold. We welcome feedback on the RFC and look forward to resuming its development to provide a better performance measurement tool for React. This will be particularly useful with routers built on top of React Transitions, like the [Next.js App Router](/learn/creating-a-react-app#nextjs-app-router).
+L'API Transition Tracing ti permette di rilevare quando le [Transizioni React](/reference/react/useTransition) diventano più lente e investigare perché possono essere lente. Dopo l'ultimo aggiornamento abbiamo completato il design iniziale dell'API e pubblicato un [RFC](https://github.com/reactjs/rfcs/pull/238). Le funzionalità di base sono state anche implementate. Il progetto è attualmente in pausa. Accogliamo feedback sull'RFC e non vediamo l'ora di riprenderne lo sviluppo per fornire uno strumento migliore di misurazione delle performance per React. Sarà particolarmente utile con router costruiti sopra le Transizioni React, come [Next.js App Router](/learn/creating-a-react-app#nextjs-app-router).
* * *
-In addition to this update, our team has made recent guest appearances on community podcasts and livestreams to speak more on our work and answer questions.
+Oltre a questo aggiornamento, il nostro team è stato recentemente ospite di podcast e livestream della community per parlare più del nostro lavoro e rispondere a domande.
-* [Dan Abramov](https://bsky.app/profile/danabra.mov) and [Joe Savona](https://twitter.com/en_JS) were interviewed by [Kent C. Dodds on his YouTube channel](https://www.youtube.com/watch?v=h7tur48JSaw), where they discussed concerns around React Server Components.
-* [Dan Abramov](https://bsky.app/profile/danabra.mov) and [Joe Savona](https://twitter.com/en_JS) were guests on the [JSParty podcast](https://jsparty.fm/267) and shared their thoughts about the future of React.
+* [Dan Abramov](https://bsky.app/profile/danabra.mov) e [Joe Savona](https://twitter.com/en_JS) sono stati intervistati da [Kent C. Dodds sul suo canale YouTube](https://www.youtube.com/watch?v=h7tur48JSaw), dove hanno discusso le preoccupazioni su React Server Components.
+* [Dan Abramov](https://bsky.app/profile/danabra.mov) e [Joe Savona](https://twitter.com/en_JS) sono stati ospiti del [podcast JSParty](https://jsparty.fm/267) e hanno condiviso i loro pensieri sul futuro di React.
-Thanks to [Andrew Clark](https://twitter.com/acdlite), [Dan Abramov](https://bsky.app/profile/danabra.mov), [Dave McCabe](https://twitter.com/mcc_abe), [Luna Wei](https://twitter.com/lunaleaps), [Matt Carroll](https://twitter.com/mattcarrollcode), [Sean Keegan](https://twitter.com/DevRelSean), [Sebastian Silbermann](https://twitter.com/sebsilbermann), [Seth Webster](https://twitter.com/sethwebster), and [Sophie Alpert](https://twitter.com/sophiebits) for reviewing this post.
+Grazie a [Andrew Clark](https://twitter.com/acdlite), [Dan Abramov](https://bsky.app/profile/danabra.mov), [Dave McCabe](https://twitter.com/mcc_abe), [Luna Wei](https://twitter.com/lunaleaps), [Matt Carroll](https://twitter.com/mattcarrollcode), [Sean Keegan](https://twitter.com/DevRelSean), [Sebastian Silbermann](https://twitter.com/sebsilbermann), [Seth Webster](https://twitter.com/sethwebster), e [Sophie Alpert](https://twitter.com/sophiebits) per aver revisionato questo post.
-Thanks for reading, and see you in the next update!
+Grazie per la lettura, ci vediamo nel prossimo aggiornamento!
diff --git a/src/content/blog/2023/05/03/react-canaries.md b/src/content/blog/2023/05/03/react-canaries.md
index c2e1a823e..bcf5f7c5a 100644
--- a/src/content/blog/2023/05/03/react-canaries.md
+++ b/src/content/blog/2023/05/03/react-canaries.md
@@ -1,17 +1,24 @@
---
-title: "React Canaries: Enabling Incremental Feature Rollout Outside Meta"
-author: Dan Abramov, Sophie Alpert, Rick Hanlon, Sebastian Markbage, and Andrew Clark
+title: "React Canaries: rollout incrementale delle funzionalità fuori da Meta"
+author: Dan Abramov, Sophie Alpert, Rick Hanlon, Sebastian Markbåge, and Andrew Clark
date: 2023/05/03
-description: We'd like to offer the React community an option to adopt individual new features as soon as their design is close to final, before they're released in a stable version--similar to how Meta has long used bleeding-edge versions of React internally. We are introducing a new officially supported [Canary release channel](/community/versioning-policy#canary-channel). It lets curated setups like frameworks decouple adoption of individual React features from the React release schedule.
+description: Vorremmo offrire alla community React l'opzione di adottare singole nuove funzionalità non appena il loro design è quasi definitivo, prima che vengano rilasciate in una versione stabile — in modo simile a come Meta usa da tempo internamente versioni bleeding-edge di React. Stiamo introducendo un nuovo [canale di release Canary](/community/versioning-policy#canary-channel) ufficialmente supportato. Permette a setup curati come i framework di disaccoppiare l'adozione delle singole funzionalità React dal calendario di release di React.
+translationStatus: ai-draft
---
-May 3, 2023 by [Dan Abramov](https://bsky.app/profile/danabra.mov), [Sophie Alpert](https://twitter.com/sophiebits), [Rick Hanlon](https://twitter.com/rickhanlonii), [Sebastian Markbåge](https://twitter.com/sebmarkbage), and [Andrew Clark](https://twitter.com/acdlite)
+3 maggio 2023 di [Dan Abramov](https://bsky.app/profile/danabra.mov), [Sophie Alpert](https://twitter.com/sophiebits), [Rick Hanlon](https://twitter.com/rickhanlonii), [Sebastian Markbåge](https://twitter.com/sebmarkbage) e [Andrew Clark](https://twitter.com/acdlite)
---
+<Note>
+
+Questa pagina è stata tradotta automaticamente e supervisionata da un maintainer. Un'ulteriore revisione da parte della community sarebbe comunque utile. [Migliora questa traduzione](https://github.com/reactjs/it.react.dev/edit/main/src/content/blog/2023/05/03/react-canaries.md).
+
+</Note>
+
<Intro>
-We'd like to offer the React community an option to adopt individual new features as soon as their design is close to final, before they're released in a stable version--similar to how Meta has long used bleeding-edge versions of React internally. We are introducing a new officially supported [Canary release channel](/community/versioning-policy#canary-channel). It lets curated setups like frameworks decouple adoption of individual React features from the React release schedule.
+Vorremmo offrire alla community React l'opzione di adottare singole nuove funzionalità non appena il loro design è quasi definitivo, prima che vengano rilasciate in una versione stabile — in modo simile a come Meta usa da tempo internamente versioni bleeding-edge di React. Stiamo introducendo un nuovo [canale di release Canary](/community/versioning-policy#canary-channel) ufficialmente supportato. Permette a setup curati come i framework di disaccoppiare l'adozione delle singole funzionalità React dal calendario di release di React.
</Intro>
@@ -19,79 +26,78 @@ We'd like to offer the React community an option to adopt individual new feature
## tl;dr {/*tldr*/}
-* We're introducing an officially supported [Canary release channel](/community/versioning-policy#canary-channel) for React. Since it's officially supported, if any regressions land, we'll treat them with a similar urgency to bugs in stable releases.
-* Canaries let you start using individual new React features before they land in the semver-stable releases.
-* Unlike the [Experimental](/community/versioning-policy#experimental-channel) channel, React Canaries only include features that we reasonably believe to be ready for adoption. We encourage frameworks to consider bundling pinned Canary React releases.
-* We will announce breaking changes and new features on our blog as they land in Canary releases.
-* **As always, React continues to follow semver for every Stable release.**
+* Stiamo introducendo un [canale di release Canary](/community/versioning-policy#canary-channel) ufficialmente supportato per React. Poiché è ufficialmente supportato, se finiscono regressioni le tratteremo con urgenza simile ai bug nelle release stabili.
+* Le Canary ti permettono di iniziare a usare singole nuove funzionalità React prima che arrivino nelle release semver-stabili.
+* A differenza del canale [Experimental](/community/versioning-policy#experimental-channel), le React Canaries includono solo funzionalità che riteniamo ragionevolmente pronte per l'adozione. Incoraggiamo i framework a considerare di includere release Canary di React fissate a un commit.
+* Annunceremo breaking change e nuove funzionalità sul nostro blog man mano che arrivano nelle release Canary.
+* **Come sempre, React continua a seguire semver per ogni release Stable.**
-## How React features are usually developed {/*how-react-features-are-usually-developed*/}
+## Come di solito vengono sviluppate le funzionalità React {/*how-react-features-are-usually-developed*/}
-Typically, every React feature has gone through the same stages:
+Tipicamente, ogni funzionalità React ha attraversato le stesse fasi:
-1. We develop an initial version and prefix it with `experimental_` or `unstable_`. The feature is only available in the `experimental` release channel. At this point, the feature is expected to change significantly.
-2. We find a team at Meta willing to help us test this feature and provide feedback on it. This leads to a round of changes. As the feature becomes more stable, we work with more teams at Meta to try it out.
-3. Eventually, we feel confident in the design. We remove the prefix from the API name, and make the feature available on the `main` branch by default, which most Meta products use. At this point, any team at Meta can use this feature.
-4. As we build confidence in the direction, we also post an RFC for the new feature. At this point we know the design works for a broad set of cases, but we might make some last minute adjustments.
-5. When we are close to cutting an open source release, we write documentation for the feature and finally release the feature in a stable React release.
+1. Sviluppiamo una versione iniziale e la prefissiamo con `experimental_` o `unstable_`. La funzionalità è disponibile solo nel canale di release `experimental`. A questo punto ci aspettiamo che cambi in modo significativo.
+2. Troviamo un team in Meta disposto ad aiutarci a testare la funzionalità e a darci feedback. Questo porta a un giro di modifiche. Man mano che la funzionalità diventa più stabile, lavoriamo con più team in Meta per provarla.
+3. Alla fine ci sentiamo sicuri del design. Rimuoviamo il prefisso dal nome dell'API e rendiamo la funzionalità disponibile di default sul branch `main`, che usano la maggior parte dei prodotti Meta. A questo punto qualsiasi team in Meta può usare la funzionalità.
+4. Man mano che acquisiamo fiducia nella direzione, pubblichiamo anche un RFC per la nuova funzionalità. A questo punto sappiamo che il design funziona per un'ampia gamma di casi, ma potremmo fare aggiustamenti dell'ultimo minuto.
+5. Quando siamo vicini a tagliare una release open source, scriviamo la documentazione per la funzionalità e infine la rilasciamo in una release stabile di React.
-This playbook works well for most features we've released so far. However, there can be a significant gap between when the feature is generally ready to use (step 3) and when it is released in open source (step 5).
+Questo playbook funziona bene per la maggior parte delle funzionalità rilasciate finora. Tuttavia, può esserci un divario significativo tra quando la funzionalità è generalmente pronta all'uso (fase 3) e quando viene rilasciata in open source (fase 5).
-**We'd like to offer the React community an option to follow the same approach as Meta, and adopt individual new features earlier (as they become available) without having to wait for the next release cycle of React.**
+**Vorremmo offrire alla community React l'opzione di seguire lo stesso approccio di Meta e adottare singole nuove funzionalità prima (non appena diventano disponibili) senza dover aspettare il prossimo ciclo di release di React.**
-As always, all React features will eventually make it into a Stable release.
+Come sempre, tutte le funzionalità React finiranno comunque in una release Stable.
-## Can we just do more minor releases? {/*can-we-just-do-more-minor-releases*/}
+## Non possiamo semplicemente fare più minor release? {/*can-we-just-do-more-minor-releases*/}
-Generally, we *do* use minor releases for introducing new features.
+In generale, *sì*, usiamo le minor release per introdurre nuove funzionalità.
-However, this isn't always possible. Sometimes, new features are interconnected with *other* new features which have not yet been fully completed and that we're still actively iterating on. We can't release them separately because their implementations are related. We can't version them separately because they affect the same packages (for example, `react` and `react-dom`). And we need to keep the ability to iterate on the pieces that aren't ready without a flurry of major version releases, which semver would require us to do.
+Tuttavia, non è sempre possibile. A volte le nuove funzionalità sono interconnesse con *altre* nuove funzionalità non ancora completamente finite e su cui stiamo ancora iterando attivamente. Non possiamo rilasciarle separatamente perché le loro implementazioni sono collegate. Non possiamo versionarle separatamente perché influenzano gli stessi pacchetti (ad esempio `react` e `react-dom`). E dobbiamo mantenere la possibilità di iterare sui pezzi non pronti senza una raffica di major release, che semver ci obbligherebbe a fare.
-At Meta, we've solved this problem by building React from the `main` branch, and manually updating it to a specific pinned commit every week. This is also the approach that React Native releases have been following for the last several years. Every *stable* release of React Native is pinned to a specific commit from the `main` branch of the React repository. This lets React Native include important bugfixes and incrementally adopt new React features at the framework level without getting coupled to the global React release schedule.
+In Meta abbiamo risolto questo problema compilando React dal branch `main` e aggiornandolo manualmente a un commit specifico fissato ogni settimana. È anche l'approccio che le release di React Native seguono da diversi anni. Ogni release *stabile* di React Native è fissata a un commit specifico del branch `main` del repository React. Questo permette a React Native di includere bugfix importanti e adottare incrementalmente nuove funzionalità React a livello di framework senza accoppiarsi al calendario globale di release di React.
-We would like to make this workflow available to other frameworks and curated setups. For example, it lets a framework *on top of* React include a React-related breaking change *before* this breaking change gets included into a stable React release. This is particularly useful because some breaking changes only affect framework integrations. This lets a framework release such a change in its own minor version without breaking semver.
+Vorremmo rendere disponibile questo workflow ad altri framework e setup curati. Ad esempio, permette a un framework *sopra* React di includere una breaking change legata a React *prima* che quella breaking change finisca in una release stabile di React. È particolarmente utile perché alcune breaking change riguardano solo le integrazioni con i framework. Permette a un framework di rilasciare una modifica del genere nella propria minor version senza violare semver.
-Rolling releases with the Canaries channel will allow us to have a tighter feedback loop and ensure that new features get comprehensive testing in the community. This workflow is closer to how TC39, the JavaScript standards committee, [handles changes in numbered stages](https://tc39.es/process-document/). New React features may be available in frameworks built on React before they are in a React stable release, just as new JavaScript features ship in browsers before they are officially ratified as part of the specification.
+Le rolling release con il canale Canaries ci permetteranno di avere un feedback loop più stretto e di assicurarci che le nuove funzionalità ricevano test completi nella community. Questo workflow è più vicino a come TC39, il comitato degli standard JavaScript, [gestisce le modifiche in fasi numerate](https://tc39.es/process-document/). Nuove funzionalità React possono essere disponibili nei framework costruiti su React prima che siano in una release stabile di React, proprio come nuove funzionalità JavaScript arrivano nei browser prima di essere ufficialmente ratificate come parte della specifica.
-## Why not use experimental releases instead? {/*why-not-use-experimental-releases-instead*/}
+## Perché non usare le release experimental? {/*why-not-use-experimental-releases-instead*/}
-Although you *can* technically use [Experimental releases](/community/versioning-policy#canary-channel), we recommend against using them in production because experimental APIs can undergo significant breaking changes on their way to stabilization (or can even be removed entirely). While Canaries can also contain mistakes (as with any release), going forward we plan to announce any significant breaking changes in Canaries on our blog. Canaries are the closest to the code Meta runs internally, so you can generally expect them to be relatively stable. However, you *do* need to keep the version pinned and manually scan the GitHub commit log when updating between the pinned commits.
+Anche se *tecnicamente* puoi usare le [release Experimental](/community/versioning-policy#experimental-channel), sconsigliamo di usarle in produzione perché le API experimental possono subire breaking change significative sulla strada verso la stabilizzazione (o possono anche essere rimosse del tutto). Sebbene anche le Canary possano contenere errori (come qualsiasi release), d'ora in poi prevediamo di annunciare sul nostro blog eventuali breaking change significative nelle Canary. Le Canary sono le più vicine al codice che Meta esegue internamente, quindi in generale puoi aspettarti che siano relativamente stabili. Tuttavia, *devi* mantenere la versione fissata e scansionare manualmente il log dei commit su GitHub quando aggiorni tra commit fissati.
-**We expect that most people using React outside a curated setup (like a framework) will want to continue using the Stable releases.** However, if you're building a framework, you might want to consider bundling a Canary version of React pinned to a particular commit, and update it at your own pace. The benefit of that is that it lets you ship individual completed React features and bugfixes earlier for your users and at your own release schedule, similar to how React Native has been doing it for the last few years. The downside is that you would take on additional responsibility to review which React commits are being pulled in and communicate to your users which React changes are included with your releases.
+**Ci aspettiamo che la maggior parte delle persone che usano React fuori da un setup curato (come un framework) continui a usare le release Stable.** Tuttavia, se stai costruendo un framework, potresti considerare di includere una versione Canary di React fissata a un commit particolare e aggiornarla al tuo ritmo. Il vantaggio è che ti permette di rilasciare singole funzionalità e bugfix React completate prima per i tuoi utenti e secondo il tuo calendario di release, in modo simile a come fa React Native da diversi anni. Lo svantaggio è che ti assumi la responsabilità aggiuntiva di revisionare quali commit React vengono inclusi e di comunicare ai tuoi utenti quali modifiche React sono incluse nelle tue release.
-If you're a framework author and want to try this approach, please get in touch with us.
+Se sei autore di un framework e vuoi provare questo approccio, contattaci.
-## Announcing breaking changes and new features early {/*announcing-breaking-changes-and-new-features-early*/}
+## Annunciare in anticipo breaking change e nuove funzionalità {/*announcing-breaking-changes-and-new-features-early*/}
-Canary releases represent our best guess of what will go into the next stable React release at any given time.
+Le release Canary rappresentano la nostra migliore ipotesi su cosa finirà nella prossima release stabile di React in un dato momento.
-Traditionally, we've only announced breaking changes at the *end* of the release cycle (when doing a major release). Now that Canary releases are an officially supported way to consume React, we plan to shift towards announcing breaking changes and significant new features *as they land* in Canaries. For example, if we merge a breaking change that will go out in a Canary, we will write a post about it on the React blog, including codemods and migration instructions if necessary. Then, if you're a framework author cutting a major release that updates the pinned React canary to include that change, you can link to our blog post from your release notes. Finally, when a stable major version of React is ready, we will link to those already published blog posts, which we hope will help our team make progress faster.
+Tradizionalmente abbiamo annunciato le breaking change solo alla *fine* del ciclo di release (quando facciamo una major release). Ora che le release Canary sono un modo ufficialmente supportato per consumare React, prevediamo di spostarci verso l'annuncio di breaking change e nuove funzionalità significative *non appena arrivano* nelle Canary. Ad esempio, se mergiamo una breaking change che uscirà in una Canary, scriveremo un post sul blog React, inclusi codemod e istruzioni di migrazione se necessario. Poi, se sei autore di un framework che taglia una major release aggiornando la canary React fissata per includere quella modifica, puoi linkare al nostro post del blog dalle tue release note. Infine, quando una major version stabile di React è pronta, linkeremo a quei post già pubblicati, sperando che questo aiuti il nostro team a procedere più velocemente.
-We plan to document APIs as they land in Canaries--even if these APIs are not yet available outside of them. APIs that are only available in Canaries will be marked with a special note on the corresponding pages. This will include APIs like [`use`](https://github.com/reactjs/rfcs/pull/229), and some others (like `cache` and `createServerContext`) which we'll send RFCs for.
+Prevediamo di documentare le API man mano che arrivano nelle Canary — anche se queste API non sono ancora disponibili al di fuori di esse. Le API disponibili solo nelle Canary saranno contrassegnate con una nota speciale sulle pagine corrispondenti. Questo includerà API come [`use`](https://github.com/reactjs/rfcs/pull/229) e altre (come `cache` e `createServerContext`) per cui invieremo RFC.
-## Canaries must be pinned {/*canaries-must-be-pinned*/}
+## Le Canary devono essere fissate {/*canaries-must-be-pinned*/}
-If you decide to adopt the Canary workflow for your app or framework, make sure you always pin the *exact* version of the Canary you're using. Since Canaries are pre-releases, they may still include breaking changes.
+Se decidi di adottare il workflow Canary per la tua app o framework, assicurati di fissare sempre la versione *esatta* della Canary che stai usando. Poiché le Canary sono pre-release, possono ancora includere breaking change.
-## Example: React Server Components {/*example-react-server-components*/}
+## Esempio: React Server Components {/*example-react-server-components*/}
-As we [announced in March](/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023#react-server-components), the React Server Components conventions have been finalized, and we do not expect significant breaking changes related to their user-facing API contract. However, we can't release support for React Server Components in a stable version of React yet because we are still working on several intertwined framework-only features (such as [asset loading](/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023#asset-loading)) and expect more breaking changes there.
+Come [abbiamo annunciato a marzo](/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023#react-server-components), le convenzioni di React Server Components sono state finalizzate e non ci aspettiamo breaking change significative legate al loro contratto API user-facing. Tuttavia, non possiamo ancora rilasciare il supporto per React Server Components in una versione stabile di React perché stiamo ancora lavorando su diverse funzionalità solo-framework interconnesse (come il [caricamento delle risorse](/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023#asset-loading)) e ci aspettiamo altre breaking change lì.
-This means that React Server Components are ready to be adopted by frameworks. However, until the next major React release, the only way for a framework to adopt them is to ship a pinned Canary version of React. (To avoid bundling two copies of React, frameworks that wish to do this would need to enforce resolution of `react` and `react-dom` to the pinned Canary they ship with their framework, and explain that to their users. As an example, this is what Next.js App Router does.)
+Questo significa che React Server Components sono pronti per essere adottati dai framework. Tuttavia, fino alla prossima major release di React, l'unico modo per un framework di adottarli è rilasciare una versione Canary di React fissata. (Per evitare di includere due copie di React, i framework che vogliono farlo dovrebbero imporre la risoluzione di `react` e `react-dom` alla Canary fissata che rilasciano con il framework, e spiegarlo ai loro utenti. Come esempio, è quello che fa Next.js App Router.)
-## Testing libraries against both Stable and Canary versions {/*testing-libraries-against-both-stable-and-canary-versions*/}
+## Testare le librerie contro versioni Stable e Canary {/*testing-libraries-against-both-stable-and-canary-versions*/}
-We do not expect library authors to test every single Canary release since it would be prohibitively difficult. However, just as when we [originally introduced the different React pre-release channels three years ago](https://legacy.reactjs.org/blog/2019/10/22/react-release-channels.html), we encourage libraries to run tests against *both* the latest Stable and latest Canary versions. If you see a change in behavior that wasn't announced, please file a bug in the React repository so that we can help diagnose it. We expect that as this practice becomes widely adopted, it will reduce the amount of effort necessary to upgrade libraries to new major versions of React, since accidental regressions would be found as they land.
+Non ci aspettiamo che gli autori di librerie testino ogni singola release Canary perché sarebbe prohibitivamente difficile. Tuttavia, proprio come quando [abbiamo introdotto per la prima volta i diversi canali pre-release di React tre anni fa](https://legacy.reactjs.org/blog/2019/10/22/react-release-channels.html), incoraggiamo le librerie a eseguire test sia contro l'ultima versione Stable sia contro l'ultima Canary. Se vedi un cambiamento di comportamento non annunciato, segnala un bug nel repository React così possiamo aiutarti a diagnosticarlo. Ci aspettiamo che man mano che questa pratica diventa ampiamente adottata, riduca lo sforzo necessario per aggiornare le librerie a nuove major version di React, perché regressioni accidentali verrebbero trovate non appena arrivano.
<Note>
-Strictly speaking, Canary is not a *new* release channel--it used to be called Next. However, we've decided to rename it to avoid confusion with Next.js. We're announcing it as a *new* release channel to communicate the new expectations, such as Canaries being an officially supported way to use React.
+Strettamente parlando, Canary non è un canale di release *nuovo* — si chiamava Next. Tuttavia, abbiamo deciso di rinominarlo per evitare confusione con Next.js. Lo annunciamo come canale di release *nuovo* per comunicare le nuove aspettative, come il fatto che le Canary sono un modo ufficialmente supportato per usare React.
</Note>
-## Stable releases work like before {/*stable-releases-work-like-before*/}
-
-We are not introducing any changes to stable React releases.
+## Le release stabili funzionano come prima {/*stable-releases-work-like-before*/}
+Non stiamo introducendo alcuna modifica alle release stabili di React.
diff --git a/src/sidebarBlog.json b/src/sidebarBlog.json
index 9008e34fb..0fafa9f01 100644
--- a/src/sidebarBlog.json
+++ b/src/sidebarBlog.json
@@ -124,22 +124,22 @@
"path": "/blog/2024/02/15/react-labs-what-we-have-been-working-on-february-2024"
},
{
- "title": "React Canaries: Enabling Incremental Feature Rollout Outside Meta",
- "titleForHomepage": "React Canaries: Incremental Feature Rollout",
+ "title": "React Canaries: rollout incrementale delle funzionalità fuori da Meta",
+ "titleForHomepage": "React Canaries: rollout incrementale",
"icon": "blog",
"date": "May 3, 2023",
"path": "/blog/2023/05/03/react-canaries"
},
{
- "title": "React Labs: What We've Been Working On – March 2023",
- "titleForHomepage": "React Labs: March 2023",
+ "title": "React Labs: su cosa stiamo lavorando – marzo 2023",
+ "titleForHomepage": "React Labs: marzo 2023",
"icon": "labs",
"date": "March 22, 2023",
"path": "/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023"
},
{
- "title": "Introducing react.dev",
- "titleForHomepage": "Introducing react.dev",
+ "title": "Presentiamo react.dev",
+ "titleForHomepage": "Presentiamo react.dev",
"icon": "blog",
"date": "March 16, 2023",
"path": "/blog/2023/03/16/introducing-react-dev"