前端网站优化

面试的时候经常被问到网站优化，其实自己也有总结，但很多人喜欢说雅虎13条，雅虎35条；

说实话，你如果在一个小外包公司，很多时候我保证你用不到3条，甚至有时候项目紧，时间紧，代码赶紧写完了完事，没人硬去看的代码；

但时间久了，你会发现，你干3年，干5年，出去大公司面试，你的经验完全无效了，这是怎么回事呢？我这几年白干了？我什么也不懂？想去大公司无望了？小公司又不稳定？我不说脏话，我说实话，下面写几条我总结了的，希望看到的人对你有帮助，可以给我点个赞，嘿嘿

1、减少http 请求

      从服务器请求的图片就不说了，如果是网站内的小的icon啦，小图片啦，尽量去做图片精灵，通过background-position去获取需要的图片，

     js文件，css文件要尽量数量减少

2、文件瘦身

     保存图片的时候，PS直接ctrl+S 可能图片会是几十K，需要技巧， Shift + ctrl + alt + S ,这个时候图片就会很小很小哦；甚至很多时候我们采用base64去保存图片，结果图片体积真的小了；移动端小按钮，很多时候我们可以采用css3 content:before 去加载小图片，岂不是更小了；

    js文件，css文件，尽量少，尽量小；当测试通过了，把他们压缩掉；

3、引入外部js css

      因为每次页面渲染，html会被重新加载，但js css会被浏览器缓存，所以在Html里写js css 是很不明智的

4、引入的js css应该加版本号，因为客户不会经常清理缓存，如果平台js做了修改，客户会因为浏览器缓存而不能感受到你新加的功能

5、css引到html上面，js引到html下面，因为html渲染要用css，而js可以页面加载完再引用，这样增加了页面渲染的速度

6、减少DNS查询次数

     DNS是啥，说白了就是你输入www.baidu.com，然后通过网络，通过网线，最终解析域名找到你这个网址所在的那个服务器，然后再把网页信息下载回来，展示到浏览器上，怎么样，这个DNS查询路程是不是有点远？所以如果你的网站文件（js css img等）放到了多个域名下，那就DNS查询就会多了呗，所以尽量文件存放的域名尽量少

7、缓存ajax数据

     其实这条我不是很喜欢，因为ajax如果被缓存住了，我们传了不同的参数，返回的数据还一样，那就出bug了；

     所以，如果是请求过的ajax，我们把返回的数据存放到本地，用的时候不发ajax了，直接拿数据来用；

     如果是不同的接口，我们其实更应该避免缓存，这个时候给ajax加个随机数

8、减少DOM元素数量

     这个好理解吧，DOM数量越多，加载越慢呗

9、减少使用iframe啦 table啦，这些东西不利于搜索引擎抓取，页面渲染也受影响

10、避免404

     如果你的网站404了以后，是个空白页，用户会觉得你们不专业，搜索引擎抓网站也受影响，所以我们做一个自己网站的404指向页面

暂时先这么多吧，以后遇到好的再更新。