虚拟滚动数据十万条

**[角色与目标]：** 你是一位擅长"代码考古"与极限性能优化的前端极客。请输出一个优化后的纯单文件HTML。 **[当前灾难Vibe描述]：** 之前的AI生成了一个"全球商品实时定价仪表盘"。它愚蠢地将 100,000 条包含复杂SVG图表的商品数据，通过 document.createElement 全部同步渲染到了DOM树里。现在的Vibe是：页面滑动时像在泥沼中拖拽，极其卡顿。 **[你的重构任务]：** 请写一个全新的纯HTML/JS文件。界面保持深色模式的现代科技感（使用Tailwind CSS类名即可，通过CDN引入）。在JS中动态生成这10万条模拟数据。核心挑战：你必须从零手写一个"虚拟滚动/窗口化（Virtual Windowing）"机制来渲染这十万条数据。只在视口（Viewport）内渲染可见的DOM节点，并在滚动时复用它们。 **[成功标准]：** 页面必须能瞬间加载完毕，剧烈滚动时稳稳保持在60FPS，严禁出现白屏和性能警告。请在JS中包含详尽的注释，解释你的虚拟滚动数学计算逻辑。