Programming

Dropping Next.js Took a Blog to a Perfect 100 on Lighthouse

A solo developer reached 100 in every Lighthouse category after replacing Next.js with the lighter Hono framework for a static blog.

Dropping Next.js Took a Blog to a Perfect 100 on Lighthouse

A developer built a personal blogging platform aimed at being fast, uncluttered, able to host multiple blogs, and fully accessible. After adding caching and Cloudflare’s Image Transformations, the site still fell short of a perfect Lighthouse Performance score. The main complaint was legacy JavaScript coming from the Next.js framework runtime, even though the site was a static page with no interaction.

Tests showed that removing client components did not change the score. The client runtime that Next.js ships, including router and hydration code, remained even with only server components, because next/link and next/image are client components themselves. Removing those two would not eliminate the App Router runtime, and there was no official way to reach zero, so the developer decided to drop the framework entirely.

The developer moved the site to Hono, a lightweight framework that supports JSX. The page then scored 100 across all categories, with no JavaScript and unused code falling to 407 bytes from 230,460. Build time dropped by about 40 percent, and the long task before first render fell from 309.3 ms to 68.01 ms, roughly a 78 percent improvement. The SEO score of 69 came from a test build that deliberately blocks search indexing.

The developer notes that Next.js still suits interaction-heavy applications, and the management app for the blog is built with it. For a static site, however, the author argues that a framework shipping a client runtime is often unnecessary.

Source: korindiehacker


Posted

in

by