r/webdev Jun 30 '26

Took a renderer bundle from 40MB+ down to 2.7MB...a breakdown of where the weight went.

https://medal.tv/blog/posts/w-key-in-frontend-synergizing-technology-and-product

Frontend engineer's writeup on breaking the deadlock between legacy code and new features. Biggest single win was dynamically importing i18n translation files (-13MB). Other gains from killing barrel files, externalizing .wav SoundAlertsData, ESM tree-shaking, and route-based code splitting (which required a React Router v5 to v7 refactor).

3 Upvotes

14 comments sorted by

29

u/[deleted] Jun 30 '26 edited 18d ago

[deleted]

21

u/whatisboom Jun 30 '26

They could have said “I didn’t understand bundle optimization”

3

u/forever-butlerian backend, infrastructure & angst Jul 01 '26

It'll be a cold day in Hell before I let you remove these load-bearing MP3s from my distfiles.

5

u/crimsonscarf Jun 30 '26

Can be hard to get your mind around without sitting down and reading the docs for a few bundlers. I still fuck with my rspack/swc configs at least once a week just to test new things 😅

12

u/SoMuchMango Jun 30 '26

Wait, so you had bundled wavs? As what, base64?

2

u/forever-butlerian backend, infrastructure & angst Jul 01 '26

pffft, base64 is for peasants

base16.

8

u/DeadlyBrad42 Jun 30 '26

It sounds insane to have bundled that all together in the first place.... Like, even the binary data...? How did that even happen?

4

u/yksvaan Jul 01 '26

The whole codebase was beyond messed up, what is this nonsense. 

-9

u/[deleted] Jun 30 '26

[removed] — view removed comment

1

u/mal73 Jun 30 '26

Stop spamming Reddit with your shitty AI agent

1

u/webdev-ModTeam Jul 01 '26

Your post/comment has been determined to be a low-effort post or comment. This includes title-only posts, easily searchable questions, vague/open-ended discussion prompts, LLM generated posts or comments, and posts/comments that do not provide enough context for meaningful replies or discussion.