盘算如今最先在博客里写点东西，也能为本身看过的书学过的学问做一个归结总结。
这几日拜读了Steve Souders的《高机能网站建立指南这本书》，虽然这本书能够已有些老了，但薄薄的一个小册子里提出的网站机能优化的原则照样异常有价值的。这些划定规矩都有个共同点，就是用很小的事情就能够取得很明显的机能提拔，性价比极高。空话不多说了，总结一下书里的几点机能优化划定规矩。
起首有一点须要申明的是书中所写的机能黄金轨则：只要10%~20%的响应时刻花在了下载HTML文档上，其他的80%~90%时刻花在了下载页面的一切组件上。
这也是背面这些机能划定规矩由来的中心。
划定规矩一：削减HTTP要求。这本书的划定规矩递次是依据其重要性来排名的，削减HTTP要求作为第一个划定规矩，足见其重要性。依据黄金轨则，削减组件数目从而削减HTTP要求是最有用的机能优化体式格局，个中有几项手艺值得提一下：
CSS Sprites。应当前端人都比较熟习了，把图片整合到一个大图里，应用background-position来定位。
data:URL。值得一说把图片变成内联的，削减了图片要求，webpack里图片小于8kb就会转为base64的data:URL。
兼并剧本和CSS。
划定规矩二：运用CDN。这个划定规矩不必多说，分发内容使之更接近终端用户，削减了要求时刻。
划定规矩三：增加Expires头。善用缓存，给久长稳定的内容组件设置有用期较久的Expires头。
划定规矩四：紧缩组件。应用gzip等内容编码对文档或组件举行紧缩，一般能将响应数据量削减70%摆布。
划定规矩五：将样式表放在顶部。页面在打开工程中逐渐显现，用户会以为页面快一些，也让用户在守候历程当中有一个优越的反应。把CSS放在底部的话有能够涌现白屏征象。
划定规矩六：将剧本放在底部。页面下载剧本时会阻挠其他内容下载与显现，以防备浏览器的重绘重排。所以把剧本放在页面的底部不会阻挠页面内容的显现，而且页面一些可视化组件能够尽早下载而不被壅塞。
划定规矩七：防止运用CSS表达式。CSS表达式会举行频仍的求值，致使了机能低下。
划定规矩八：运用外部JavaScript和CSS。地道而言，内联更快一些，由于满足了划定规矩一的削减HTTP要求，然则这个问题上，一定要斟酌缓存带来的机能优化，外部文件很有能够被缓存下来，从而提拔了机能。
划定规矩九：削减DNS查找。善用DNS缓存，比方耐久衔接。
划定规矩十：精简JavaScript。移除不必要的字符空格，我们罕见的.min.js就是云云。
划定规矩十一：防止重定向。3xx的响应状况码代表着一股重定向的响应。个中URL末端缺乏斜线形成的重定向须要特别注意，不要由于这一点失误毁伤机能。
划定规矩十二：删除反复剧本。
划定规矩十三：设置ETag。提及这个不得不说前提要求If-Modified-Since和If-None-Match，都是用来举行缓存再考证。ETag的问题是服务器组织ETag时，只管两个文件完整一样，但假如处于差别的服务器的话照样会有差别的ETag，增加了HTTP举行要求下载的次数，这关于背景是服务器集群的网站机能毁伤很大。
划定规矩十四：使Ajax可缓存。虽然Ajax是异步的，但也不能让守候响应的时刻太长。优化原则的话拜见上面的机能原则，个中善用缓存依然是我们重点关注的。
书最后用这些原则剖析了美国十大网站，发明有用应用这些划定规矩机能有很大的提拔空间，我也看了一下本身练习时刻项目，发明可优化的处所异常多。今后的开辟历程当中要服膺这些原则，让本身产物的用户取得更好的体验。
