Sébastien Rigaux

Tech watch

← All links

SSR

Producing HTML on the server and coordinating it with client-side data and interactions.

A white card on a pale blue background displays “Fixing a Hydration Mismatch Error and UI Flicker in React” and the label “Blog”.

In Next.js, a localStorage value can make server-rendered HTML differ from the first client render. The article compares the trade-offs: waiting until mount avoids the error but leaves the real content out of the SSR HTML; using the same initial value for both renders preserves that content, though a later update can cause flicker.

To synchronize a sidebar without that flash, an inline script applies its saved state to the DOM before hydration and passes it to React, which uses the same classes. The article also distinguishes an isolated theme control from a mobile backdrop handled with CSS.

Giorgi MoniavaFound via React Digest

GitHub preview of the shader-effects-inc/shaders repository, described as a WebGPU component library for React, Vue, Svelte, Solid, JavaScript, and Framer.

Tanner Linsley’s AI-driven React projection experiment has become a TanStack project used in production. Redact is a smaller, React-compatible runtime that already works with Start, Next.js, Vinext, and Vite. On the server, React still handles SSR and Server Components.

The tradeoff is in rendering: Redact renders synchronously, without React’s time slicing. As the blog post acknowledges, a heavy render can still delay input. The smaller runtime therefore comes with a constraint worth considering for interfaces that need to remain responsive under load.

Shader Effects, Inc.Found via This week in React

White banner with the black text “Next Themes” and GitHub and sponsor icons.

next-themes applies the theme as the page loads, respects the system preference, and syncs the choice across tabs. Its ThemeProvider works with both the App Router and pages/, while a hook lets components switch themes or handle multiple variants.

One architectural detail matters: the browser-stored theme is unavailable during server rendering. UI that depends on useTheme should wait until the client component mounts to avoid hydration errors. The library also updates the <html> attribute—suppressHydrationWarning is recommended—and remains independent of the CSS solution in use.

c15t changelog graphic showing the c15t logo and version number 3.0.0 on a black background.

c15t 3 rebuilds consent management around a shared engine with adapters for Next.js, React, Vue, Nuxt, Astro, Svelte, TanStack Start, and plain HTML sites. Banners can be rendered into server HTML, while a consent manifest avoids waiting on the backend for every request. The reported gains depend on the deployment mode and come from benchmarks published by the project.

The migration preserves choices stored by v2, but changes APIs, packages, and the backend. Codemods handle part of the upgrade; clients and backend must move to v3 together. The release also introduces more strictly validated policy rules and a rewritten self-hosted backend supporting PostgreSQL, MySQL, and SQLite.

Inth

Screenshot of the vinext 1.1.0 release page on GitHub

vinext 1.1.0, the Vite plugin reimplementing the Next.js API, brings many behaviors in line with Next.js, especially for the App Router (redirect handling, metadata, special errors) and cache management. This release introduces stale-while-revalidate for use cache, serving stale entries while regenerating them in the background, and fixes several cache and server-side rendering inconsistencies. A milestone for those seeking a deploy-anywhere alternative to Next.js.

github-actions

TanStack Start 1.0 stable release poster

TanStack Start 1.0 marks the official stable release of a full-stack framework, already proven in production, that blends SPA-style routing, server rendering, streaming, and typed server functions for React and Solid. Its focus on end-to-end type safety—from route params to loaders and server functions—makes maintenance and evolution easier, even for AI agents. React Server Components are opt-in, and deployment is flexible via Vite, Nitro, or Rsbuild, without enforcing a single architecture.

Tanner Linsley

Illustration for the certificates.dev article on React browser() API

React Canary introduces the browser() API to render a component exclusively in the browser, avoiding hydration mismatches and extra mounted-state logic. The article demonstrates how to use use(browser()) inside a client component, wrapped in Suspense, to defer rendering until browser APIs are available. Several concrete examples show how this approach enables access to localStorage, the DOM, or user-specific data, without the usual workarounds like useEffect or environment checks.

Aurora Scharff