前端页面性能优化

长列表滚动优化

给body添加上-webkit-overflow-scrolling: touch来优化移动段的滚动

防抖和节流

设计到滚动等会被频繁触发的DOM事件，它们都是为了限制函数的执行频次，以优化函数触发频率过高导致的响应速度跟不上触发频率，出现延迟，假死或卡顿的现象

移动端点击事件

touchstart、touchend代替click，click在移动端会有300ms

webWorker的使用

web worker 是运行在后台的 JavaScript，独立于其他脚本，不会影响页面的性能。您可以继续做任何愿意做的事情：点击、选取内容等等，而此时 web worker 在后台运行。

css，js压缩

当我们的项目进行上线时，也就是生产环境，css，js的压缩可以达到一个事半功倍的效果，极大的减少项目资源体积，减少服务器请求的压力。

CDN托管

当需要请求一些资源时，或者只在某个环节可能用到的一些网络资源时，我们可以适当地利用cdn进行资源托管，cdn可以谷歌自行搜索bootcss，里面有大量的cdn地址。

html结构渲染优化

尽量避免多次操作dom元素，否则会造成浏览器多次重构渲染dom树，造成一定的负担。比如当我们需要重复替换某个节点内的多个子节点，我们可以先将其循环渲染在节点碎片文档fragment中，再将其渲染至真实dom节点中。创建fragment方式为document.createDocumentFragment()