2026 · Archive · B2B aggregator
4sale
The landing page of a B2B wholesale price aggregator, restored out of an agency product whose buyer cabinet and admin panel had been removed.
- Next.js 14
- styled-components
- GSAP
- static export
- Figma export, SVG to WebP
- 69 MB to 1 MB
- conic-gradient elements rasterised
- 2,465
- packages in the dependency tree
- 40 to 5
- states in the search demo
- 3
What I walked into
An agency product whose buyer cabinet and admin panel were built by other developers and removed, leaving the landing page to restore.
Its artwork was a 69 MB Figma SVG export holding 2,465 conic-gradient foreignObject elements and 34 MB of duplicated clip paths.
What I changed, and why
Rasterise the artwork
The export was rendered in headless Chromium at 2× with alpha into roughly 1 MB of WebP.
Forty packages to five
The dependency tree went from 40 packages to 5 runtime dependencies.
Offers from a hash
The search demo is a three-state machine whose offers come from a string hash rather than Math.random, so there is no hydration drift.
The interesting engineering here is subtractive.
Where it landed
The landing ships as a static export, with roughly 1 MB of WebP where the 69 MB SVG used to be.
Five runtime dependencies remain, and the search demo renders the same offers on the server and in the browser.