前端页面加载缓慢的原因和性能优化问题(前端页面加载缓慢怎么办)

推荐整理分享前端页面加载缓慢的原因和性能优化问题(前端页面加载缓慢怎么办)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:前端按需加载,前端页面加载性能分析,前端页面加载缓慢,如何解决,前端页面加载性能分析,前端页面加载缓慢怎么办,前端页面加载缓慢,如何解决,前端页面加载缓慢怎么办,前端页面加载缓慢,如何解决,内容如对您有帮助，希望把文章链接给更多的朋友！

当我们打开一个网页，页面加载比较缓慢时，可能原因有以下几点： （1）过多的http请求 （2）长时间占用js线程 （3）页面回流和重绘较多 （4）资源加载堵塞 （5）内存泄漏导致内存过大 （6）dom节点或事件占用内存过大 （7）长时间占用js线程 （8）资源加载阻塞 （9）页面回流和重绘较多

优化原则： （1）减少http请求（图片使用雪碧图、Base64、字体图标等，减少重定向、使用缓存，不使用css@import，避免使用空的src和href） （2）资源压缩与合并（包括html压缩、css压缩、js的压缩和混乱、文件合并等） （3）优化网络连接（使用CDN，DNS预解析，使用keep-alive或persistent建立持久连接） （4）优化资源加载，代码拆分，按需加载，降低CSS对渲染的阻塞，尽早的加载CSS，降低加载的大小 （5）减少重绘回流 （6）webpack性能优化（打包公共代码，动态导入和按需加载，删除无用的代码，长缓存优化，公共代码内联） （7）减少iframes使用 （8）避免table布局 （9）css、js尽量使用外链 （10）实例化后避免添加新的属性 （11）避免读取超过数组的长度 （12）避免元素类型转换

原文参考链接：前端性能优化的七种方法