javascript预加载复杂数据

我有一个简单的网页,作为对更复杂数据集的介绍.

这组复杂的数据需要大量时间才能呈现.

对于新用户,当他们到达简单网页时,我开始在内存中渲染复杂页面,创建html元素等,而无需将其插入dom.

但是,这仍然明显较慢,并且会导致介绍页面上的滚动停滞和滞后.

我正在考虑使用网络工作者.但是在我做出这样的承诺之前,我在询问这是否真的是可行的方法,或者是否还有其他解决方案.谢谢.

编辑：

考虑到这一点,我在渲染数据时实际上并没有访问dom,模板引擎将字符串组合在一起以创建html,因此网络工作者完全可以.

关于此方法,任何人都可以分享吗？

解决方法:

当然,网络工作者将是必经之路.但是对于不支持网络工作者(IE< 10)的浏览器,这是一种备用方法： 如果您的代码是同步的,它将在运行时冻结浏览器.但是,如果您可以将处理分成大块的大小,则可以将其分解成足以使浏览器有机会响应用户交互的部分. 因此,此代码：

for (var i = 0; i < data.length; i++) {
    processData(data[i]);
}

变成这个：

var i = 0;
(function processNext() {
    if (i < data.length) {
        processData(data[i++]);
        setTimout(processNext, 0);
    }
})();

这是不理想的-如果processData()做得太多,则UI仍然会无法接受而无响应.另一方面,如果执行的不是很多,则会大大降低您的数据处理速度.在后一种情况下,可以在调用setTimeout之前一次处理一定数量的迭代：

var i = 0;
(function processNext() {
    if (i < data.length) {
        for (var stop = i + 100; i < stop && i < data.length; i++) {
            processData(data[i]);
        }
        setTimout(processNext, 0);
    }
})();

标签：web-worker,javascript
来源： https://codeday.me/bug/20191201/2083601.html