"\u003cp\u003e本文将探讨浏览器渲染的loading过程，主要有2个目的：\u003c/p\u003e\n\u003cul\u003e\n\u003cli\u003e了解浏览器在loading过程中的实现细节，具体都做了什么\u003c/li\u003e\n\u003cli\u003e研究如何根据浏览器的实现原理进行优化，提升页面响应速度\u003c/li\u003e\n\u003c/ul\u003e\n\u003cp\u003e由于loading和parsing是相互交织、错综复杂的，这里面有大量的知识点，为了避免过于发散本文将不会对每个细节都深入研究，而是将重点放在开发中容易控制的部分（Web前端和Web Server），同时由于浏览器种类繁多且不同版本间差距很大，本文将侧重一些较新的浏览器特性\u003c/p\u003e\n\u003ch2 id=\"现有知识\"\u003e现有知识\u003c/h2\u003e\n\u003cp\u003e提升页面性能方面已经有很多前人的优秀经验了，如\u003ca href=\"http://developer.yahoo.com/performance/rules.html\"\u003eBest Practices for Speeding Up Your Web Site\u003c/a\u003e和\u003ca href=\"http://code.google.com/speed/page-speed/docs/rules_intro.html\"\u003eWeb Performance Best Practices\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e本文主要专注其中加载部分的优化，总结起来主要有以下几点：\u003c/p\u003e\n\u003cul\u003e\n\u003cli\u003e带宽\u003c/li\u003e\n\u003cli\u003e使用CDN\u003c/li\u003e\n\u003cli\u003e压缩js、css，图片优化\u003c/li\u003e\n\u003cli\u003eHTTP优化\u003c/li\u003e\n\u003cli\u003e减少转向\u003c/li\u003e\n\u003cli\u003e减少请求数\u003c/li\u003e\n\u003cli\u003e缓存\u003c/li\u003e\n\u003cli\u003e尽早Flush\u003c/li\u003e\n\u003cli\u003e使用gzip\u003c/li\u003e\n\u003cli\u003e减少cookie\u003c/li\u003e\n\u003cli\u003e使用GET\u003c/li\u003e\n\u003cli\u003eDNS优化\u003c/li\u003e\n\u003cli\u003e减少域名解析时间\u003c/li\u003e\n\u003cli\u003e增多域名提高并发\u003c/li\u003e\n\u003cli\u003eJavaScript\u003c/li\u003e\n\u003cli\u003e放页面底部\u003c/li\u003e\n\u003cli\u003edefer/async\u003c/li\u003e\n\u003cli\u003eCSS\u003c/li\u003e\n\u003cli\u003e放页面头部\u003c/li\u003e\n\u003cli\u003e避 …\u003c/li\u003e\u003c/ul\u003e"

"\u003cp\u003e针对搜索引擎优化（SEO），页面URL的布局与呈现是影响排名和网站索引率的重要因素之一。对于搜索引擎而言，URL是它们找到一个网页的入口，URL的好坏会直接影响搜索引擎对一个网站的索引及理解程度。对于用户，URL会直接显示在搜索结果中，从而影响人们的点击意愿。因此一个好的URL结构无论是对搜索引擎，还是用户，都有着非常重要的作用。在本文中，我们将详细探讨针对SEO的URL优化技巧，但同时也想提醒大家，对于一个现有的网站，URL的改动需要谨慎。URL的改动会牵扯到原有URL权重的转移等问题，因此除非在万不得已的情况下，尽量不要改动现有的URL。但如果你是在策划一个新的网站或者生成新的页面，那么就让我们来探讨一下如何得到一个完美的URL吧。\n\u003cstrong\u003e1. URL愈短愈好\u003c/strong\u003e\n无论是搜索引擎，还是浏览者，都喜欢简短的URL。URL的层级不宜过多，尽量控制在4级之内。虽然搜索引擎仍然会抓取四级之后的页面，但页面的权重会大大降低。\u003c/p\u003e\n\u003cp\u003e例如华为中文网站的“移动宽带”（ \u003ca href=\"http://www.huawei.com/cn/core\"\u003ehttp://www.huawei.com/cn/core\u003c/a\u003e_network/internet_mobility\n_solutions.do ）页 …\u003c/p\u003e"

