How GitHub Turbocharged Pull Request Performance: Strategies and Solutions

Pull requests (PRs) are central to GitHub, where engineers review code changes daily. With PRs ranging from simple one-line fixes to massive updates spanning thousands of files, maintaining a fast and responsive review experience is crucial. GitHub recently redesigned the "Files changed" tab using React to improve performance, especially for large PRs. They tackled challenges like excessive memory usage, high DOM counts, and sluggish interactions, achieving meaningful gains through a multi-pronged approach. Below, we explore the key questions behind these optimizations.

Why is performance critical for pull request reviews?

Performance directly impacts developer productivity and satisfaction. At GitHub's scale, PRs can be tiny or enormous—some with millions of lines across thousands of files. When reviewing a PR, developers expect instant feedback after clicking, scrolling, or selecting diffs. Slow performance, such as input lag or high memory consumption, disrupts focus and slows down code review cycles. For example, before optimizations, extreme cases caused JavaScript heap usage to exceed 1 GB and DOM nodes to surpass 400,000, leading to poor Interaction to Next Paint (INP) scores. This meant users literally felt delays in their interactions. By improving performance, GitHub ensures that even the largest PRs remain usable, maintaining a seamless workflow for engineers everywhere.

What specific performance problems did GitHub face with large PRs?

Large PRs revealed several critical bottlenecks. The most glaring issues included:

• Memory pressure: JavaScript heap sizes could exceed 1 GB, causing browser slowdowns and crashes.
• DOM overload: With over 400,000 DOM nodes, rendering became extremely heavy, leading to long paint times.
• Poor responsiveness: INP scores—a key metric for user interaction—were above acceptable thresholds, meaning actions like scrolling, clicking, or typing had noticeable delays.

These issues made reviewing large PRs nearly impossible, as the page would freeze or become unresponsive. The problem was especially pronounced because GitHub’s previous experience still worked well for small PRs but broke down at the extreme end. Thus, solving this required not a single fix but a suite of strategies tailored to different PR sizes and complexities.

What strategies did GitHub use to improve PR performance?

GitHub avoided a one-size-fits-all solution, recognizing that techniques preserving all features hit a ceiling for massive PRs, while drastic mitigations could harm everyday reviews. Instead, they developed three complementary strategies:

1. Focused optimizations for diff-line components: Ensuring the core diff experience stays fast for most PRs (small to medium) without breaking native features like find-in-page.
2. Graceful degradation with virtualization: For the largest PRs, they limit what’s rendered at any moment to prioritize responsiveness over displaying everything at once.
3. Foundational improvements: Optimizing base components and rendering pipelines to benefit all PR sizes—whether a user ends up in fully rendered or virtualized mode.

This layered approach allowed GitHub to preserve a rich experience for the majority of PRs while safeguarding the worst-case scenarios.

How did GitHub optimize diff-line components for medium and large PRs?

The primary diff experience—where changes are shown line-by-line—needed to stay efficient for most PRs. GitHub focused on reducing the per-line overhead in React components. They reused more elements, minimized re-renders, and improved memoization strategies. For instance, they optimized the rendering of syntax-highlighted code so that only changed lines trigger updates, not entire files. They also improved event handling to reduce memory allocation during scroll interactions. These changes kept find-in-page fully functional, as users expect, while cutting DOM nodes and heap usage by a significant margin. The result: medium and large PRs that previously felt sluggish now load and interact faster, without sacrificing any standard browser behaviors.

What role does virtualization play in handling the largest PRs?

For extremely large PRs—where rendering every diff line is impractical—GitHub implemented virtualization. This technique limits the number of DOM nodes to only those visible in the viewport, plus a small buffer. Instead of loading all 400,000+ lines, the browser only paints what’s needed. As the user scrolls, old lines are removed and new ones added on-the-fly. This dramatically reduces memory pressure (heap usage dropped from >1GB to manageable levels) and improves INP scores because fewer elements compete for attention. However, virtualization does trade off some features, like continuous find-in-page across all lines, but it ensures the page remains usable and responsive. GitHub made this the default for the most extreme PRs to prevent the experience from tipping over.

How did improvements to foundational components impact all PR sizes?

Beyond targeted fixes, GitHub invested in the building blocks of their React interface. They optimized shared components—like buttons, links, and diff containers—to reduce unnecessary renders and memory allocations. They also updated their rendering pipeline to batch updates more efficiently and avoid layout thrashing. These foundational improvements have a compounding effect: every pull request, regardless of size, benefits from faster initial load times and smoother interactions. For small PRs, users may not notice a difference because performance was already good, but for medium PRs, the improvements are palpable. Combined with the other strategies, these tweaks ensure that no PR is left behind, providing a consistent, fast experience across the board.

What key performance metrics improved after the rollout?

After implementing these changes, GitHub measured noticeable improvements in several areas:

• JavaScript heap size: Reduced from >1 GB to under 200 MB in extreme cases, thanks to virtualization and component optimizations.
• DOM node count: Dropped from over 400,000 to a few thousand when virtualization is active, plus moderate reductions in full-rendering mode.
• Interaction to Next Paint (INP): Scores improved significantly, with latency dropping from hundreds of milliseconds to under 100 ms for typical interactions.

These gains translate directly to real-world user experience: scrolling is smoother, clicks respond instantly, and memory usage stays stable even during long review sessions. GitHub continues to monitor these metrics to ensure ongoing performance health.