Next.js-Interviews drehen sich um Rendering-Strategien, den App Router, Server Components und Caching — die Teile, die Next von reinem React unterscheiden. Unten findest du die häufigsten Fragen mit Musterantworten. Middle: tieferes Verständnis, Optimierung und reale Arbeitssituationen.
Es gibt mehrere Ebenen: das Request-Memo innerhalb eines Renders, den Data-Cache über Requests hinweg und den Full-Route-Cache für statische Routen. Überraschend ist, wie viel standardmäßig gecacht wird — ein fetch wird gecacht, wenn du nichts anderes sagst, sodass eine Seite veraltete Daten zeigt, obwohl niemand etwas geändert hat. revalidate und cache: 'no-store' sind der Weg, das abzuschalten.
Eine Funktion, markiert mit 'use server', die eine Client Component direkt aufrufen kann, während Next den Request übernimmt. Sie eignet sich für Mutationen aus einem Formular, ohne eine API-Route zu schreiben, und kann im selben Aufruf den betroffenen Cache revalidieren. Was sie nicht ist: ein allgemeines RPC — darunter steckt ein POST, deshalb ist sie ungeeignet für alles, was eigentlich ein GET sein sollte.
revalidatePath invalidiert den Cache für eine Route; revalidateTag invalidiert jeden fetch, der mit diesem Tag versehen wurde, egal wo er verwendet wird. Tags sind das bessere Werkzeug, sobald dieselben Daten auf mehreren Seiten auftauchen, weil du dir dann nicht mehr merken musst, welche Routen bei einer Änderung invalidiert werden müssen.
Der Server schickt HTML, sobald es fertig ist, statt auf die langsamste Query zu warten. Umgibt man einen langsamen Teil mit Suspense und einem Fallback, kommt der Rest der Seite sofort an, während das langsame Stück später nachgestreamt wird. Der Gewinn ist real bei einer Seite mit einem einzigen langsamen Widget und verschwindet, wenn alles in einer einzigen Boundary steckt.
Alles mit dem Präfix NEXT_PUBLIC_ wird ins Browser-Bundle eingebettet und ist damit öffentlich — ein Key dort ist ein veröffentlichter Key. Alles andere ist ausschließlich serverseitig verfügbar, in Server Components, Route Handlers und Actions. Der Fehler besteht darin, aus Verzweiflung über ein undefined in einer Client Component den Präfix zu ergänzen, wodurch das Secret still und leise mitausgeliefert wird.
Es sagt Next, welche Werte einer dynamischen Route zur Build-Zeit vorgerendert werden sollen, und macht so aus [slug] eine Menge statischer Seiten. Alles, was nicht in der Liste steht, wird on demand gerendert und kann anschließend gecacht werden. Genau das macht eine Content-Seite statisch, ohne auf dynamisches Routing zu verzichten.
Im echten Interview sprichst du unter Druck. Cam stellt genau diese Fragen, bewertet jede Antwort und zeigt dir genau, was du verbessern musst.
Middle Next.js-Interview üben →