web前端性能优化问题
常用的几大优化解决：
- 页面内容的优化
- 减少http请求
途径：
1>启用http/2--越来越多的浏览器都开始支持 HTTP/2。HTTP/2 为同一服务器的并发连接问题带来了很多好处。换句话说，如果有很多小型资源需要加载（如果你 打包过的话就没有必要了），在延迟和性能方面 HTTP/2 秒杀 HTTP/1。
2>设计层面保持简洁，减少资源请求。
3>根据需求设置http缓存--少变的可以在header中延长过期头；变化不频繁而又可能会变的资源可以使用 Last-Modifed来做请求验证
4>资源合并压缩--外部的文件进行压缩处理（js,css,image），减少多次请求。压缩合并工具grunt，gulp，webpack等
5>css Sprites 精灵图 多个图片在一个整体的图片上， 减少图片的请求
2. 减少DOM的数量
DOM的操作费时费力，每次的访问及修改都会导致页面的reflow和repaint需要耗费大量的资源，如使用循环的时候，结束后将变量保存到局部，在进行访问。
3. 避免404
4.减少DNS查询的数量
DNS解析优化（DNS缓存、减少DNS查找、keep-alive、适当的主机域名）
5. 避免不必要的http跳转
根据服务器需求http路由请求时‘/’是否要带
- JavaScript&&css的优化
- 样式表置顶--脚本表置底
- 外部引入文件
- 避免css表达式
- link替代@import 因为@import相当于将css放到底部
- 避免Fliters
- 避免重复代码
- Javascript代码优化 减少空格和注释
- 图片
- 压缩图片使用Sprite技术 -- 水平排列 ，颜色接近的排在一起 ，
- favcion.ico 浏览器会去读取这个图片 --确保存在，小 <1k ,过期时间设置较长
- cookie
- 减少cookie的大小和控制cookie污染
去除没有必要的cookie 存在请求头中
cookie<=4k 尽量减小cookie的使用
合理使用cookie的生命周期
2. 页面内容是用无域名cookie
静态页面资源不需要cookie，可以使用domain单独存放这些静态文件，有些proxy拒绝缓存带有cookie的内容，如果能将这些静态资源cookie去除，那就可以得到这些 proxy的缓存支持。
- 标签的优化
1.<title>标题：只强调重点即可，尽量把重要的关键词放在前面，关键词不要重复出现，尽量做到每个页面的<title>标题中不要设置相同的内容。
2.<meta keywords>标签：关键词，列举出几个页面的重要关键字即可，切记过分堆砌。
3.<meta description>标签：网页描述，需要高度概括网页内容，切记不能太长，过分堆砌关键词，每个页面也要有所不同。
4.<body>中的标签：尽量让代码语义化，在适当的位置使用适当的标签，用正确的标签做正确的事。让阅读源码者和“蜘蛛”都一目了然。比如：h1-h6 是用于标题类的， <nav>标签是用来设置页面主导航的等。
5.<a>标签：页内链接，要加 “title” 属性加以说明，让访客和 “蜘蛛” 知道。而外部链接，链接到其他网站的，则需要加上 el="nofollow" 属性, 告诉 “蜘蛛” 不要爬，因 为一旦“蜘蛛”爬了外部链接之后，就不会再回来了。
- 移动客户端
保持单个内容小于25kb
参考文章：
http://blog.csdn.net/grandpang/article/details/51329289
http://www.cnblogs.com/EnSnail/p/5671345.html
http://www.qdfuns.com/notes/18892/168da392c447a172d3dd0d8e1754ca48.html
http://www.cnblogs.com/lei2007/archive/2013/08/16/3262897.html
http://www.cnblogs.com/ricoliu/p/6090290.html
