TLDR Web Dev · ARTICLES & TUTORIALS

BETTER CODE RENDERING THROUGH VIRTUALIZATION

sentry.engineering17 min read

Summary from the TLDR Web Dev newsletter

Sentry rebuilt Codecov's code renderer to handle extremely large files that previously caused crashes. The root cause of the crashes was due to React struggling to render a massive number of elements, so the team implemented virtualization using the `@tanstack/react-virtual` library. This improved performance by only rendering visible lines, and after some additional work, the renderer was capable of handling files with up to 500,000 lines of code.