前端提升性能的方式

一、DNS预解析

能够经过预解析的方式来预先获取域名所对应的IP。

二、浏览器缓存

　　强缓存与协商缓存。

　　强缓存表示在缓存期间不须要请求。　

　　若是缓存过时了，咱们就可使用协商缓存来解决问题。协商缓存须要请求，若是缓存有效会返回 304。

协商缓存须要客户端和服务端共同实现。

三、预加载

　　有些资源不须要立刻用到，可是但愿尽早获取，这时候就可使用预加载。惟一缺点就是兼容性很差。

四、懒加载

　　懒加载就是将不关键的资源延后加载。

　　懒加载的原理就是只加载自定义区域（一般是可视区域，但也能够是即将进入可视区域）内须要加载的东西。懒加载不只能够用于图片，也可使用在别的资源上。好比进入可视区域才开始播放视频等等。

五、文件优化

　　图片优化：减小像素点、减小每一个像素点可以显示的颜色。

六、CDN 加载

　　静态资源尽可能使用 CDN 加载，因为浏览器对于单个域名有并发请求上限，能够考虑使用多个 CDN 域名。对于 CDN 加载静态资源须要注意 CDN 域名要与主站不一样，不然每次请求都会带上主站的 Cookie。

七、使用 Webpack 优化项目

　　对于 Webpack4，打包项目使用 production 模式，这样会自动开启代码压缩

　　使用 ES6 模块来开启 tree shaking，这个技术能够移除没有使用的代码

　　优化图片，对于小图可使用 base64 的方式写入文件中

　　按照路由拆分代码，实现按需加载

　　给打包出来的文件名添加哈希，实现浏览器缓存文件

八、如何渲染几万条数据并不卡住界面

　　能够经过 requestAnimationFrame 来每 16 ms 刷新一次