← tutti i corsi
// corso · 2026react
React: State Management & Performance
Panoramica sulle strategie di state management in React: API native, Context, Redux Toolkit, Zustand, TanStack Query.
- Durata
- 12h
- Sessioni
- 3 da 4h
- Livello
- Intermedio
[ descrizione ]Di cosa parla
Di cosa parla
questo corso.
Contesto, obiettivi e taglio del corso. Tutto è personalizzabile in base a stack e team — questa è la base di partenza.
Introduzione
La gestione dello stato è una delle attività più complesse durante lo sviluppo di Single Page Applications, soprattutto quando le UI sono molto sofisticate e diversi stati sono in relazione tra loro.
Questa Master class ti aiuterà a:
Questa Master class ti aiuterà a:
- • comprendere diverse strategie per la gestione dello stato locale e globale in React allo scopo di valutare la più adatta alle necessità progettuali
- • individuare e risolvere problemi legati alle performance
Riassunto argomenti
Il corso fornisce una paranomica sulle seguenti funzionalità:
Librerie come Redux Toolkit e TanStack Query offrono moltissime funzionalità ed API e in questo corso introduttivo non avremo modo di approfondire questi argomenti.
Per questo motivo, nel catalogo corsi, trovate diverse sessioni di approfondimento.
- •
useStateeuseReducer(in TypeScript) - • drilling props vs composition
- •
ContextAPI: quando utilizzarlo e quando evitare - • Global State Management con Zustand
- • Global State Management con Redux Toolkit
- • React Router e fetch / loader API
- • TanStack Query
Librerie come Redux Toolkit e TanStack Query offrono moltissime funzionalità ed API e in questo corso introduttivo non avremo modo di approfondire questi argomenti.
Per questo motivo, nel catalogo corsi, trovate diverse sessioni di approfondimento.
Panoramica contenuti
Il corso si divide essenzialmente in due parti:
1. La prima parte del corso è dedicata all'analisi delle API di React per la gestione dello stato locale e globale tramite l'utilizzo di useState, useRedux e Context ma soprattutto al loro impatto sulle performance. Vedremo quindi come ottimizzare render e performance tramite l'utilizzo diverse strategie di ottimizzazione e debug. Oltre a comprendere la gestione dello stato, questa sessione risulterà molto utile per comprendere a fondo il funzionamento di React e del suo motore di rendering.
2. Nella seconda parte, la più ampia dal punto di vista della durata, metteremo a confronto diverse tecniche per la gestione dello stato globale in applicazioni React, utilizzando differenti pattern, API e librerie.
Perchè questi due argomenti, apparentemente differenti, sono presenti nello stesso corso?
Perché se sviluppiamo interfacce grafiche complesse, con molte interazioni lato utente e moltissimi stati che devono rimanere in sync tra loro, è indispensabile avere una discreta padronanza della gestione dello stato per scegliere la strategia più corretta in base al contesto e al caso d'uso.
Una scelta errata può spesso compromettere e degradare le performance dell'applicazione, soprattutto se non si è consapevoli di cosa stia accadendo dietro le quinte e di come risolvere eventuali problemi e colli di bottiglia.
1. La prima parte del corso è dedicata all'analisi delle API di React per la gestione dello stato locale e globale tramite l'utilizzo di useState, useRedux e Context ma soprattutto al loro impatto sulle performance. Vedremo quindi come ottimizzare render e performance tramite l'utilizzo diverse strategie di ottimizzazione e debug. Oltre a comprendere la gestione dello stato, questa sessione risulterà molto utile per comprendere a fondo il funzionamento di React e del suo motore di rendering.
2. Nella seconda parte, la più ampia dal punto di vista della durata, metteremo a confronto diverse tecniche per la gestione dello stato globale in applicazioni React, utilizzando differenti pattern, API e librerie.
Perchè questi due argomenti, apparentemente differenti, sono presenti nello stesso corso?
Perché se sviluppiamo interfacce grafiche complesse, con molte interazioni lato utente e moltissimi stati che devono rimanere in sync tra loro, è indispensabile avere una discreta padronanza della gestione dello stato per scegliere la strategia più corretta in base al contesto e al caso d'uso.
Una scelta errata può spesso compromettere e degradare le performance dell'applicazione, soprattutto se non si è consapevoli di cosa stia accadendo dietro le quinte e di come risolvere eventuali problemi e colli di bottiglia.
Obiettivo
Al termine del corso, gli studenti avranno compreso il funzionamento del sistema di rendering di React, saranno in grado di risolvere problemi legati alle performance
delle applicazioni e saranno, inoltre, in grado di valutare la strategia più adatta per la gestione dello stato locale e globale.
REQUISITI
Sviluppatori che già utilizzano React o che hanno partecipato al corso React Core Concepts.
È infatti richiesta una minima conoscenza della libreria e possibilmente aver già utilizzato TypeScript in progetti React.
I partecipanti devono avere già utilizzato template JSX/TSX dinamici, componenti e abbiano già gestito lo stato locale con l'hook
I partecipanti devono avere già utilizzato template JSX/TSX dinamici, componenti e abbiano già gestito lo stato locale con l'hook
useState .[ programma ]Cosa vediamo,
Cosa vediamo,
in dettaglio.
Il programma viene rifinito con il team prima del corso, in base a stack, obiettivi e livello. Quella che vedi è la base: possiamo accelerare o approfondire dove serve e, se necessario, modificare il programma.
La maggior parte del corso è live-coding, con esempi pratici.
3 moduli · 22 argomenti
M01 Performance & Optimization
- 01Ottimizzazione performance di applicazioni React
- 02Utilizzo dei React Developer Tools: components & profile
- 03Analisi delle differenze tra fase render e commit
- 04Strategie per l'ottimizzazione dei render
- 05
React.memohook - 06
useMemohook - 07
useCallbackhook - 08React 19 Compiler (experimental)
- 09
useDeferredValuehook - 10
useTransitionhook
M02 State Management con React API
- 01Local state con
useState - 02Local state con
useReducer - 03Drilling Props Pattern
- 04Composition Pattern
- 05Context API e
useState - 06Context API: multiple context
- 07Context API: nested context
- 08Context API e
useReducer
- 01Local state con
M03 Librerie di State Management
- 01Introduzione a Redux Toolkit: selettori, azioni, reducer e thunk
- 02State Management con Zustand
- 03React Router: loader e data fetching
- 04Introduzione a TanStack Query
[ corsi correlati ]
Potrebbero piacerti anche...
12h · AvanzatoReact UI: UIKIT riutilizzabile
Crea un UIKIT di componenti React flessibili e riutilizzabili. Storybook per documentare, sperimentare, testare.
12h · AvanzatoState management con Redux Toolkit
Gestire lo stato globale con Redux Toolkit, RTK Query e TypeScript.
8h · IntermedioE2E Test in Cypress (React)
Scrivere test E2E con Cypress e TypeScript in applicazioni React.