Data Table with Virtual Scrolling

Build a data table that handles 100K+ rows with virtual scrolling, column sorting, multi-criteria filtering, column resizing, and row selection.

Overview

Create a high-performance data table component. Render 100,000 rows smoothly using virtualization (only render visible rows + buffer). Add interactive features: click-to-sort columns, filter dropdowns per column, drag-to-resize columns, checkbox row selection, and CSV export.

Virtual scrolling is the definitive performance optimization technique for large datasets in the browser. The principle is simple: instead of rendering 100,000 DOM rows (which would create 100,000+ DOM nodes and bring the browser to its knees), only render the 30-50 rows visible in the viewport plus a small buffer above and below. As the user scrolls, recycle DOM elements by updating their content and position.

Building a data table with virtualization is one of the most technically demanding frontend projects because it combines multiple complex systems: a virtualization engine that calculates visible row ranges from scroll position, a sort system that handles 100K elements efficiently with stable multi-column comparisons, a filter system that needs indexed lookups for sub-millisecond filtering, column resizing with live drag feedback, and row selection with shift-click range semantics.

For performance-focused frontend interviews, this is the gold standard project. The classic question "How would you render a table with 100K rows?" has a concrete answer in your working implementation. You can demonstrate O(1) DOM rendering complexity, discuss memory-efficient sort and filter strategies, and show that the table maintains 60fps scrolling throughout.

Interview questions

  • How does virtual scrolling work?
  • How do I maintain sort/filter performance at 100K rows?
  • How do I implement column resizing?
  • How do I handle row selection at scale?
  • How do I implement CSV export?
  • How do I make the virtual table accessible?

Sign up free to read the full topic

More Projects topics

Start free on Cariara · Coding problems · System design studio