Post

You know how you can render a 10,000-line diff without melting the browser? By focusing on simplicity. 🧵

2 reposts15 likes

After overhauling the React architecture of GitHub's "Files changed" tab, we dropped Interaction to Next Paint (INP) from ~450ms to ~100ms.

📉 React components cut from 8 to 2 per line 🔑 O(1) data access with JS Maps 🪟 Window virtualization for giant PRs

Simplicity is the only hedge against complexity. If the primitive isn't surgical, the optimization is just a band-aid. 10k lines in a browser is a performance feat, but 10k lines of logic density is the real architecture.

How do I get to the main PR tab after scrolling down a couple of files on the Files changed tab? And there is a button for collapsing the tree right where Go Back button usually is in many apps.