Data Fetching in Next.js
Server-side rendering (SSR), generazione statica (SSG), rigenerazione statica incrementale (ISR), streaming
1Qual è il comportamento predefinito dei Server Components in Next.js App Router per il data fetching?
Qual è il comportamento predefinito dei Server Components in Next.js App Router per il data fetching?
Risposta
I Server Components eseguono il data fetching lato server ad ogni richiesta per default, garantendo dati sempre aggiornati. A differenza del Pages Router dove era necessario getServerSideProps, i Server Components rendono l'SSR implicito. Per il caching statico, l'opzione cache: 'force-cache' deve essere aggiunta al fetch.
2Quale opzione cache del fetch è equivalente a getStaticProps nel Pages Router?
Quale opzione cache del fetch è equivalente a getStaticProps nel Pages Router?
Risposta
L'opzione cache: 'force-cache' dice a Next.js di memorizzare nella cache la risposta fino all'invalidazione manuale, equivalente a getStaticProps. Questa strategia genera contenuto statico che rimane in cache indefinitamente. L'opzione 'no-store' equivale a getServerSideProps (re-fetch ad ogni richiesta), mentre next.revalidate equivale a getStaticProps con revalidate (ISR).
3Come forzare il data fetching dinamico ad ogni richiesta (equivalente di getServerSideProps)?
Come forzare il data fetching dinamico ad ogni richiesta (equivalente di getServerSideProps)?
Risposta
L'opzione cache: 'no-store' disabilita completamente il caching e forza il re-fetch ad ogni richiesta, equivalente a getServerSideProps. Questa strategia garantisce dati sempre aggiornati ma aumenta la latenza. Usare per dati in tempo reale (dashboard, notifiche, prezzi live) dove l'aggiornamento è critico.
Come implementare ISR (Incremental Static Regeneration) con rivalidazione oraria?
Cosa fa l'export 'export const revalidate = 60' a livello di pagina?
+21 domande da colloquio
Altri argomenti di colloquio React / Next.js
Fondamenti di JavaScript
Fondamenti di React
React Hooks
Ciclo di vita dei componenti
React Router
Gestione dello state con Context
Form e Controlled Components
Recupero dati e API
React Query (TanStack Query)
Styling & CSS-in-JS
Fondamentali di Next.js
TypeScript con React
Server Actions di Next.js
Routing e Navigazione in Next.js
API Routes di Next.js
Metadata & SEO in Next.js
Middleware e Auth in Next.js
Testing React
Zustand State Management
Ottimizzazione delle Performance React
Error Boundaries & Error Handling
Advanced React Patterns
Funzionalità avanzate di Next.js
Deploy e Produzione con Next.js
Architecture & Design Patterns
React Server Components
Internazionalizzazione di Next.js
React Sicurezza & Best Practices
Padroneggia React / Next.js per il tuo prossimo colloquio
Accedi a tutte le domande, flashcards, test tecnici, esercizi di code review e simulatori di colloquio.
Inizia gratis