Выбор ответа Senior SSR, SSG, ISR, гидрация обновлено
Граница use client
Вопрос
В App Router файл Chart.tsx помечен 'use client' и импортирует тяжёлую библиотеку графиков. Его использует серверный компонент Page. Что верно?
Попробуйте сами
Выберите вариант, и откроется разбор.
Показать ответ и разбор
Коротко
Правильный ответ: Chart и его импорты попадут в клиентский бандл, пропсы сериализуемые. Директива 'use client' отмечает границу: модуль и его импорты уходят в клиентский бандл.
Варианты ответа
- Библиотека графиков не попадёт в бандл, потому что
Pageсерверный Chartи его импорты попадут в клиентский бандл, пропсы сериализуемыеправильный ответ- Будет ошибка сборки: серверный компонент не может рендерить клиентский
Chartвыполнится только на клиенте и не попадёт в серверный HTML
Разбор
Директива 'use client' отмечает границу: модуль и его импорты уходят в клиентский бандл. Серверный компонент может рендерить клиентский, но пропсы должны быть сериализуемыми (функции нельзя, кроме Server Functions). Клиентские компоненты при этом всё равно проходят SSR и попадают в HTML, если не отключить SSR через dynamic(..., { ssr: false }) внутри клиентского компонента.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.