长列表滚动优化
给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()