Blog(21)

Chrome 155 decodes JPEG XL, and the announcement says 30-50% better compression than JPEG. We ran the reference encoders: at matched quality JPEG XL came in 22 to 23 percent under JPEG, level with AVIF. The stronger result is lossless recompression: 30 real JPEGs shrank 20.8 percent and all 30 reconstructed byte for byte.

We built the same apps on Next.js 16.3.8 and 16.4.0 and diffed what create-next-app generates. The Turbopack cache shrank 22 to 39 percent, more than the release claims. Client JavaScript did not shrink. The starter now ships Cache Components, and ensureStatic fails a build at one of its three levels.

We ran the React Compiler rules in eslint-plugin-react-hooks 7.1.1 over six public React codebases and read a random sample of what they flagged. Over a thousand new errors, three real bugs in 53 sites, and a third of the refs errors never touch a ref. Here is which rules to fix, which to fix mechanically, and which one to keep strict.

Flipping cacheComponents on turns silent build-time data freezes into build errors. We put 29 code patterns through 110 builds on Next.js 16.1.7 and 16.3.5, one pattern per build, and recorded every error verbatim. Twelve patterns fail. Two stop compiling. The pass/fail is identical across both versions - the amount of help you get is not.

Tailwind v4 stopped reading tailwind.config.js automatically, and the @config directive brings it back. We probed all 19 keys of a real v3 config against Tailwind 4.3.3, one key per build, and diffed the output CSS. Most keys work. Four are dropped in silence. And the documented list of what does not work is wrong about safelist.

We measured client-side navigation on a deployed Next.js 16.1 site: a soft navigation transfers about half the bytes of a full page load, and a <Link> prefetch transfers the same payload as the navigation it prepares - the whole route, once per link in the viewport, in production. Then we read the useRouter return type out of the installed package: six methods, and no router.events, router.query, router.pathname, router.isReady, router.beforePopState or shallow routing.

We seeded thirteen failure modes into Next.js 16.1 route handlers and recorded the status, headers and body the client got back, under next dev and under a production build. An uncaught throw is an empty 500 with no Content-Type. Throwing a Response does not set its status. A stream that fails after its first byte is a truncated 200. Dev and production returned the same thing every time.

We ran npx @tailwindcss/upgrade on a production Astro site, moving Tailwind 3.4.19 to 4.3.3. The tool rewrote the PostCSS config, translated and deleted tailwind.config.mjs, and renamed classes across 31 files, all correctly. It also left two build-breaking errors specific to Astro, and the main stylesheet came out 28% larger gzipped.

We counted every @ts-ignore, @ts-expect-error and @ts-nocheck in five production codebases. The total was one. The same 31,128 lines hold 304 type assertions, and only one of those two kinds of opt-out tells you when it has gone stale.

We put ten defects into real route handlers and ran four testing methods at them: a direct call, next-test-api-route-handler, next start, and the Cloudflare Workers build we deploy. Two methods pass a handler that is broken, and one fails a handler that is fine.

We used the TypeScript compiler API to count every place five production codebases tell the type system to stop checking, then read every one that sits on untrusted input. The count turned out to be the wrong thing to worry about.

We turned on noUncheckedIndexedAccess and exactOptionalPropertyTypes across five production codebases and counted every error. The cost per thousand lines varied by 24x, and half the work was not where you index.

How a pixel-comparison overlay actually works in the browser: why a wrapper div breaks mix-blend-mode, click-through without pointer-events juggling, keeping scroll on its fast path, and hardening per-origin persisted state.

Compress, merge, split, linearize and OCR are five different operations on the same file format. What each one touches in the object graph, why some are fast and some are not, and the three that can quietly corrupt a document.

A walkthrough of QR internals against the spec: the module grid and its reserved regions, encoding modes, Reed-Solomon over GF(256), interleaved blocks, mask selection, and what the standard deliberately does not protect.

Logpoints, network overrides, local overrides and profiling, plus a session-based way to handle the thirty documentation tabs a debugging session produces. With the actual research on interrupted work, and what it does not say.

How route handlers actually behave in Next.js 16: GET is no longer cached by default, params are async, and most of what you need is a server action instead. With a real deployment that is not on Vercel.

The hooks you use daily, the rules that make them work, and the failure they cause most often: reaching for useEffect when the answer is a computed value, an event handler, or an external store.

The App Router explained through a site that actually runs on it: server components, async request APIs, generateStaticParams, and the three things that break when you deploy somewhere other than Vercel.

Which strict flags earn their keep and what each one costs, when to reach for @ts-expect-error over @ts-ignore, why catch variables are unknown, and how to type the edges where outside data enters.

Tailwind v4 moved configuration out of JavaScript and into CSS. What that changes for theming and dark mode, what the upgrade breaks, the browsers it drops, and the measured CSS size of a real site.