为什么 ag-grid getFilterInstance 这么慢 - 使用自定义标题

Question

查看示例代码框：

使用自定义标题时变慢（14 秒）

https://codesandbox.io/s/ag-grid-react-getfilterinstance-slow-with-custom-headers-welt9?file=/src/Grid/Grid.tsx

步骤：

1. （单击）切换以显示过滤器
2. （类型）丰田
3. 等待过滤器更新（也很慢）
4. （点击）获取过滤器
5. 等待 10 秒或更长时间让 console.log 显示...

此示例使用自定义标题，但将 agColumnHeader 添加到 frameworkComponents

const frameworkComponents = {
  agColumnHeader: AgColumnHeader
};

同样在按钮点击时 - 将过滤器切换为真

colDef.floatingFilter = !colDef.floatingFilter;
colDef.filter = "agTextColumnFilter";

不使用自定义标题时更快

https://codesandbox.io/s/ag-grid-react-getfilterinstance-fast-forked-sfd3x?file=/src/Grid/Grid.tsx:957-1523

步骤：

1. （点击）过滤器图标
2. （类型）丰田
3. 等待过滤器更新（也很慢）
4. （点击）获取过滤器
5. 等待 10 秒或更长时间让 console.log 显示...

此示例只是在加载时将 floatingFilter 默认为 true，但没有对列标题进行自定义。

 const defaultColDef: TColumn = {
    filter: "agTextColumnFilter",
    floatingFilter: true
  };

Answer 1

结果是它的 codesandbox - 慢得离谱。 我在我的本地环境中测试了它并且速度很快。 真是令人失望。