(instance = current)} />
+
{instance = current}} />
```
-The original code returned the instance of the `HTMLDivElement` and TypeScript wouldn't know if this was _supposed_ to be a cleanup function or if you didn't want to return a cleanup function.
+Il codice originale restituiva l'istanza dell'`HTMLDivElement` e TypeScript non sapeva se _doveva_ essere una cleanup function o se non volevi restituire una cleanup function.
-You can codemod this pattern with [`no-implicit-ref-callback-return`](https://github.com/eps1lon/types-react-codemod/#no-implicit-ref-callback-return).
+Puoi fare codemod di questo pattern con [`no-implicit-ref-callback-return`](https://github.com/eps1lon/types-react-codemod/#no-implicit-ref-callback-return).
-### `useDeferredValue` initial value {/*use-deferred-value-initial-value*/}
+### Valore iniziale di `useDeferredValue` {/*use-deferred-value-initial-value*/}
-We've added an `initialValue` option to `useDeferredValue`:
+Abbiamo aggiunto un'opzione `initialValue` a `useDeferredValue`:
```js [[1, 1, "deferredValue"], [1, 4, "deferredValue"], [2, 4, "''"]]
function Search({deferredValue}) {
@@ -558,15 +566,15 @@ function Search({deferredValue}) {
}
````
-When initialValue is provided, `useDeferredValue` will return it as `value` for the initial render of the component, and schedules a re-render in the background with the deferredValue returned.
+Quando initialValue è fornito, `useDeferredValue` lo restituirà come `value` per il render iniziale del componente e pianificherà una ri-renderizzazione in background con il deferredValue restituito.
-For more, see [`useDeferredValue`](/reference/react/useDeferredValue).
+Per approfondire, consulta [`useDeferredValue`](/reference/react/useDeferredValue).
-### Support for Document Metadata {/*support-for-metadata-tags*/}
+### Supporto per Document Metadata {/*support-for-metadata-tags*/}
-In HTML, document metadata tags like `
`, `<link>`, and `<meta>` are reserved for placement in the `<head>` section of the document. In React, the component that decides what metadata is appropriate for the app may be very far from the place where you render the `<head>` or React does not render the `<head>` at all. In the past, these elements would need to be inserted manually in an effect, or by libraries like [`react-helmet`](https://github.com/nfl/react-helmet), and required careful handling when server rendering a React application.
+In HTML, i tag di metadata del documento come `<title>`, `<link>` e `<meta>` sono riservati al posizionamento nella sezione `<head>` del documento. In React, il componente che decide quale metadata è appropriato per l'app può essere molto lontano dal punto in cui renderizzi il `<head>` o React non renderizza affatto il `<head>`. In passato, questi elementi dovevano essere inseriti manualmente in un effetto o da librerie come [`react-helmet`](https://github.com/nfl/react-helmet), e richiedevano gestione attenta durante il server rendering di un'applicazione React.
-In React 19, we're adding support for rendering document metadata tags in components natively:
+In React 19 aggiungiamo supporto per renderizzare tag di metadata del documento nei componenti nativamente:
```js {5-8}
function BlogPost({post}) {
@@ -585,23 +593,23 @@ function BlogPost({post}) {
}
```
-When React renders this component, it will see the `<title>` `<link>` and `<meta>` tags, and automatically hoist them to the `<head>` section of document. By supporting these metadata tags natively, we're able to ensure they work with client-only apps, streaming SSR, and Server Components.
+Quando React renderizza questo componente, vedrà i tag `<title>`, `<link>` e `<meta>` e li solleverà automaticamente nella sezione `<head>` del documento. Supportando nativamente questi tag di metadata, possiamo assicurarci che funzionino con app solo client, streaming SSR e Server Components.
<Note>
-#### You may still want a Metadata library {/*you-may-still-want-a-metadata-library*/}
+#### Potresti comunque volere una libreria Metadata {/*you-may-still-want-a-metadata-library*/}
-For simple use cases, rendering Document Metadata as tags may be suitable, but libraries can offer more powerful features like overriding generic metadata with specific metadata based on the current route. These features make it easier for frameworks and libraries like [`react-helmet`](https://github.com/nfl/react-helmet) to support metadata tags, rather than replace them.
+Per casi d'uso semplici, renderizzare Document Metadata come tag può essere adatto, ma le librerie possono offrire funzionalità più potenti come sovrascrivere metadata generici con metadata specifici in base alla route corrente. Queste funzionalità rendono più semplice per framework e librerie come [`react-helmet`](https://github.com/nfl/react-helmet) supportare tag di metadata, piuttosto che sostituirli.
</Note>
-For more info, see the docs for [`<title>`](/reference/react-dom/components/title), [`<link>`](/reference/react-dom/components/link), and [`<meta>`](/reference/react-dom/components/meta).
+Per maggiori informazioni, consulta la documentazione di [`<title>`](/reference/react-dom/components/title), [`<link>`](/reference/react-dom/components/link), and [`<meta>`](/reference/react-dom/components/meta).
-### Support for stylesheets {/*support-for-stylesheets*/}
+### Supporto per stylesheet {/*support-for-stylesheets*/}
-Stylesheets, both externally linked (`<link rel="stylesheet" href="...">`) and inline (`<style>...</style>`), require careful positioning in the DOM due to style precedence rules. Building a stylesheet capability that allows for composability within components is hard, so users often end up either loading all of their styles far from the components that may depend on them, or they use a style library which encapsulates this complexity.
+Gli stylesheet, sia collegati esternamente (`<link rel="stylesheet" href="...">`) sia inline (`<style>...</style>`), richiedono posizionamento attento nel DOM a causa delle regole di precedenza degli stili. Costruire una capacità stylesheet che permetta componibilità nei componenti è difficile, quindi gli utenti spesso finiscono per caricare tutti gli stili lontano dai componenti che possono dipenderne, oppure usano una libreria di stili che incapsula questa complessità.
-In React 19, we're addressing this complexity and providing even deeper integration into Concurrent Rendering on the Client and Streaming Rendering on the Server with built in support for stylesheets. If you tell React the `precedence` of your stylesheet it will manage the insertion order of the stylesheet in the DOM and ensure that the stylesheet (if external) is loaded before revealing content that depends on those style rules.
+In React 19 affrontiamo questa complessità e forniamo un'integrazione ancora più profonda nel Concurrent Rendering sul Client e nello Streaming Rendering sul Server con supporto integrato per gli stylesheet. Se dici a React la `precedence` del tuo stylesheet, gestirà l'ordine di inserimento dello stylesheet nel DOM e assicurerà che lo stylesheet (se esterno) sia caricato prima di rivelare contenuto che dipende da quelle regole di stile.
```js {4,5,17}
function ComponentOne() {
@@ -626,9 +634,9 @@ function ComponentTwo() {
}
```
-During Server Side Rendering React will include the stylesheet in the `<head>`, which ensures that the browser will not paint until it has loaded. If the stylesheet is discovered late after we've already started streaming, React will ensure that the stylesheet is inserted into the `<head>` on the client before revealing the content of a Suspense boundary that depends on that stylesheet.
+Durante il Server Side Rendering React includerà lo stylesheet nel `<head>`, assicurando che il browser non faccia paint finché non è caricato. Se lo stylesheet viene scoperto tardi dopo che abbiamo già iniziato lo streaming, React assicurerà che lo stylesheet venga inserito nel `<head>` sul client prima di rivelare il contenuto di un boundary Suspense che dipende da quello stylesheet.
-During Client Side Rendering React will wait for newly rendered stylesheets to load before committing the render. If you render this component from multiple places within your application React will only include the stylesheet once in the document:
+Durante il Client Side Rendering React aspetterà che i nuovi stylesheet renderizzati siano caricati prima di committare il render. Se renderizzi questo componente da più punti nella tua applicazione, React includerà lo stylesheet nel documento una sola volta:
```js {5}
function App() {
@@ -640,17 +648,17 @@ function App() {
}
```
-For users accustomed to loading stylesheets manually this is an opportunity to locate those stylesheets alongside the components that depend on them allowing for better local reasoning and an easier time ensuring you only load the stylesheets that you actually depend on.
+Per gli utenti abituati a caricare stylesheet manualmente, questa è un'opportunità per posizionare quegli stylesheet accanto ai componenti che dipendono da essi, permettendo un migliore ragionamento locale e rendendo più semplice assicurarsi di caricare solo gli stylesheet di cui hai effettivamente bisogno.
-Style libraries and style integrations with bundlers can also adopt this new capability so even if you don't directly render your own stylesheets, you can still benefit as your tools are upgraded to use this feature.
+Le librerie di stili e le integrazioni di stile con i bundler possono anche adottare questa nuova capacità, quindi anche se non renderizzi direttamente i tuoi stylesheet, puoi comunque beneficiarne man mano che i tuoi strumenti vengono aggiornati per usare questa funzionalità.
-For more details, read the docs for [`<link>`](/reference/react-dom/components/link) and [`<style>`](/reference/react-dom/components/style).
+Per maggiori dettagli, consulta la documentazione di [`<link>`](/reference/react-dom/components/link) and [`<style>`](/reference/react-dom/components/style).
-### Support for async scripts {/*support-for-async-scripts*/}
+### Supporto per script async {/*support-for-async-scripts*/}
-In HTML normal scripts (`<script src="...">`) and deferred scripts (`<script defer="" src="...">`) load in document order which makes rendering these kinds of scripts deep within your component tree challenging. Async scripts (`<script async="" src="...">`) however will load in arbitrary order.
+In HTML, gli script normali (`<script src="...">`) e gli script deferred (`<script defer="" src="...">`) si caricano nell'ordine del documento, il che rende difficile renderizzare questi tipi di script in profondità nell'albero dei componenti. Gli script async (`<script async="" src="...">`) invece si caricano in ordine arbitrario.
-In React 19 we've included better support for async scripts by allowing you to render them anywhere in your component tree, inside the components that actually depend on the script, without having to manage relocating and deduplicating script instances.
+In React 19 abbiamo incluso un supporto migliore per gli script async permettendoti di renderizzarli ovunque nell'albero dei componenti, dentro i componenti che effettivamente dipendono dallo script, senza dover gestire lo spostamento e la deduplicazione delle istanze script.
```js {4,15}
function MyComponent() {
@@ -673,17 +681,17 @@ function App() {
}
```
-In all rendering environments, async scripts will be deduplicated so that React will only load and execute the script once even if it is rendered by multiple different components.
+In tutti gli ambienti di rendering, gli script async verranno deduplicati così che React caricherà ed eseguirà lo script una sola volta anche se viene renderizzato da più componenti diversi.
-In Server Side Rendering, async scripts will be included in the `<head>` and prioritized behind more critical resources that block paint such as stylesheets, fonts, and image preloads.
+Nel Server Side Rendering, gli script async verranno inclusi nel `<head>` e prioritizzati dietro risorse più critiche che bloccano il paint come stylesheet, font e preload di immagini.
-For more details, read the docs for [`<script>`](/reference/react-dom/components/script).
+Per maggiori dettagli, consulta la documentazione di [`<script>`](/reference/react-dom/components/script).
-### Support for preloading resources {/*support-for-preloading-resources*/}
+### Supporto per preload delle risorse {/*support-for-preloading-resources*/}
-During initial document load and on client side updates, telling the Browser about resources that it will likely need to load as early as possible can have a dramatic effect on page performance.
+Durante il caricamento iniziale del documento e negli aggiornamenti client side, informare il Browser delle risorse che probabilmente dovrà caricare il prima possibile può avere un effetto drammatico sulle performance della pagina.
-React 19 includes a number of new APIs for loading and preloading Browser resources to make it as easy as possible to build great experiences that aren't held back by inefficient resource loading.
+React 19 include diverse nuove API per caricare e pre-caricare risorse del Browser per rendere il più semplice possibile costruire grandi esperienze non limitate da un caricamento inefficiente delle risorse.
```js
import { prefetchDNS, preconnect, preload, preinit } from 'react-dom'
@@ -712,23 +720,23 @@ function MyComponent() {
</html>
```
-These APIs can be used to optimize initial page loads by moving discovery of additional resources like fonts out of stylesheet loading. They can also make client updates faster by prefetching a list of resources used by an anticipated navigation and then eagerly preloading those resources on click or even on hover.
+Queste API possono essere usate per ottimizzare i caricamenti iniziali della pagina spostando la scoperta di risorse aggiuntive come i font fuori dal caricamento degli stylesheet. Possono anche rendere gli aggiornamenti client più veloci prefetchando un elenco di risorse usate da una navigazione anticipata e poi pre-caricando eager quelle risorse al click o persino all'hover.
-For more details see [Resource Preloading APIs](/reference/react-dom#resource-preloading-apis).
+Per maggiori dettagli consulta le [Resource Preloading APIs](/reference/react-dom#resource-preloading-apis).
-### Compatibility with third-party scripts and extensions {/*compatibility-with-third-party-scripts-and-extensions*/}
+### Compatibilità con script di terze parti ed estensioni {/*compatibility-with-third-party-scripts-and-extensions*/}
-We've improved hydration to account for third-party scripts and browser extensions.
+Abbiamo migliorato l'hydration per tenere conto di script di terze parti ed estensioni del browser.
-When hydrating, if an element that renders on the client doesn't match the element found in the HTML from the server, React will force a client re-render to fix up the content. Previously, if an element was inserted by third-party scripts or browser extensions, it would trigger a mismatch error and client render.
+Durante l'hydration, se un elemento renderizzato sul client non corrisponde all'elemento trovato nell'HTML dal server, React forzerà una ri-renderizzazione lato client per correggere il contenuto. In precedenza, se un elemento veniva inserito da script di terze parti o estensioni del browser, scatenava un errore di mismatch e una renderizzazione lato client.
-In React 19, unexpected tags in the `<head>` and `<body>` will be skipped over, avoiding the mismatch errors. If React needs to re-render the entire document due to an unrelated hydration mismatch, it will leave in place stylesheets inserted by third-party scripts and browser extensions.
+In React 19, i tag inaspettati in `<head>` e `<body>` verranno saltati, evitando errori di mismatch. Se React deve re-renderizzare l'intero documento a causa di un hydration mismatch non correlato, lascerà in place gli stylesheet inseriti da script di terze parti ed estensioni del browser.
-### Better error reporting {/*error-handling*/}
+### Migliore segnalazione errori {/*error-handling*/}
-We improved error handling in React 19 to remove duplication and provide options for handling caught and uncaught errors. For example, when there's an error in render caught by an Error Boundary, previously React would throw the error twice (once for the original error, then again after failing to automatically recover), and then call `console.error` with info about where the error occurred.
+Abbiamo migliorato la gestione errori in React 19 per rimuovere la duplicazione e fornire opzioni per gestire errori catturati e non catturati. Ad esempio, quando c'è un errore in render catturato da un contenitore di errori, in precedenza React lanciava l'errore due volte (una per l'errore originale, poi di nuovo dopo il fallimento del recupero automatico) e poi chiamava `console.error` con info su dove è avvenuto l'errore.
-This resulted in three errors for every caught error:
+Questo produceva tre errori per ogni errore catturato:
<ConsoleBlockMulti>
@@ -762,7 +770,7 @@ React will try to recreate this component tree from scratch using the error boun
</ConsoleBlockMulti>
-In React 19, we log a single error with all the error information included:
+In React 19, registriamo un singolo errore con tutte le informazioni sull'errore incluse:
<ConsoleBlockMulti>
@@ -784,27 +792,27 @@ React will try to recreate this component tree from scratch using the error boun
</ConsoleBlockMulti>
-Additionally, we've added two new root options to complement `onRecoverableError`:
+Inoltre, abbiamo aggiunto due nuove opzioni root per complementare `onRecoverableError`:
-- `onCaughtError`: called when React catches an error in an Error Boundary.
-- `onUncaughtError`: called when an error is thrown and not caught by an Error Boundary.
-- `onRecoverableError`: called when an error is thrown and automatically recovered.
+- `onCaughtError`: chiamato quando React cattura un errore in un contenitore di errori.
+- `onUncaughtError`: chiamato quando un errore viene lanciato e non catturato da un contenitore di errori.
+- `onRecoverableError`: chiamato quando un errore viene lanciato e recuperato automaticamente.
-For more info and examples, see the docs for [`createRoot`](/reference/react-dom/client/createRoot) and [`hydrateRoot`](/reference/react-dom/client/hydrateRoot).
+Per maggiori informazioni ed esempi, consulta la documentazione di [`createRoot`](/reference/react-dom/client/createRoot) e [`hydrateRoot`](/reference/react-dom/client/hydrateRoot).
-### Support for Custom Elements {/*support-for-custom-elements*/}
+### Supporto per Custom Elements {/*support-for-custom-elements*/}
-React 19 adds full support for custom elements and passes all tests on [Custom Elements Everywhere](https://custom-elements-everywhere.com/).
+React 19 aggiunge supporto completo per custom element e supera tutti i test su [Custom Elements Everywhere](https://custom-elements-everywhere.com/).
-In past versions, using Custom Elements in React has been difficult because React treated unrecognized props as attributes rather than properties. In React 19, we've added support for properties that works on the client and during SSR with the following strategy:
+Nelle versioni passate, usare Custom Elements in React è stato difficile perché React trattava props non riconosciute come attributi piuttosto che proprietà. In React 19, abbiamo aggiunto supporto per proprietà che funziona sul client e durante SSR con la seguente strategia:
-- **Server Side Rendering**: props passed to a custom element will render as attributes if their type is a primitive value like `string`, `number`, or the value is `true`. Props with non-primitive types like `object`, `symbol`, `function`, or value `false` will be omitted.
-- **Client Side Rendering**: props that match a property on the Custom Element instance will be assigned as properties, otherwise they will be assigned as attributes.
+- **Server Side Rendering**: le props passate a un custom element verranno renderizzate come attributi se il loro tipo è un valore primitivo come `string`, `number`, o il valore è `true`. Props con tipi non primitivi come `object`, `symbol`, `function`, o valore `false` verranno omesse.
+- **Client Side Rendering**: le props che corrispondono a una proprietà sull'istanza del Custom Element verranno assegnate come proprietà, altrimenti verranno assegnate come attributi.
-Thanks to [Joey Arhar](https://github.com/josepharhar) for driving the design and implementation of Custom Element support in React.
+Grazie a [Joey Arhar](https://github.com/josepharhar) per aver guidato il design e l'implementazione del supporto Custom Element in React.
-#### How to upgrade {/*how-to-upgrade*/}
-See the [React 19 Upgrade Guide](/blog/2024/04/25/react-19-upgrade-guide) for step-by-step instructions and a full list of breaking and notable changes.
+#### Come effettuare l'upgrade {/*how-to-upgrade*/}
+Consulta la [Guida all'upgrade a React 19](/blog/2024/04/25/react-19-upgrade-guide) per istruzioni passo passo e l'elenco completo di breaking change e modifiche rilevanti.
-_Note: this post was originally published 04/25/2024 and has been updated to 12/05/2024 with the stable release._
+_Nota: questo post è stato pubblicato originariamente il 25/04/2024 ed è stato aggiornato al 05/12/2024 con il rilascio stabile._
diff --git a/src/sidebarBlog.json b/src/sidebarBlog.json
index 0fafa9f01..12f278cea 100644
--- a/src/sidebarBlog.json
+++ b/src/sidebarBlog.json
@@ -68,8 +68,8 @@
"path": "/blog/2025/10/01/react-19-2"
},
{
- "title": "React Labs: View Transitions, Activity, and more",
- "titleForHomepage": "View Transitions and Activity",
+ "title": "React Labs: View Transitions, Activity e altro",
+ "titleForHomepage": "View Transitions e Activity",
"icon": "blog",
"date": "April 23, 2025",
"path": "/blog/2025/04/23/react-labs-view-transitions-activity-and-more"
@@ -89,15 +89,15 @@
"path": "/blog/2024/12/05/react-19"
},
{
- "title": "React Compiler Beta Release",
- "titleForHomepage": "React Compiler Beta Release and Roadmap",
+ "title": "React Compiler: rilascio Beta",
+ "titleForHomepage": "React Compiler: rilascio Beta e roadmap",
"icon": "blog",
"date": "October 21, 2024",
"path": "/blog/2024/10/21/react-compiler-beta-release"
},
{
- "title": "React Conf 2024 Recap",
- "titleForHomepage": "React Conf 2024 Recap",
+ "title": "React Conf 2024: il riepilogo",
+ "titleForHomepage": "React Conf 2024: il riepilogo",
"icon": "blog",
"date": "May 22, 2024",
"path": "/blog/2024/05/22/react-conf-2024-recap"
@@ -110,15 +110,15 @@
"path": "/blog/2024/04/25/react-19"
},
{
- "title": "React 19 Upgrade Guide",
- "titleForHomepage": "React 19 RC Upgrade Guide",
+ "title": "Guida all'upgrade a React 19",
+ "titleForHomepage": "Guida all'upgrade a React 19 RC",
"icon": "blog",
"date": "April 25, 2024",
"path": "/blog/2024/04/25/react-19-upgrade-guide"
},
{
- "title": "React Labs: What We've Been Working On – February 2024",
- "titleForHomepage": "React Labs: February 2024",
+ "title": "React Labs: su cosa stiamo lavorando – febbraio 2024",
+ "titleForHomepage": "React Labs: febbraio 2024",
"icon": "labs",
"date": "February 15, 2024",
"path": "/blog/2024/02/15/react-labs-what-we-have-been-working-on-february-2024"