第五十四节 jQuery之前端性能优化

 1 <!-- 前端性能优化
 2         从用户访问资源到资源完整的展现在用户的面前的过程中,通过技术手段和优化策略,缩短每个步骤的处理时间从而提升整个资源的访问和呈现速度,网站的性能直接回影响到用户的数量,所有前端性能优化很重要。
 3 
 4         前端性能优化分为如下几个方面:
 5 
 6             1、代码部署
 7                 a、代码的压缩与合并
 8                 b、图片、js、css等静态资源使用和主站不同域名地址存储,从而使得在传输资源时不会带上不必要的cookie信息
 9                 c、使用内容分发网络 CDN
10                 d、为文件设置last-modified、expires和etag
11                 e、使用GZIP压缩传输
12                 f、权衡DNS查找次数(使用不同的域名会增加DNS查找)
13                 g、避免不必要的重定向(加"/")
14             2、编码
15                 HTML:
16                     a、使用结构清晰,简单,语义化标签
17                     b、避免空的src和href
18                     c、不要再HTML中缩放图片
19                 css:
20                     a 精简css选择器
21                     b 把css放到顶部
22                     c 避免@import方式引入
23                     d css中使用base64图片数据取代图片文件,减少请求次数,在线转base64网站
24                     e 使用css动画取代JavaScript动画、
25                     f 使用字体图标
26                     g 使用css sprite(雪碧图)
27                     h 使用svg图形
28                     i 避免使用css表达式
29                     j 避免使用css滤镜
30                 JavaScript:
31                     a 减少引用库的数量
32                     b 使用requirejs或seajs异步加载js
33                     c js放到页面底部引入
34                     d 避免全局查找
35                     e 使用原生方法
36                     f 使用switch代替复杂的if else语句
37                     g 减少语句数,比如多个变量申明可以写成一句
38                     h 使用字母量表达式来初始化数组或对象
39                     i 使用innerHTML代替复杂元素注入
40                     j 使用事件代理(事件委托)
41                     k 避免多次访问dom选择集
42                     l 高频触发事件设置使用节流函数
43                     m 使用web storage缓存数据 -->

 

posted @ 2020-03-16 20:56  kog_maw  阅读(92)  评论(0编辑  收藏  举报