《高性能网站建设指南》笔记

js文件什么时候合并？

css和js到底是内联还是外部引入？

　　前者速度快，但没办法缓存，没办法多页面共用；后者速度慢，需要额外的请求，但可以缓存，多页面共享。

　　两全其美的办法【内联+预加载+cookie标志判断】：用户第一次打开网页时，没有cookie，服务器返回包含内联css和js的页面和cookie，速度很快，页面空闲下来后执行预加载；第二次打开有cookie了，而且第一次执行了预加载，现在可以返回一个带外部文件的html了，因为之前预加载了，所以速度很快。注意，第一次预加载的时候，要处理内联代码和预加载的代码，防止两者冲突。解决冲突的方式如下（主要是处理js，因为css重复的话没问题，但js重复执行的话可能会造成问题）：

　　1.创建一个不可见的iframe，里面是空白。iframe标签onload之后，往里面的dom添加script标签或者link标签，因为iframe内外环境是隔离的，所以不会有影响

　　2.使用preload、prefetch等属性

　　3.最麻烦的方式，处理冲突的逻辑嵌入到业务逻辑中。标志一个全局变量，来判断代码有没有执行过。

流量跟踪

　　对于站内的网站，可以使用refer来的统计。

　　但对于站外的地址，就不能使用refer了（没办法获取发给其他服务器的请求），可以对出站地址进行包装，如http://www.mtsite.com?url=www.baidu.com 访问这个地址，实际是访问了站内的网站，进行统计后，再302重定向。

　　跟踪出站流量，除了以上重定向的方式外，还有其他变种，本质都是把跳转过程从服务器移到了前端，用js来实现实现跳转而已，方式如下，重写a标签的点击事件（return false），发送请求记录站外的地址（ajax方式、new Image()方式），（回调事件中、img的onload或onerr中）再跳转。

　　以上要注意的一点是：a标签如果没有指定target，跳转会导致当前文档被卸载。所以在这种情况下，必须要把location.url=xxx;放到回调事件中执行

　　使用重定向的一个目的是：美化url。访问短的好记的url，然后重定向到长的url去。

配置或者移除Etag

　　etag的值与文件大小、修改时间以及inode（或者说文件所在的硬盘序列号）有关。集群服务器中相同的文件会对应不同的etag（inode、硬盘序列号不同）。n台文件服务器中，能命中304的几率只有1/n，效率低下。解决办法是：配置或者移除etag。

　　配置etag：对文件服务进行配置，是etag仅仅与文件大小、修改时间相关，这样一来，多台服务器对于同一个文件也能生成同一个etag了。

　　移除etag：不使用etag，而使用last-modified来代替。这其实和配置etag的思路一致的，即多台服务器对于相同的文件都能成功标识

　　前者标识文件的修改时间和大小，后者标识文件的修改时间。所以总结起来移除etag是最好的选择。

---

 

1.浏览器对同一个主机有固定的并行下载数，如果页面的资源来自于多个主机，则下载的效率可以提高（脚本除外，不管是否来自同一个主机，下载和执行脚本的时候总是阻塞其他资源的下载和dom渲染），但dns查找所消耗的时间也会增加。除了可以增加并行下载数，还可以降低无谓的cookie流量（访问文件也会带上cookie，不同主机的cookie不共享）

2.典型的预加载图片方式：

onload = function(){
     if(document.images){
            new Image().src = "xxx.jpg";
     }  
}

3.使用iframe是一种清除广告系统与当前页面系统的简单手段，但会增加额外的http请求