Новый взгляд на React Server Components в TanStack
В TanStack Start решили переосмыслить подход к React Server Components. Вместо ощущения «магии фреймворка» идея ближе к тому, что RSC — это просто поток данных (React Flight stream), который можно получать, кэшировать и рендерить более гибко. То есть меньше ощущения чёрного ящика и больше контроля на стороне клиента.
const getAppShell = createServerFn({
method: "GET",
}).handler(async () => {
return renderServerComponent(<ApplicationShellEmptyRSC />);
});
// in route
loader: async () => {
const appShell = await getAppShell();
return { appShell };
},
Основной профит: тяжёлые деревья компонентов и зависимости остаются на сервере и не попадают в клиентский бандл. С одной стороны это те же RSC, но совершенно другой dx.
В TanStack Start решили переосмыслить подход к React Server Components. Вместо ощущения «магии фреймворка» идея ближе к тому, что RSC — это просто поток данных (React Flight stream), который можно получать, кэшировать и рендерить более гибко. То есть меньше ощущения чёрного ящика и больше контроля на стороне клиента.
const getAppShell = createServerFn({
method: "GET",
}).handler(async () => {
return renderServerComponent(<ApplicationShellEmptyRSC />);
});
// in route
loader: async () => {
const appShell = await getAppShell();
return { appShell };
},
Основной профит: тяжёлые деревья компонентов и зависимости остаются на сервере и не попадают в клиентский бандл. С одной стороны это те же RSC, но совершенно другой dx.
