Работал ли с виртуальным скроллом? Как он устроен?

import { useRef, useState, useCallback } from 'react';

const ITEM_HEIGHT = 50;
const OVERSCAN = 3;

function VirtualList({ items }) {
  const containerRef = useRef(null);
  const [scrollTop, setScrollTop] = useState(0);

  const handleScroll = useCallback(() => {
    setScrollTop(containerRef.current.scrollTop);
  }, []);

  const totalHeight = items.length * ITEM_HEIGHT;
  const startIndex = Math.max(0, Math.floor(scrollTop / ITEM_HEIGHT) - OVERSCAN);
  const endIndex = Math.min(items.length, Math.ceil((scrollTop + containerRef.current?.clientHeight) / ITEM_HEIGHT) + OVERSCAN);

  const visibleItems = items.slice(startIndex, endIndex);

  return (
    <div ref={containerRef} onScroll={handleScroll} style={{ height: '400px', overflow: 'auto' }}>
      <div style={{ height: totalHeight, position: 'relative' }}>
        {visibleItems.map((item, index) => (
          <div key={item.id} style={{
            position: 'absolute',
            top: (startIndex + index) * ITEM_HEIGHT,
            height: ITEM_HEIGHT,
            width: '100%'
          }}>
            {item.text}
          </div>
        ))}
      </div>
    </div>
  );
}