关于浏览器并行加载文件，还有 CSS/Javascript 放 head/body 的问题

[ivanlw]

找到Yahoo的一篇很有名的文章: Best Practices for Speeding Up Your Web Site, https://developer.yahoo.com/performance/rules.html

里面Put Scripts on Bottom这一段讲到了根据HTTP/1.1 specification，浏览器从一个host name最多只能同时下载两个文件。而script不同，无论从几个host name，只能同时下载一个，不会开始其他的。

但是经过测试的时候，发现js都是同时下载的，请问这个是浏览器违反规定来提升performance吗？


还有，根据http://stackoverflow.com/questions/14328449/when-do-you-put-javascript-in-body-when-in-head-and-when-use-doc-load，js放在头部的话，会在大多数HTML加载之前被加载，而放在底部的话，会等全部HTML加载完再加载javascript，但是实际中也是不一样的：
放在底部：


放在头部：

[zzNucker]

一般情况来说：是你的浏览器太高端了。
你应该用比较落后的浏览器来测。

[ivanlw]

@Livid 图片链接有问题？微博图床和imgur都试过了，都是这样子的乱码，请麻烦查看和编辑我的帖子。

[qq286735628]

瀑布图，里面看到的只能同时并行下载两个文件，讲的是IE6。
因为当年IE6如此苛刻，才有减少HTTP请求这条规则，才诞生了雪碧图这个优化手段。

不同版本浏览器，这个并发数不一样。
现在Chrome的并发数已经提高了很多，但依旧使用雪碧图，因为雪碧图合并请求之后，可以减少TCP握手时间，同时，并不是所有公司的静态资源服务器都是那么的牛逼，能够快速响应并返回静态资源。

图例，wait的时间，可以想象成服务器去找这个资源的时间。用Nginx比Apache会快一点，用了SSD也会比HDD快一点。



假以时日，SPDY的推广，让HTTP请求可以复用TCP的握手。同时，资源服务器上面的Nginx和SSD配合，减少这个wait时间，雪碧图基本上就没有存在意义了。

[qq286735628]

刚才瀑布图带了缓存，下面这个是没缓存的

[qq286735628]

至于第二个问题，JS放头部，会阻塞HTML。
并不是指阻塞当前这个HTML文件，而是指阻塞html渲染过程中的后续资源文件，例如你BODY中的各种IMG标签，肯定要等这个JS加载完才能加载（IE6下面），如果JS传输时间久，就会造成页面空白期，用户看起来就觉得卡

[jsonline]

你看的文章太旧了

[mfaner]

script那句好像没在specs里面，应该是作者自己说的

[Livid]

@ivanlw 如果同样的图片链接在文章中出现两次以上就会这样。确实是一个 bug。4 小时内解决。