优化非常大的 SVG 集合视图答案

【问题标题】：Optimizing very large CollectionView of SVGs优化非常大的 SVG 集合视图
【发布时间】：2021-06-08 09:35:35
【问题描述】：

我有一个非常大的集合，2000++ 个 SVG 图像，用户需要根据需要进行过滤。过滤是通过文本字段完成的，所以我用 LINQ 做一个简单的ObservableCollection 过滤器：

    async void SearchChanged(System.Object sender, Xamarin.Forms.TextChangedEventArgs e)
    {
        SearchableImages.Clear(); // ObservableCollection

        if (Search.Text.Length < 3) return;

        // ImageCollection is an always in-memory List<ImageItem>
        var filter = await Task.FromResult<IEnumerable<ImageItem>>(
            ImageCollection.Where((i) => i.Name.Contains(Search.Text.ToLower()))
            );
        foreach (var p in filter)
            SearchableImages.Add(p);
    }

此代码运行非常缓慢，以至于您可以在那里看到 if 块，将搜索字段的长度限制为 3。启用搜索任意长度的字符会使其无法使用。

显然Filter property of a CollectionView 不可用：

    <CollectionView x:Name="CollectionList" ItemsSource="{Binding SearchableIcons}" ...>

    string src = Search.Text.ToLower();
    CollectionList.Filter = (item) => item.Name.Contains("hello");

Error CS1061: 'CollectionView' does not contain a definition for 'Filter' and no accessible extension method 'Filter' accepting a first argument of type 'CollectionView' could be found (are you missing a using directive or an assembly reference?) (CS1061)

如何平滑地过滤大量图像？

【问题讨论】：

我真的无法想象过滤包含 2000 个项目的列表会花费很长时间。真的是过滤器这么慢吗？或者可能是显示图像的 UI？
我对 Xamarin 不是很熟悉，但是 ObservableCollection 在每次添加时都会触发一个 chenged 事件。也许说SearchableImages = new(filter) 会更快？
除了其他评论者提出的优秀观点之外，每次用户键入字符时，您都会运行此代码
感谢所有 cmets，这非常有帮助！我很困惑，因为过滤器不可用，显然问题已经更新了。

标签： c# xamarin xamarin.forms

【解决方案1】：

性能问题可能与实际过滤无关，2000个项目并不多，应该在一毫秒左右。然而，await Task.FromResult 看起来很奇怪，这根本不会做任何异步操作，可能应该完全删除，同步过滤应该就足够了，除非你有一个或多个数量级的项目。另外，你无缘无故地反复拨打Search.Text.ToLower()。

我怀疑重复调用 SearchableImages.Add(p) 触发 UI 更新等是主要问题。与往常一样，确保性能、衡量标准和/或配置文件。

为了解决这个问题，我建议查看CollectionView，它有一个可以使用的显式过滤器属性。另见：Filter an observable collection

【讨论】：

感谢您的回答，我已按照建议通过从列表中创建一个新的可观察集合来解决。今天我了解到，每个 add 都会触发一个事件，非常令人惊讶的是，在这种情况下，lambda 没有优化我认为它会被认为是常量的 .ToLower()。但是，据我所知，Filter 不可用（问题已更新）。