Ext.grid.Panel内存溢出排查咨询（ExtJS7.5.1迁移场景）

一、验证Store与BufferedRenderer的兼容性配置 #

BufferedRenderer仅对缓冲型Store生效，先确认Store配置是否符合要求：

• 检查Store是否设置buffered: true，或直接继承Ext.data.BufferedStore；若使用普通Store，插件会自动失效
• 禁用pageSize配置（缓冲Store依赖leadingBufferZone/trailingBufferZone控制预加载范围，而非分页）
• 确认Store未一次性加载全部8万条数据到本地（若本地缓存全量数据，即使虚拟渲染，Store内存占用也会偏高，但你的问题核心是DOM溢出，重点仍在渲染逻辑）

二、检查Grid视图与滚动容器的有效性 #

BufferedRenderer依赖Grid的滚动容器实现虚拟渲染，若滚动逻辑失效，会退化为全量渲染：

• 打开浏览器DevTools的Elements面板，查看Grid的<tbody>下的<tr>数量：正常仅渲染可见行+前后缓冲行（约几十到上百条），若出现数万条<tr>，直接证明插件未生效
• 检查Grid配置：
  • 确保scrollable: true（默认值，但若被自定义代码覆盖为false，插件会自动禁用）
  • 确认Grid或其父容器有明确的高度值（若高度自适应且未限制，滚动条无法生成，插件无法触发虚拟渲染）
  • 排查viewConfig中是否存在强制全量渲染的配置，比如自定义rowRenderer时未遵循虚拟渲染逻辑，或设置了trackOver: true导致行元素被强制保留

三、深入验证BufferedRenderer插件的运行状态 #

即使插件属性显示正常，仍需确认其实际运行逻辑：

• 在控制台执行以下代码，查看插件的渲染范围：

  // 查看当前渲染的行范围
  console.log(grid.bufferedRenderer.renderedRange);
  // 查看视图应渲染的行数
  console.log(grid.bufferedRenderer.viewSize);
  

  若renderedRange.end - renderedRange.start接近8万，说明插件未正确执行虚拟渲染
• 监听插件的核心事件，确认是否触发：

  grid.bufferedRenderer.on({
    beforerender: () => console.log('bufferedrenderer beforerender triggered'),
    render: () => console.log('bufferedrenderer render triggered')
  });
  

  若事件未触发，说明插件初始化流程被阻断
• 检查是否有代码在Grid初始化后调用grid.getView().refresh()或grid.reconfigure()，这类操作可能重置BufferedRenderer的状态

四、排查自定义代码与ExtJS核心逻辑的冲突 #

• 搜索项目中是否存在对Ext.grid.View、Ext.grid.plugin.BufferedRenderer的重写代码，尤其是refresh、onDataChanged、renderRows等核心方法，重写逻辑可能破坏虚拟渲染
• 检查是否有自定义组件或插件强制遍历所有Grid行（比如批量选择、导出功能），这类操作可能触发全量DOM渲染

五、尝试修复性验证操作 #

• 手动显式配置BufferedRenderer插件，覆盖默认自动启用逻辑：

  Ext.create('Ext.grid.Panel', {
    // ...其他配置
    plugins: [{
      ptype: 'bufferedrenderer',
      leadingBufferZone: 100, // 可视区域前预渲染行数
      trailingBufferZone: 100 // 可视区域后预渲染行数
    }]
  });
  

• 若使用锁定列（lockedColumns），需分别检查锁定视图与普通视图的BufferedRenderer状态，锁定列的虚拟渲染逻辑可能存在独立问题

六、内存快照的深度分析 #

• 在Chrome DevTools的Memory面板拍摄Heap快照，筛选HTMLTableRowElement，查看这些节点的父容器是否为Grid的滚动容器，确认是否被意外渲染到其他DOM节点中
• 查看节点的保留树（Retainers），定位持有这些DOM节点的对象，排查是否存在内存泄漏（比如未移除的事件监听器、全局变量引用）

内容的提问来源于stack exchange，提问作者João