Replit Rebuilds File Tree for Better Performance and Accessibility

The existing Replit file tree suffered from performance degradation as project size increased. This was especially noticeable when dealing with web repositories containing around 8,000 files, where UI responsiveness dropped significantly.

To address this, Virtualization technology was introduced. Instead of rendering all rows at once, the structure was changed to render only the portion visible on the user's screen. To achieve this, the tree-structured data is converted into and processed as a Flat list.

As a result, the execution time of the click handler that occurs when expanding a directory was dramatically reduced from 344ms to 16ms. In addition, the size and position of the drop preview can now be flexibly adjusted, providing a much smoother user experience when moving files.

Another key element for performance improvement is Local caching. Recently viewed file trees are cached so they can be instantly rendered as a read-only view, allowing files to be checked quickly even in environments with slow network speeds.

Finally, Accessibility was also strengthened. To ensure keyboard navigation works smoothly even in the virtualized flat list environment, the mapping between the tree data and the list was optimized, and appropriate ARIA attributes such as aria-level were applied.