Page 23 - Web Performance

A service worker is not an optional feature, it is the foundation for apps that give users a complete experience even with a poor or missing connection. Thinking Offline-First means building apps that are faster, more reliable and more installable than classic web applications.

Jumbo Frames raise the maximum Ethernet frame size from 1500 to up to 9000 bytes, lowering the percentage of header overhead per transferred megabyte. For the internal connection between a web server and a MySQL database, or for backup and replication traffic, this can noticeably save CPU cycles, provided the MTU is set consistently on every device along the path.

Tailwind's JIT engine generates only the utility classes that actually appear in your source code, yet misconfigured content paths regularly cause CSS bundles to bloat unnecessarily or styles to vanish in production, because the scanner simply overlooks templates, modules, or dynamically assembled class names.

Frontend performance is visible down to the smallest detail in the DevTools, but the backend side usually stays a black box to the browser. The Server-Timing API closes that gap by carrying server-side measurements such as database time, cache status, or rendering duration straight into the browser's tools and the Navigation Timing API through a simple HTTP header.

Server side rendering solves the problem of an empty initial HTML, but shifts the bottleneck to the server render itself. SSR performance tuning in Nuxt means deliberately lowering Time to First Byte, data fetching waterfalls, payload size and hydration cost, instead of just toggling SSR on and off.

After every deployment and after every manual cache flush, a Magento store starts out with a completely empty full page cache, and it is exactly at that moment that the first real visitors hit a server that has to render every page fresh from PHP and the database. For a store with meaningful traffic, this creates a classic thundering herd problem, where many parallel requests hit the same uncached resource at once and put unnecessary load on the server. This article shows how critical pages like the homepage, top categories, and bestsellers can be systematically pre-heated by script before real visitors are affected, and where the difference between reactive and proactive cache warmup lies.

A 2 MB JavaScript bundle is not rare, but it is almost always avoidable. Bundle analysis with Rollup and Vite makes invisible problems visible: tree-shaking gaps, duplicate dependencies, unnecessary polyfills, and provides the foundation for targeted optimization.

Naive entity iteration over millions of records reliably runs into a memory limit, because the UnitOfWork keeps every loaded entity in memory. EntityManager::clear(), toIterable() and bulk DQL updates solve this problem, each with its own trade offs.

For years, a transition to or from an auto value in CSS simply did not work, because the browser had no way to compute a numeric intermediate value for auto. calc-size() and the interpolate-size property change that fundamentally: the browser can now resolve a numeric start or end value for auto itself and animate cleanly between them, with no JavaScript measurements and no fixed pixel values.

Google now crawls and evaluates Magento stores almost exclusively through the mobile version of the page. This article explains concretely what that means for content parity, viewport configuration, tap target sizing, and mobile load time, and how to verify the result reliably with the right testing tools.