作为一名只会喊666的咸鱼，只能作为伸手党，参（chao）照（xi）一波别人的劳动成果来加深自己的记忆 其实是自己肚子没墨水 。既然是参照，直接进入正题吧。
避免阻塞
1. 优化HTTP请求
1 - 减少请求次数：
1. 合并代码。
2. sprite化图片。
3. 小于8kb的用base64作为src源。
4. 缓存ajax，对于每次请求返回内容都相同的ajax，可以设置cache属性进行缓存。
5. 剔除重复性的脚本。
2 - 减少请求体积：
1. 让后台dalao们使用GZIP。
2. 压缩代码，减少文件的空白字符。
3. 优化图片，压缩IMG-PNG8格式，压缩图片。
3 - 减少请求资源自带cookie的体积，也叫cookie隔离，使用CDN就好，有兴趣可以看看Cookie - Free Domains技术。
4 - 减少页面中空引用的href与src标签，因为你什么都不写，浏览器还是会对服务器发起一个空的HTTP请求，会对服务器产生一些不必要的压力。
5 - 突破请求限制，同一时刻向一个域名请求下载的并行数有限，可以使用不同域名分别存放静态资源，增大并行下载量。
6 - 使用大杀器，CDN。
7 - 不要滥用post请求，post翻译过来是邮递的意思，获取数据还是用get请求。而且在大部分浏览器中post还是有分步操作，而get是一步到位，虽然效率上差别不会很明显，但这不是混淆语义的理由。
顺便附上一个get与post区别的link： get与post的区别。
8 - css置顶，script置底，如需在头部放置script，可以使用defer与async异步的script引入。
9 - 避免使用css表达式。
10 - 使用懒加载。
11 - 减少DNS查找。每次DNS查询都会有30-120ms的耗时，可以使用DNS预加载。
12 - 减少页面重定向。每次重定向都会有资源的损耗，尽量减少不必要的重定向。
渲染
1 - 减少DOM树的深度，DOM树越深，越吃浏览器的渲染资源。尽量减少不必要的DOM层级。
2 - 优化体积过大的css文件，css体积过大需要更多的时间加载，关键的资源需要进行拆分渲染，保证首屏加载速度，提高用户体验。
3 - 避免在HTML中直接缩放图片，在HTML中直接缩放图片会使页面内容重绘，会影响页面中其他操作的效率，可能会产生卡顿。
4 - 优化js加载，耗时的script应当在html底部渲染，或者使用异步加载，与首屏无关的js也应当延迟加载。
5 - 避免使用<table>与<iframe>：
table是将整个table元素渲染完毕再一次性绘制到页面上，特别吃性能，相比而言可以用其他列表元素代替，譬如ul、dl。
iframe会因为加载源页面(即src='xxx')，而造成父级进入渲染阻塞的状态，等待iframe的源页面加完完毕才会回到父级继续往下渲染，如果是必要时，可以用异步的方式动态加载iframe。
6. 避免使用css滤镜，与css表达式，太吃性能的玩意儿暂时不要玩儿吧，浏览器hold不住。
缓存
预加载
1 - 使用DNS预解析，像天猫阿里的元信息里面都有用到：
