Yslow23条军规理解

1. Make fewer HTTP requests. 尽量少的发送HTTP请求。页面有不少内嵌资源,这些内嵌资源的数量越少越好。每一次请求都是HTTP连接,每次连接服务器都会消耗,并且浏览器最多只能同时下载6个文件
2. Reduce DNS lookup.减小DNS寻找时间(解析时间)。(浏览器中查看DNS解析时间:network-all-点击连接-timing-DNS LOOKUP)(直接访问IP而不是域名能够减小DNS时间)
3. Avoid URL redirects.避免URL重定向。HTML中的内容要在重定向完成以后下载。同域:注意避免反斜杠 “/” 的跳转;跨域:使用Alias或者mod_rewirte创建CNAME(保存域名与域名之间关系的DNS记录) 
4. Make AJAX caheable.Ajax是实时响应的,在浏览器接收到新的数据前,旧的数据被缓存,这样可以更好的提升效率。“异步”并不意味着“即时”:Ajax并不能保证用户不会在等待异步的JavaScript和XML响应上花费时间。 
5. Reduce the number of DOM elements.页面不要太复杂,页面上的每一个元素叫作一个DOM元素,一个DOM元素能够当作是一个标签(`<p></p>`)的集合。
6. Avoid HTTP 404(not found) error.站点自己里(非搜索结果)出现404页面,无心义的404页面会影响用户体验而且会消耗服务器资源。有些站点把404错误响应页面改成“你是否是要找***”,这虽然改进了用户体验可是一样也会浪费服务器资源(如数据库等)。最糟糕的状况是指向外部 JavaScript的连接出现问题并返回404代码。首先,这种加载会破坏并行加载;其次浏览器会把试图在返回的404响应内容中找到可能有用的部分看成JavaScript代码来执行。
7. Reduce cookies size.减少cookies的体积。
8. Use cookies free domains.配置一些页面上静态资源文件的cookies,让这些静态资源文件(JS,css,图片等)不带cookies。好比图片 CSS 等,Yahoo! 的静态文件都在 yimg.com 上,客户端请求静态文件的时候,减小了 Cookie 的反复传输对主域名 (yahoo.com) 的影响。 
9. Put CSS at top.把CSS文件放在上面。浏览器渲染是从上往下渲染的,先下载CSS文件。避免出现页面内容展现,但样式混乱的现象。
10. Avoid CSS expressions.避免CSS表达式。CSS表达式会动态地修改CSS属性,好比调整大小、下拉滚动条,属性会动态进行计算,这样会下降用户的体验。
11. Make JavaScript and CSS external.JS和CSS均可以写在页面上面,可是最好经过文件的方式去引用,由于引用的文件能够被缓存起来。
12. Minify JavaScript and CSS.最小化JS和CSS文件,压缩它们。
13. Remove duplicate JavaScript and CSS.删掉重复的JS和CSS文件。避免重复执行。
14. Avoid AlphaImageLoader filter.不要使用滤镜。
15. Do not scale images in HTML.页面要求用多大的图片就准备多大的图片,不要后端提供大图片,前端用CSS调整图片大小。会产生性能损耗。
16. Make favicon smaill and cacheable.(重定向网页页签左端的“R”标识就是favicon。)收藏夹图标尽量小而且可缓存。
17. Put JavaScript at bottom.把JS文件放在底部。JS文件下载时是独占的,不能同时下载其余类型的文件(如CSS)。
18. Use a content Delivery Network(CDN).使用静态资源服务器。把图片、JS、CSS等文件存放在静态资源服务器上,而不是本身的服务器上,优化DNS寻找地址速度、缓存优化速度。
19. Avoid empty src and href.避免空的src和href。由于浏览器访问到空src和href后会再一次访问主页,致使多一个访问。
20. Add Expires headers.为头文件加过时时间。使内容具备缓存性。避免了接下来的页面访问中没必要要的HTTP请求。
21. Compress components with gzip.让服务器端返回gzip类型的文件,减少回包大小。
22. Configure entity tags(ETags).它用来判断浏览器缓存里的元素是否和原来服务器上的一致。比last-modified date更具备弹性,例如某个文件在1秒内修改了10次,Etag能够综合Inode(文件的索引节点(inode)数),MTime(修改时间)和Size来精准的进行判断,避开UNIX记录MTime只能精确到秒的问题。 服务器集群使用,可取后两个参数。使用ETags减小Web应用带宽和负载。
23. Use GET for AJAX requests.尽可能用GET而不是POST作AJAX请求时。POST会分两步请求。

----------
CDN理解
[参考这里](https://www.zhihu.com/question/36514327?rf=37353035)

1. HTML中常有文件引用(如CSS和JS),文件引用分为指向站点内的文件的引用和其余站点文件的引用。
2. 在一个网站项目中会出现不少的引用,小型项目(应用服务器压力不大的系统)通常会将资源文件和代码放在一块儿。这种方式的优势是开发省力,发布省力,对服务器要求小,省钱,没有具体公网接入需求。
3. 当改小型项目访问量变高,系统变慢时,资源服务器与应用服务器的分离是一种优化方式。
4. 须要在异地访问站点时,部署缓存服务器+分发服务器,将资源同步到各个缓存服务器上,各个地点进行访问站点时,就近跳转至内容缓存服务器上进行访问。
5. CDN工做流程
 
    用户发送请求->智能DNS进行解析->取得缓存服务器IP->缓存中有目标资源->把内容返回给用户
 
    用户发送请求->智能DNS进行解析->取得缓存服务器IP->缓存中没有目标资源->向源站点发起请求->把获取的内容保存到缓存服务器->把内容返回给用户css

相关文章
相关标签/搜索