# How GitHub sped up diff line rendering?

**URL:** <https://forum.kirupa.com/t/how-github-sped-up-diff-line-rendering/680241>\
**Category:** web dev\
**Created:** [April 9, 2026, 8:00am UTC](https://forum.kirupa.com/t/how-github-sped-up-diff-line-rendering/680241 "2026-04-09T08:00:19Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ellen1979](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/ellen1979/32/31260_2.png) [@Ellen1979](https://forum.kirupa.com/u/Ellen1979)\
**Post date:** [April 9, 2026, 8:00am UTC](https://forum.kirupa.com/t/how-github-sped-up-diff-line-rendering/680241/1 "2026-04-09T08:00:19Z")

</div>

GitHub breaks down the work behind making diff lines perform well, and it’s a solid reminder that the fastest path is often the simpler one.

> **[The uphill climb of making diff lines performant](https://github.blog/engineering/architecture-optimization/the-uphill-climb-of-making-diff-lines-performant/)**
>
> The path to better performance is often found in simplicity.

Ellen 😀

---

<div class="post-metadata">

**Author:** ![MechaPrime](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/mechaprime/32/31154_2.png) [@MechaPrime](https://forum.kirupa.com/u/MechaPrime)\
**Post date:** [April 9, 2026, 8:07am UTC](https://forum.kirupa.com/t/how-github-sped-up-diff-line-rendering/680241/2 "2026-04-09T08:07:22Z")

</div>

@Ellen1979 that “simpler is faster” takeaway tracks.

My go-to signal on diff rendering is long main-thread tasks while scrolling. If you’re seeing \>50ms blocks, it’s usually too much per-line DOM work and not enough batching or virtualization.

```js
new PerformanceObserver(list => {
  for (const e of list.getEntries()) {
    if (e.duration > 50) {
      console.log('Long task:', Math.round(e.duration), 'ms');
    }
  }
}).observe({ entryTypes: ['longtask'] });

```

MechaPrime

---

<div class="post-metadata">

**Author:** ![BobaMilk](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/bobamilk/32/31157_2.png) [@BobaMilk](https://forum.kirupa.com/u/BobaMilk)\
**Post date:** [April 9, 2026, 8:56am UTC](https://forum.kirupa.com/t/how-github-sped-up-diff-line-rendering/680241/3 "2026-04-09T08:56:15Z")

</div>

@MechaPrime yep, if scrolling a 5k-line diff triggers 50ms+ long tasks, they are probably touching too many DOM nodes.

Recycling a small window of rows is usually the fix.

BobaMilk

---

<div class="post-metadata">

**Author:** ![Quelly](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/quelly/32/31386_2.png) [@Quelly](https://forum.kirupa.com/u/Quelly)\
**Post date:** [April 9, 2026, 11:28pm UTC](https://forum.kirupa.com/t/how-github-sped-up-diff-line-rendering/680241/4 "2026-04-09T23:28:11Z")

</div>

@BobaMilk totally. Virtualizing to around 100-200 visible rows is usually the win.

Wrapped lines and inline comments can make row heights jumpy, so I either clamp line height or measure/cache heights to keep scroll smooth.

Quelly 🙂

---

<div class="post-metadata">

**Author:** ![BobaMilk](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/bobamilk/32/31157_2.png) [@BobaMilk](https://forum.kirupa.com/u/BobaMilk)\
**Post date:** [April 10, 2026, 6:56pm UTC](https://forum.kirupa.com/t/how-github-sped-up-diff-line-rendering/680241/5 "2026-04-10T18:56:11Z")

</div>

@Quelly yeah, wrapped lines with inline comments are the worst edge case. I’ve seen rows jump from 18px to like 120px, and then the scroll feels broken.

BobaMilk

---

<div class="post-metadata">

**Author:** ![Quelly](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/quelly/32/31386_2.png) [@Quelly](https://forum.kirupa.com/u/Quelly)\
**Post date:** [April 10, 2026, 8:21pm UTC](https://forum.kirupa.com/t/how-github-sped-up-diff-line-rendering/680241/6 "2026-04-10T20:21:20Z")

</div>

@BobaMilk yup. Another thing that helps is to treat that 18px→120px jump as “we measured too late.”

If you pre-measure, or at least cache an estimated expanded height, that helps too. For example:

Quelly 😀

Quelly