Співбесіда Next.js крутиться навколо стратегій рендерингу, App Router, серверних компонентів і кешування — того, що відрізняє Next від звичайного React. Нижче — найчастіші питання з еталонними відповідями. Senior: архітектуру, трейд-офи, менторство та прийняття рішень.
В App Router кожен компонент за замовчуванням серверний; "use client" позначає межу, з якої починається клієнтський бандл. Усе, що імпортується нижче цієї межі, надсилається в браузер, тому директива на початку лейауту випадково робить клієнтським усе піддерево. Без неї виклик useState або навішування onClick падає ще на збірці.
Next кешує на кількох рівнях: кеш результатів fetch, повний кеш маршруту для відрендереного виводу і клієнтський кеш роутера для навігацій. revalidate задає, скільки кешований запис вважається свіжим — або на конкретний fetch, або експортом із сегмента маршруту. Для оновлень за подією викликають revalidatePath або revalidateTag після мутації, і це точніше, ніж часове вікно.
Server Action — це асинхронна функція з позначкою "use server", яку клієнтський компонент може викликати напряму, а Next бере на себе серіалізацію та мережевий похід. Вона замінює написання API-роута для простих мутацій на кшталт надсилання форми і добре поєднується з revalidatePath для оновлення даних після. Оскільки під капотом це публічний ендпоінт, валідація входу й перевірка прав усе одно обовʼязкові.
Він генерує адаптивні варіанти в сучасних форматах на кшталт WebP і AVIF, віддає розмір під конкретний вьюпорт, за замовчуванням вантажить ліниво і резервує місце в розмітці, щоб сторінку не смикало. Саме вимога явних width і height або пропа fill прибирає cumulative layout shift. На практиці це зазвичай найбільше покращення Core Web Vitals у застосунку на Next.
Streaming надсилає HTML у браузер порціями в міру готовності, а не чекає найповільніше джерело даних. Обгортка повільного компонента в Suspense з фолбеком дозволяє решті сторінки відмалюватися одразу, а цьому блоку приїхати пізніше. На практиці це означає, що повільний віджет рекомендацій більше не затримує всю сторінку, що покращує сприйману швидкість і time to first byte.
Експортуйте generateMetadata зі сторінки або лейауту — функція отримує параметри маршруту, може дочекатися даних і повернути title, description, canonical і поля Open Graph. Для статичних сторінок достатньо простішого експорту metadata. Додайте файл opengraph-image у теку маршруту, і Next автоматично згенерує превʼю-картинку для цього маршруту.
На співбесіді ти говориш вголос під тиском. Кем поставить ті самі питання, оцінить кожну відповідь і покаже, що саме підтягнути.
Пройти інтерв'ю Senior Next.js →