What can I do to decrease load times of HTML pages?
注意：这是一个社区wiki帖子
为了尽量让用户体验最佳，我可以做些什么来提高HTML页面的加载效率？
在处理页面性能时，有一些重要的方法可以使页面加载时间保持快速。
CSS组织尽量减少内联CSS样式，并在外部样式表中将常用的CSS规则放在一起。这有助于为以后保留可重用的样式，并且缺少样式属性使您的HTML页面下载更快。
缩小化由于CSS和JavaScript包含的内容必须从服务器下载到客户机，所以越小越好。雅虎有一个很棒的工具叫yui compressor，可以用来减小CSS和javascript的大小。流行的库(如jquery)也将提供其库的缩小版本和开发版本。只需记住为调试目的保留一份非缩小版本的副本！
图像压缩您可能需要考虑压缩图像。对于JPG文件，尝试设置大约80%的压缩率，并查看结果如何。你可以玩弄水平，直到你得到一个不错的结果。对于PNG文件，您可能需要查看一些可用的PNG压缩工具。
图片合并保存HTTP请求的一个有趣的策略是使用css sprites。基本理论是，不要下载多个图像，只需下载一个包含所有图像的大图像。这意味着浏览器不需要连续地请求图像文件，只需要发出一个请求。教程CSS精灵：它们是什么，为什么很酷，以及如何使用它们在这个过程中有一些很好的信息，包括如何从现有的多图像布局转换。
资源排序在订购CSS和JavaScript时，您希望您的CSS排在第一位。原因是呈现线程具有呈现页面所需的所有样式信息。如果javascript包含come first，则在继续下一组资源之前，javascript引擎必须对其进行全部分析。这意味着渲染线程无法完全显示页面，因为它没有所需的所有样式。下面是一个例子：
1 2 3 | <link rel="stylesheet" type="text/css" href="/css/global.css" /> <link rel="stylesheet" type="text/css" href="/css/forms.css" /> <script type="text/javascript" src="/js/formvalidation.js"> |
跟踪/关联脚本位置
许多网站使用跟踪和/或附属脚本。如果远程主机出现问题，并且脚本包含在
1 2 3 4 5 6 | <!-- HTML Here --> <script type="text/javascript"> var gaJsHost = (("https:" == document.location.protocol) ?"https://ssl." :"http://www."); document.write(unescape("%3Cscript src='" + gaJsHost +"google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); </body> |
遗失资产
缺少css和javascript文件意味着浏览器必须与服务器进行不必要的通信，以获取不存在的文件。根据服务器的位置和丢失的文件数量，这可能会导致页面加载速度变慢。
缩小HTML源代码、CSS源代码和JS源代码。如果可能，请选择gzip。
http://code.google.com/p/htmlcompressor网站/
对于javascript，请尝试：http://code.google.com/closure/compiler/
首先，您应该使用诸如yslow(可用的火狐和Chrome扩展)或googe page speed online之类的工具。我肯定还有其他人。这些工具将对您的站点在不同领域的性能进行分级，并提供有关如何改进它们的提示。
使用这些工具一段时间后，您将开始改变构建页面的方式，并将这些额外的步骤考虑在内。
您还可以查看JavaScript文件的异步脚本加载程序。最流行的是head.js。在谷歌上搜索会给你提供更多关于更深入技术的文章。
强制性参考。
加快网站速度的最佳实践
HTML5样板会让你远离汗液。
在头标记后使用php的flush函数
1 2 3 4 5 6 7 | <html> <head> </head> <?php flush(); ?> <body> </body> <html> |