移动端性能优化

为什么需要性能优化

1.提升用户体验

2.移动端网络速度慢

3.移动端设备性能低

CSS和js优化

减少资源请求次数，http连接握手是比较耗时的，可使用内联的css样式，可减少http请求的次数。但同时也带来了一些问题

写过的代码无法复用，使得HTML文件变大，加载时间变长。

外部文件引入，增加了HTTP请求次数，但很好的复用代码，有效利用浏览器的静态资源缓存机制，代码分离，利于维护。

样式代码放在html头部，尽快加载。js代码与dom无关可放在页面头部，与dom节点相关一般放在尾部加载。

避免空链接，避免慢标签<table>等，js合并压缩，混淆，后端开启请求缓存。

选择器在不会误选元素的情况的下，尽量保持简单，非必要不推荐使用*等通配符，避免浏览器过度解析降低速度

尽量减少对DOM的操作次数，尽量用id查找，减少层级查找

图片优化

css画小图片，图片压缩处理，使用更高压缩比格式的图片，尽量少用图片，使用图标字体代替图片

合理使用base64内嵌图片，合并静态资源图片，雪碧图

事件优化

事件委托代替事件循环绑定

节流，稀释频繁触发的事件，如scroll，resize mousemove等

 资源加载

资源按需加载，只加载可视屏所必须的