Pending Review
Last Updated: 29 Sep 2025 11:46 by Romain
Romain
Created on: 29 Sep 2025 11:46
Category: Kendo UI for Vue
Type: Feature Request
0
GridColumnMenuCheckboxFilter should memoize and simplify data to avoid performance issues on large datasets

Hey!

When using the GridColumnMenuCheckboxFilter with large datasets (e.g. 100k+ items), the component performs poorly and can even crash the browser due to the lack of memoization and unnecessary recomputation.

There are two main optimizations that could drastically improve performance:

1. Simplify the data before passing it to the filter
Instead of sending the entire Grid dataset to the GridColumnMenuCheckboxFilter, it’s better to extract and send only the distinct values relevant to that specific column. This significantly reduces render time both for the menu and the grid.

2. Memoize the computation internally
If simplifying data externally isn't possible, the component should at least memoize the list of unique values it derives from the data. Right now, it recomputes this on every render, which is inefficient.

Example: https://stackblitz.com/edit/de8qtiht?file=src%2Fmain.vue

The example provides two ColumnMenu implementations:
    •    The default (unoptimized)
    •    A custom, memoized version with basic optimizations (memo + uniquify)

You can switch between them in main.vue to observe the performance difference.

Expected behavior:
The default GridColumnMenuCheckboxFilter should:
    •    Either memoize its internal computation (option 2),
    •    Or documentation should clearly recommend preprocessing the data before passing it in (option 1).

This change would vastly improve UX for users working with large datasets.

    
0 comments