将表追加到 DOM 时的浏览器内存使用情况

问：

下面的代码是 JavaScript 如何创建表格的片段，包括行和单元格，然后附加到 DOM 以显示在页面上。

目前跨多个表处理 4,000 行，页面的内存使用量高达 1.6Gb！！

在我的一生中，我一直无法看到这种记忆膨胀是从哪里来的。

我已经广泛尝试使用内存快照和性能跟踪等 Chrome 网络工具缩小范围，但我并不精通读取这些数据。

function initGroupHeader(groupName, grpnum) {
   let tbl = createTableEle(groupName + "_jumpto", null, 'headertbl');
   let row = createTableRow();
   row.appendChild(doGroupNameCell(groupName)); //create a cell for the Group Name
   row.appendChild(createGrpHsCell(groupName)); //create hide/show sat link
   row.appendChild(createGrpSelDeCell(groupName)); //create hide/show sat link
   row.appendChild(createGrpPermCell(groupName, grpnum)); //create permit/deny etc links
   row.appendChild(createGrpAssGrpCell(grpnum, groupName)); //create assign group drop down
   row.appendChild(createGrpAssSwoCell(grpnum, groupName)); //create assign work order drop down
   row.appendChild(createGrpAdvLinkCell(groupName)); //create advanced link for the group
   tbl.appendChild(row);
    return tbl;
}

如果表、行和单元格都是使用 创建的。createElement()

任何想法将不胜感激。很高兴提供更多信息。

我应该指出，附加的表节点不是存储在全局变量中，而是本地变量。