【实战】前端工程化，技术栈react + ts + storybook 这个专栏我们已经完整的搭建完成了一个组件库项目，本篇我们讲解一下几种虚拟列表、定高、动态高度虚拟列表的实现

前言 最近在做一个官网，原本接口做的都是分页的，但是客户提出不要分页，之前看过虚拟列表这个东西，所以进行一下了解。 为啥要用虚拟列表呢！ 　　在日常工作中，所要渲染的也不单单只是一个li那么简单，会有

瀑布流是大家日常开发过程中经常遇到的一个场景，公司内部的组件库中也提供了一些解决方案。但这些方案适用场景都很单一，且每个实现方案都或多或少存在一些问题，基于此，我们设计与开发了一个兼容多场景的瀑布流

前文中我们使用 虚拟列表 优化了海量数据的显示，但实际情况并没有那么简单。不定高的列表元素该怎么获取真实高度？滚动时为什么会出现白屏闪烁？异步加载的数据要怎么处理？一次性请求大量数据是否合理？

上滑加载是移动端瀑布流的常用加载方式，实现方式还是非常简单的，没必要借助插件。 一般都需要配合图片懒加载等优化方式一同使用，这里附上：通过IntersectionObserver实现懒加载 - 掘金

虚拟滚动列表优化版 若对虚拟滚动列表没有概念可以看上一篇基础原理篇， 这版优化包含缓存，简单节流和结合分页加载数据，下面直接进入正题。 在基础版本之上添加上下缓存区+节流+分页