How we beat browser bottlenecks

Hex, a data analysis application, was experiencing performance issues due to rapid growth and the complexity of its features. The company turned to virtualization to optimize performance, leveraging React Virtuoso for efficiently rendering large lists. However, this approach proved challenging with nested content, where scrolling was jittery. To address this issue, Hex developed a custom-built VirtualizedElement component that renders only visible elements, using react-intersection-observer to control mounting and unmounting of cells based on their proximity to the viewport. This solution resulted in significant performance improvements across the board, including reduced initial render time, interaction lag, page load, render lag, and memory usage. The custom-built VirtualizedElement component is now a great fit for Hex notebooks, offering direct performance wins and deepened understanding of product needs.

No tracked trend matches for this post yet.

Use this post, company, and trend context to find content marketing opportunities, perform competitive analysis, or address product feature gaps via the Plushcap MCP server or the Plushcap API.