router-core-ssr

Render React pages with TanStack Router using streaming SSR and head management.

7|Updated Mar 16, 2026
One-click install
npx skills add https://github.com/hashintel/brunch --skill router-core-ssr-hashintel
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: router-core-ssr
Source: https://github.com/hashintel/brunch/tree/main/.agents/skills/router-core-ssr
Command: npx skills add https://github.com/hashintel/brunch --skill router-core-ssr-hashintel

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Enables efficient server-side rendering for TanStack Router, allowing React applications to render content on the server for faster load times and better SEO.

Core Features & Use Cases

  • Supports non-streaming and streaming SSR: Allows rendering complete pages or incrementally streaming content.
  • Document head management: Facilitates dynamic title, meta, and link tags updating based on route.
  • Deep integration with React Router: Works seamlessly with TanStack Router's setup, loaders, and route options for data loading and hydration.
  • Use Case: Improve initial page load performance and SEO for large React apps by rendering routes on the server with hydration and head management.

Quick Start

Set up SSR rendering in your server environment to generate React page content on request for faster initial loads.

Frequently Asked Questions about router-core-ssr

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I enable server-side rendering for React applications using TanStack Router?

Server-side rendering for React applications using TanStack Router is enabled by configuring SSR capabilities in your server environment to generate page content on request. This setup allows full page rendering or incremental streaming for faster initial loads.

What is streaming SSR and when do I need it for React routing?

Streaming SSR is an approach that incrementally sends HTML chunks to the browser as the server renders content, rather than waiting for the full page. You need it to improve initial page load performance and time-to-first-byte for large React applications.

Can I manage document head tags dynamically during React server-side rendering?

Yes, document head management is supported during React server-side rendering to dynamically update title, meta, and link tags based on the active route. This ensures correct metadata is delivered from the server for improved SEO.

Does TanStack Router support seamless hydration after server-side rendering?

TanStack Router supports seamless hydration after server-side rendering by working with route loaders and route options for data loading. This deep integration ensures the client-side application attaches to server-rendered content without losing state.

What is the best way to improve SEO for large React apps with routing?

The best way to improve SEO for large React apps is to implement server-side rendering with hydration and head management. Rendering routes on the server delivers fully populated HTML to search engines and accelerates initial load times for users.

What are the limitations of non-streaming server-side rendering for React?

Non-streaming server-side rendering requires the server to render the complete page before sending any HTML, which can delay initial load times for complex React applications. Streaming SSR mitigates this by incrementally sending content as it becomes available.