Manat Singh Brar
← All work

Row 01 of 07

The ten megabyte bundle

Area
Performance
Level
Engineer
Result
10.4 MB → 390 KB
Stack
Webpack 5 · Code splitting · Lazy loading · Tree shaking · Brotli · Bundle analysis

Cut the analyst portal’s main JavaScript bundle by 96%, and its first load from over three minutes to about two seconds.

10.4 MB uncompressed, before390 KB with Brotli, afterSquares drawn to area.

Context

The production build shipped a 10.4 MB main bundle: unminified, uncompressed, nothing stripped. First load of the portal took more than three minutes, and every analyst in the organisation waited through it before they could start work.

What I did

I fixed the pipeline first, so what shipped was minified and compressed with Brotli. Then I split the code, lazy-loaded what nobody needs on the first screen, and let tree shaking remove the rest.

Stable content hashes mean a chunk that did not change stays cached in the browser from one release to the next, so returning analysts download only what is new.

Outcome

The main bundle went from 10.4 MB uncompressed to 390 KB transferred with Brotli, a 96% cut. First load dropped from over three minutes to about two seconds. That is the whole portal, not a demo page.

This work, with the UI revamp around it, is what my two SPOT awards recognised.