Javascript（AngularJS）在大型DOM更新期间不会阻止UI

Question

在我的角度应用程序中，我有一个操作，每次运行时都有可能向DOM添加数万个元素（每次用户将新数据粘贴到textarea时都会发生这种情况。

有时候它必须向表中添加20,000个表行，它只会阻止整个页面（旋转沙滩球）大约十秒钟。

有没有办法阻止UI？ （除了不将所有元素添加到DOM之外的一种方式：因为这是该特定应用程序的核心功能）

我的下一个想法是这样的：如果我在完成所有内存中的DOM操作之前隐藏表，然后再显示它？

因为，我知道更新DOM实际上是一个两阶段过程：1）更新内存中的所有元素，然后2）重新渲染页面的受影响部分。

在内存中完成DOM操作后，是否可以接收回调？

还有其他想法吗？

提前致谢！

编辑：这是相关代码

<table>
    <tr ng-repeat="row in enormousArray">
        <td ng-repeat="value in row">{{value}}</td>
    <tr>
<table>

和javscript：

$scope.someEventsHappen = function(dataString){
    var my2DArray = MyService.functionThatProcessesAStringIntoAnArray(dataString);
    $scope.enormousArray = my2DArray;
}

注意：1）这些不是我代码中实际函数和变量的名称，所以请不要讲述命名约定，2）我实际上使用＆＃39; controller作为＆＃ 39;在我的代码中，但为了简单起见，我将其翻译为$ scope。

编辑2：在做了一些阅读之后，我认为我的下一步是创建一个自定义指令，以便我可以控制数据何时以及如何在链接步骤中绑定。当我完成它时，我会在这里发布我的结果，如果它产生有用的信息。

Answer 1

尝试将行添加到对象而不是dom。然后，当操作完成时，立即将所有更改放入dom中。如果要一次将每个元素添加到dom中，则浏览器必须重新解析/重新绘制20,000次。你应该尝试在不触及dom的情况下建立桌子。

Answer 2

要在加载时隐藏DOM元素，可以使用ngCloak。但是，你正在做的事情并不是解决这个问题的正确方法。如果您正在加载数万个＆＃34;对于元素，您不会以有用的方式向您的用户祈祷查看您的页面。你需要弄清楚他们真正需要看到的是什么以及如何以一种有意义的方式提供它。没有人在网页上以任何理由查看超过20k的记录。