"\u003cp\u003e在 [Yahoo][1] \u003cstrong\u003e开 发者\u003c/strong\u003e网站上，Yahoo 提出了 \u003ca href=\"http://developer.yahoo.com/performance/rules.html\"\u003e优 化网站性能的N条规则(Best Practices for Speeding Up Your Web Site)\u003c/a\u003e。这些规则是：\u003c/p\u003e\n\u003col\u003e\n\u003cli\u003e\n\u003cp\u003e尽可能的减少 HTTP 的请求数(Minimize HTTP Requests) ——　Tag: content\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e使用 CDN(Use a Content Delivery Network) ——　Tag: server\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e添加 Expires 头(或者 Cache-control ) (Add an Expires or a Cache-Control Header) ——　Tag: server\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003eGzip 组件(Gzip Components) ——　Tag: server\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e将 CSS 样式放在页面的上方 (Put Stylesheets at the Top) ——　Tag: css\u003c/p\u003e\n\u003c/li\u003e\n\u003cli\u003e\n\u003cp\u003e将脚本移动到底部（包括内联的）(Put Scripts at the Bottom) ——　Tag: javascript\u003c/p\u003e"

"\u003cp\u003e\u003ca href=\"http://blog.prosight.me/index.php/2009/08/313\"\u003e使用ETag和Expires调优web 服务器性能\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e正确使用Etag和Expires标识处理，可以使得页面更加有效被Cache。\u003c/p\u003e\n\u003cp\u003e在客户端通过浏览器发出第一次请求某一个URL时，根据 HTTP 协议的规定，浏览器会向服务器传送报头(Http Request Header)，服务器端响应同时记录相关属性标记(Http Reponse Header)，服务器端的返回状态会是200，格式类似如下：\u003c/p\u003e\n\u003col\u003e\n\u003cli\u003e\u003c/li\u003e\n\u003c/ol\u003e\n\u003cp\u003eHTTP/1.1 200 OK\u003c/p\u003e\n\u003cp\u003eDate: Tue, 03 Mar 2009 04:58:40 GMT\u003c/p\u003e\n\u003cp\u003eContent-Type: image/jpeg\u003c/p\u003e\n\u003cp\u003eContent-Length: 83185\u003c/p\u003e\n\u003cp\u003eLast-Modified: Tue, 24 Feb 2009 08:01:04 GMT\u003c/p\u003e\n\u003cp\u003eCache-Control: max-age=2592000\u003c/p\u003e\n\u003cp\u003eExpires: Thu, 02 Apr 2009 05:14:08 GMT\u003c/p\u003e\n\u003cp\u003eEtag: “5d8c72a5edda8d6a:3239″\u003c/p\u003e\n\u003cp\u003e客户端第二次请求此URL时，根据 HTTP 协议的规定，浏览器会向服务器传送报头(Http Request …\u003c/p\u003e"

"\u003cp\u003e各种不同的域名地址对于搜索引擎的除重(deduplication)来说是一个负担，有没有”/”和首页的文件连接，一个域名首页就可以有6个地址：\u003c/p\u003e\n\u003cp\u003e\u003ca href=\"https://www.haohtml.com/\"\u003ewww.haohtml.com/\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003ehaohtml.com/\u003c/p\u003e\n\u003cp\u003e\u003ca href=\"https://www.haohtml.com\"\u003ewww.haohtml.com\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003ehaohtml.com\u003c/p\u003e\n\u003cp\u003e\u003ca href=\"https://www.haohtml.com/index.php\"\u003ewww.haohtml.com/index.php\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003ehaohtml.com/index.php\u003c/p\u003e\n\u003cp\u003e如果加上一些参数，比如用于来源跟踪等还会有更多无穷无尽的地址。\u003c/p\u003e\n\u003cp\u003e\u003ca href=\"https://www.haohtml.com/?source=foobar\"\u003ewww.haohtml.com/?source=foobar\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e所以搜索引擎鼓励发布者 \u003ca href=\"http://www.googlechinawebmaster.com/2007/11/seourl.html\"\u003e把URL标准化\u003c/a\u003e（归一化）。首先就是域名的归一化，原先我的设置为： \u003ca href=\"https://www.haohtml.com\"\u003ewww.haohtml.com\u003c/a\u003e / haohtml.com为别名。现在改为haohtml.com 301转向到www.haohtml.com\u003c/p\u003e\n\u003cp\u003eServerName haohtml.com\u003c/p\u003e\n\u003cp\u003eRewriteEngine on\u003c/p\u003e\n\u003cp\u003eRewriteRule ^(.*)$ \u003ca href=\"http://www.haohtml.com\"\u003ehttp://www.haohtml.com\u003c/a\u003e$1 [R=301,L]\u003c/p\u003e\n\u003cp\u003e如果没有mod_rewrite也可以设置mod_alias：\u003c/p\u003e\n\u003cp\u003eRedirectMatch 301 …\u003c/p\u003e"