前端性能优化

网页加载的性能优化

• 1.对浏览器的DNS进行优化，选择较好的DNS
• 2.使用合适的CDN（内容分发网络）

• 3.对js，css图片进行优化

  js使用defer(下载js不阻塞页面加载，等到页面解析完后执行js)、async（不阻塞页面加载，下载完之后立即执行）

  css：选择器上进行优化：不要使用过多的后代选择器

  选择合适的图片格式：PNG8、WebP

  对js、css进行压缩

• 4 减少网站的http请求数

css sprites（将很多图片整合到一张图片中，通过css定位显示，页面加载时，一次性加载全图，有效减轻服务器压力，缩短用户加载图片的等待时间，更流畅）

多使用cache缓存，尽量缓存一切可缓存的资源

按需加载（将重要、急需的内容放到前面加载），但是缺点：可能会导致大量重绘，影响页面性能。

静态资源域名不使用cookie

避免重定向

如何提高前端性能

• 1.用web storage 替换cookie
• 2.使用css动画，而不是js动画
• 3.使用客户端数据库
• 4.直接使用js的新性能
• 5.缓存html标记
• 6.使用硬件加速