Web/journal
React Server Components
React Server Components через год: что оставили, что выкинули
← ЖурналWeb7 мин чтения

React Server Components через год: что оставили, что выкинули

Команда nordiqdev
студия

В апреле 2023-го мы запустили первый проект целиком на App Router и Server Components. Сейчас таких в проде четыре. Год - достаточный срок, чтобы перестать восторгаться и начать честно говорить, что работает, а что нет.

Что точно оставили

Default server, opt-in client. Это правильная инверсия по умолчанию. На дашбордах с большим количеством статичных секций bundle-saving честные: на одном из проектов клиентский JS похудел с 480 КБ до 290 КБ, без перепроектирования UX.

Прямые fetch-запросы из компонента - приятнее, чем монтировать всё через client-side data layer. Меньше boilerplate, меньше промежуточных слоёв.

Что оказалось сложнее, чем продавали

Граница server/client

Первый месяц на проекте уходит на дисциплину. Кто-то добавляет use client в shared-компонент, и вся ветка дерева уезжает на клиент. Без явных правил и линтера - гарантированно поедет.

Кэш, который никто не понимает

В Next 13–14 кэш состоял из четырёх слоёв (request memoization, data cache, full route cache, router cache). Понять, почему конкретный fetch не инвалидируется, было искусством. К Next 15 это упростили, но шрамы остались.

Server Actions удобны до первой регрессии

Писать формы через actions приятно - пока не упирается в типизацию ошибок и валидацию на нескольких полях одновременно. Мы остановились на actions для простых форм и tRPC/REST - для сложных мутаций.

Что мы выкинули

  • Идею «давайте всё сделаем серверным». Сложные интерактивные виджеты (графики, таблицы с фильтрами) держим клиентскими - попытки сделать их серверными давали худший UX.
  • Streaming с Suspense на каждом фрагменте. На медленных клиентах поэтапная отрисовка раздражает; чаще полезнее показать единый skeleton.
  • Глубокие RSC-only библиотеки. Брали такие, упирались в edge case - переходили на проверенные клиентские с use client боундари.

Когда мы выбираем RSC сегодня

Контентные сайты, маркетинг, документация, дашборды с большим количеством статики - да, без вариантов. Сложные SaaS с насыщенной интерактивной частью - да, но осознанно, с разделением «островов». Чисто интерактивные приложения (редакторы, конструкторы, инструменты с drag-and-drop) - Vite + SPA остаётся быстрее в разработке и в проде.

Теги
#react#server components#next.js#rsc#архитектура
Студия nordiqdev

Делаем мобильные приложения, веб-сервисы и AI на заказ

Если задача из текста выглядит знакомой и нужна команда, которая соберёт продукт - расскажите подробнее. Вернёмся в течение 24 часов с разбором.