progressive-hydration

What problem does it solve?

Progressive hydration bridges the gap between fast server-rendered pages and immediate interactivity by deferring non-critical JavaScript until needed, improving Time to Interactive.

Core Features & Use Cases

• Code-splitting and lazy loading to reduce initial payload and hydrate components on demand.
• Selective hydration that prioritizes user-visible interactions or components in view.
• Suspense boundaries to provide graceful fallbacks while non-critical chunks load.
• Easy integration with Next.js via dynamic imports with ssr options and with React projects using lazy().

Quick Start

Install the progressive-hydration pattern in your React app and wrap non-critical components with boundaries so they hydrate progressively after the initial render.