React UI overhaul results
- GitHub engineers reworked the Files Changed UI, cutting per-line components and using O(1) maps plus window virtualization. - The redesign reduced Interaction to Next Paint (INP) from roughly 450ms to about 100ms on giant pull requests. - A separate real-world React 19 plus Compiler migration showed ~20% load-time improvement but unchanged INP where manual memoization already existed. ( )
React apps got two fresh performance case studies this month, and both point to the same result: big wins came from cutting work, not from React upgrades alone. (github.blog) A browser can only paint what it has time to draw, so giant code diffs slow down when a page creates too many elements and rerenders too much state. GitHub said some extreme pull requests pushed the JavaScript heap past 1 gigabyte and the page past 400,000 Document Object Model nodes. (github.blog) GitHub’s fix was to rebuild the pull request “Files changed” tab around fewer per-line React components, constant-time lookup tables, and window virtualization, which only renders the visible slice of a very long list. GitHub said the new React-based page is now the default experience for all users. (github.blog (github.blog)) The company measured the result with Interaction to Next Paint, a Core Web Vitals responsiveness metric that tracks how long the browser takes to visibly respond after input. In its April 3, 2026 engineering post, GitHub said the worst large-pull-request cases dropped from roughly 450 milliseconds to about 100 milliseconds. (github.blog) GitHub did not use one fallback for every review. Its engineers wrote that medium and large reviews were tuned to preserve browser behavior like native find-in-page, while only the largest pull requests used virtualization to keep scrolling and interaction usable. (github.blog (github.blog)) That distinction lines up with how React’s newer tooling is marketed. React 19 shipped as stable on December 5, 2024, and the React team says React Compiler automatically handles memoization that developers previously added with `useMemo`, `useCallback`, and `React.memo`. (react.dev 1) (react.dev 2) A separate migration shared by engineer Ali Spahić reported about a 20 percent load-time improvement after moving a real app to React 19 and React Compiler. The same post said Interaction to Next Paint did not improve in places where the app already had manual memoization, which matches React’s claim that the compiler replaces that optimization work rather than stacking on top of it. (x.com) (react.dev) GitHub’s rollout shows the other half of the equation. When a screen is packed with thousands of interactive rows, engineers still have to shrink the amount of data, state, and markup the browser touches before any compiler can help. (github.blog) GitHub has been iterating on this page since the public preview launched on June 26, 2025, with repeated changelog entries on rerenders, memory use, file limits, and Safari fixes before making it the default in January 2026. The April write-up closes that loop with a simpler claim: the fastest diff line was often the one the page never rendered. (github.blog 1) (github.blog 2) (github.blog 3) (github.blog 4)
