常用前端性能优化

一、减少http请求次数和大小

1.使用合并的静态css和js资源,图片可使用雪碧图,以及使用base64表示简单的图片

2.减少不必要的请求资源，可对代码进行压缩优化

　　a: 将table标签布局改为div布局

　　b: 精简div,span等标签的使用

　　c: 删除多余的空格和注释

　　d:网页GZIP压缩Content-Encoding:gzip

二、css,js外部引用

避免使用style和script引入，在html文件中引入外部的资源可以有效利用静态资源缓存，在以后使用可使用缓存。（style属性改变结点样式，每设置一次将会导致一次dom变化的回流，最好使用class,b不影响其他的布局）

三、使用cdn加速

CDN系统能够实时地根据网络流量和各节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上，当然cdn质量影响请求质量

四、精简css，js，html

1.css放在hmtl顶部，防止出现空白页

2.js放在html底部，防止JavaScript的加载和解析执行对页面渲染造成阻塞

3.避免空的href和src,阻止其他资源下载进程

五、避免重定向

重定向大概600毫秒的时间开销

六、按需加载，延迟加载，异步加载

七、字体图标和css3效果代替图片

八、为HTML指定Cache-Control或者Expires

九、get比post请求效率高

POST请求会首先发送文件头，然后发送HTTP正文的数据。而使用GET只发送头部

将有效的资源缓存，避免频繁向服务器发送请求

十、避免无谓的循环

break、continue、return的适当使用

十一、避免无谓的循环

如:临时创建元素,并添加内容和属性,以及将父元素添加到DOM树

性能优化可参考