一    
    
    
    
、页面加载缓慢的原因

当我们打开一个网页
    
    
    
   ，页面加载比较缓慢时     


     


     


     

，可能原因有以下几点：

（1）过多的http请求

（2）长时间占用js线程

（3）页面回流和重绘较多

（4）资源加载堵塞

（5）内存泄漏导致内存过大

（6）dom节点或事件占用内存过大

（7）长时间占用js线程

（8）资源加载阻塞

二 


     


     


     


   、前端性能优化方法

优化原则：

（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）避免读取超过数组的长度

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