一、列表虚拟化与海量数据展示
在tds中，当用户在关键词后加了/a参数，会列出所有的文件。此时可能会有上百万个。为了流畅操作和显示这些数据，只能借助列表虚拟化技术来实现。
列表虚拟化是一种优化技术，用于处理大量数据时提高性能和用户体验。它通过实时计算来模拟海量数据的展示，此时的性能流畅度与数据大小无关，仅与实时计算需要的执行时间有关。其核心思想是按需加载和按需渲染。
在用户滚动列表时，虚拟化技术会自动将大量数据分成多个小块（或页面），每次只加载和渲染当前视图范围内的数据块。这个过程是事件驱动，当用户滚动列表时，这些事件通知应用程序加载和渲染新的数据块。在后台，虚拟化管理模块还将即将进入视图范围的数据项缓存起来，以便快速访问。这减少了对数据源的频繁访问，提高了性能。
主要原理很简单：
- 视口渲染：列表虚拟化技术的核心是只渲染用户当前可视区域内的元素，而不是一次性渲染整个列表。当用户滚动时，动态地加载和卸载元素。
- 占位元素：为了保持列表的滚动条高度和布局正确，虚拟化列表会使用占位元素来表示未渲染部分的高度。
- 元素复用：虚拟化列表通常会重用相同的组件实例（数据或UI元素）来渲染不同的数据项，通过缓存从而减少开销。
Winform和Avalonia各自的列表虚拟化技术实现不太一样，Winform需要考虑对实时事件手动处理，Avalonia则可以依赖自带的响应式模式绑定自动完成。我一起来看看具体都实现吧。
二、Winform 与 Avalonia 实现的对比
2.1 Winform虚拟列表，以ListView为例
Winform的虚拟列表的开启需要将控件ListView的VirtualMode属性设置为true。在虚拟化过程中，用户滚动列表时，ListView会触发两个关键事件，需要我们进行实现：
- ListView.CacheVirtualItems事件：当用户滚动列表时，此事件会被触发。它通知我们哪些项即将进入视图范围，我们可以在这个事件中缓存这些项。例如，可以使用一个数组来存储这些即将显示的项，作为我们的cache。这样可以减少对数据源的频繁访问，提高性能。
- ListView.RetrieveVirtualItem事件：当ListView需要将某个项渲染到UI上时，会触发此事件。我们可以通过从缓存中读取对应的项并返回给UI来实现。如果缓存中没有找到对应的项，我们也可以选择动态生成它。
- CacheVirtualItems有时候也可以不实现，RetrieveVirtualItem也可以实时处理动态生成ListViewItem。
以下是简化后的代码实现，需要详细实现朋友们可以参考项目源码。- private ListViewItem[] CurrentCacheItemsSource; // 用于存放缓存的数组 private int firstitem; // 缓存的起始索引 private bool refcache = false; // 标记是否需要重新缓存 // 动态获取对象并提供给UI private void ListView1_RetrieveVirtualItem(object sender, RetrieveVirtualItemEventArgs e) { // 如果缓存中有对应的项，直接从缓存中获取 if (CurrentCacheItemsSource != null && e.ItemIndex >= firstitem && e.ItemIndex < firstitem + CurrentCacheItemsSource.Length) { e.Item = CurrentCacheItemsSource[e.ItemIndex - firstitem]; } else { // 如果缓存中没有对应的项，动态生成一个 e.Item = GenerateListViewItem(e.ItemIndex); } // 如果动态生成失败，返回一个空对象以避免异常 if (e.Item == null) { e.Item = new ListViewItem(new string[] { "加载失败", "", "" }); } } // 生成缓存 private void ListView1_CacheVirtualItems(object sender, CacheVirtualItemsEventArgs e) { // 如果要缓存的范围已经在缓存中，直接返回 if (e.StartIndex >= firstitem && e.EndIndex <= firstitem + CurrentCacheItemsSource.Length) { return; } // 更新缓存的起始索引和长度 firstitem = e.StartIndex; int length = e.EndIndex - e.StartIndex + 1; // 重新生成缓存 CurrentCacheItemsSource = new ListViewItem[length]; for (int i = 0; i < length; i++) { // 从数据源中获取对应的项并存入缓存 CurrentCacheItemsSource[i] = GenerateListViewItem(firstitem + i); } // 标记缓存已更新 refcache = false; // 自动调整列宽以适应内容 ListView1.AutoResizeColumns(ColumnHeaderAutoResizeStyle.ColumnContent); } // 根据索引生成ListViewItem private ListViewItem GenerateListViewItem(int index) { // 这里可以根据实际的数据源来生成ListViewItem // 示例：从一个列表中获取数据 if (index < vresultNum) { FrnFileOrigin f = vlist[index]; return new ListViewItem(new string[] { f.Name, f.Path, f.Size.ToString() }); } return null; }
如果说缓存有100个元素，我们可以通过设定ListView的VirtualListSize属性来改变要显示的元素个数，比如只显示前10个，这样就可以在数据变小的时避免重新创建数组/列表对象。
5.2 Avalonia的虚拟面板 以为例
与Winform不同，Avalonia的ListBox等控件中没有VirtualMode属性，需要通过VirtualizingStackPanel等方式开启，xml代码如下。绑定的核心思想是，我们将真实数据的引用存起来，Listbox则是绑定到一个IEnumerable对象接口中。当真实数据需要更新时，我们控制IEnumerable的更新。
由于IEnumerable是延迟实现的(yield return)因此不会产生额外数组开销。可以通过Take(DisplayCount)的方法去动态控制所展示数据的长度，类似于Winform的VirtualListSize, 这样能够有效提升性能，尤其是在处理大量数据以及处理数据长度频繁变化的场景。
在下面的代码中给出了一个ViewModel的示例实现，需要用到Avalonia.ReactiveUI库(这个库需要单独在Nuget上下载)。- public class DataViewModel : ReactiveObject { private IList _allData = []; private IEnumerable _displayedData = []; private int _displayCount = 100; public IEnumerable DisplayedData { get => _displayedData; private set => this.RaiseAndSetIfChanged(ref _displayedData, value); } bool isShowOpenWith = true; public bool IsShowOpenWith { get => isShowOpenWith; set { this.RaiseAndSetIfChanged(ref isShowOpenWith, value); } } public int DisplayCount { get => _displayCount; private set { _displayCount = value; } } public DataViewModel() { } public void Bind(IList _allData) { if (this._allData != _allData) { // 生成测试数据（实际中可能从文件或数据库加载） this._allData = _allData; //UpdateDisplayedData(); } } public void UpdateDisplayedData() { // 使用 LINQ 的 Take()，这是惰性求值的，性能很好 DisplayedData = _allData.Take(DisplayCount); } // 快速切换到不同数量级 public void SetDisplayCount(int count) { DisplayCount = count; } }
还有一个问题就是，Avalonia在VirtualizingStackPanel中，虚拟化后可能数据不是瓶颈，UI显示同样会造成卡顿，尤其是在应用虚拟化时实时渲染发复杂的布局。因此我们可以设置VirtualizingStackPanel.CacheLength属性。
这个属性是一个double值，决定了在视口上方和下方（或左方和右方）要保持多少额外的空间。值为 0.5 表示系统在每一侧（上下或左右）将缓冲视口大小的一半，此时将实例化更多UI元素。尽管会占更多内存，但大大减少Measure-Arrange循环的次数（measure:确定控件所需的最小宽度和高度; arrange:将控件放置在父控件中，并确定其最终的位置和大小;Arrange:） 否则，在UI复杂程度较高时，GC压力巨大。
三、最后
感谢您的耐心阅读，希望各位从零开始的新朋友和老朋友有所收获！如果你对这篇文章的内容有任何建议或想法，欢迎随时交流！本文中TDS文件搜索工具的Winform版本已在仓库完全开源了！点个 Star ⭐️支持一下！代码仓库地址 https://github.com/LdotJdot/TDS_Winform 更多请关注微信公众号"萤火初芒"，
下期预告：
“TDS文件搜索_Winform版本与avalonia开发差异比较：（三）系统文件图标ico动态获取与虚拟化时的绑定”
重要 关注微信公众号‘萤火初芒’，有问题公众号留言，作者务必第一时间回复解答交流~！！！
来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！ |
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
照妖镜
