HTML 加载速度
我想加快 HTML 页面的加载速度。 我知道我可以压缩 HTML、JS 和 CSS,但我想更进一步。 我(或服务器)不需要链接到 CSS 和 JS 文件,而是直接将它们的内容复制并粘贴到 HEAD 中。这基本上是为了节省一些到 Web 服务器的 TCP 往返次数。
我不知道的是... 浏览器是否为每个 JS 和 CSS 文件发出单独的 HTTP 请求?
感谢您的意见
谢谢! -阿萨夫
I want to speed up loading of an HTML page.
I know I can compress the HTML, JS, and CSS, however I was thinking of taking this a step further.
Instead of having links to CSS and JS files, I would (or the server) just copy&paste their contents in the HEAD directly. That is basically to save a few TCP round trips to the web server.
What I don't know is...
Does the browser make a separate HTTP request for each JS and CSS file?
Will appreciate your input
Thanks!
-Assaf
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
是的,对于每个 JS 和 CSS,都有一个单独的 HTTP 请求。但是,TCP 连接可以相同,也可以不同,具体取决于 Keep-Alive 标头。
http://en.wikipedia.org/wiki/Keepalive
您是否认为只需复制粘贴JS 和 CSS 进入头部会让你的网站难以维护。我总是将 CSS 和 JS 放在中心位置,即使这会增加一点性能开销。
您可能需要检查 Web 服务器提供的压缩技术。例如,如果您使用的是 IIS,请查看 IIS 压缩
http://www.microsoft.com/technet/prodtechnol/windowsserver2003/library/iis/d52ff289-94d3-4085-bc4e-24eb4f312e0e.mspx
Yes, for each of the JS and CSS, there is a seperate HTTP request. However, the TCP connection can be same and could be different depending on the Keep-Alive header.
http://en.wikipedia.org/wiki/Keepalive
Have you thought that just copy pasting the JS and CSS into the head can make your site difficult to maintain. I would always keep my CSS and JS at the central location even if it adds small overhead to performance.
You might want to check compression technology provided by your web server. For instance, if you are using IIS, check out IIS compression
http://www.microsoft.com/technet/prodtechnol/windowsserver2003/library/iis/d52ff289-94d3-4085-bc4e-24eb4f312e0e.mspx
是的。您可以使用标头分析工具观察这些请求的实际情况,例如 LiveHTTP for Firefox 。
http://developer.yahoo.com/performance/rules.html 是一个很好的总结的进一步优化。
Yes. You can watch these requests in action with a header analysis tool, such as LiveHTTP for Firefox.
http://developer.yahoo.com/performance/rules.html is a great summary of further optimizations.
是和否。通常是的,但您可以通过启用浏览器缓存来阻止返回访问时不需要的 JS 和 CSS 请求。然而,只有当大量请求来自回访用户,并且 JS 和 CSS 文件不经常更改时,缓存才有用。您需要根据预期的波动性在响应标头中设置缓存时间。此缓存教程解释了缓存标头的使用。
避免陈旧缓存的另一种方法是在每次更改时重命名 JS 和 CSS 文件及其在 HTML 中的引用。
如果在许多 HTML 页面中引用相同的 JS 和 CSS 文件,那么将它们与页面分开应该更能优化性能。
Yes and No. Generally yes, but you can stop unwanted JS and CSS requests on returning visits by enabling browser caching. Caching, however is only helpful when substantial share of requests come from returning users, and also, if JS and CSS files are not changed very often. You would need to set up caching time in response headers based on their expected volatility. This Caching Tutorial explains use of caching headers.
Another approach to avoid stale cache is to rename JS and CSS files and their references in HTML on every change.
If the same JS and CSS files are referenced in many HTML pages, than keeping them separately from the pages should be more optimal for performance.