js渲染数据太大,导致浏览器崩溃

JavaScript019

js渲染数据太大,导致浏览器崩溃,第1张

js渲染数据太大,导致浏览器崩溃是JS中大量的DOM操作也会导致事件响应缓慢甚至真正卡死浏览器,在IE6下一次插入大量的HTML。解决方法如下:

1、优化循环,循环体中包含太多的操作和循环的次数过多都会导致循环执行时间过长,直接导致锁死浏览器。

2、优化函数,函数体内有太多不相干的进行拆分。

3、优化递归操作,需要小心处理。

去除不必要的插件

刚开始用 webpack 的时候,开发环境和生产环境用的是同一个 webpack 配置文件,导致生产环境打包的 JS 文件包含了一大堆没必要的插件,比如 HotModuleReplacementPlugin, NoErrorsPlugin... 这时候不管用什么优化方式,都没多大效果。所以,如果你打包后的文件非常大的话,先检查下是不是包含了这些插件。

提取第三方库

像 react 这个库的核心代码就有 627 KB,这样和我们的源代码放在一起打包,体积肯定会很大。所以可以在 webpack 中设置

{

entry: {

bundle: 'app'

vendor: ['react']

}

plugins: {

new webpack.optimize.CommonsChunkPlugin('vendor', 'vendor.js')

}

}