"\u003cp\u003e准备写一系列关于高性能WEB开发的日记，主要是跟前端技术相关的(html,http,js,css等)，将自己了解的一些知识做1个总结和记录并分享，希\u003c/p\u003e\n\u003cp\u003e望大家能喜欢，也喜欢自己能坚持写下去。当然因个人技术水平有限，写作能力更是非常差，所以如果有什么地方写得不好的，请大家都指点指点。\u003c/p\u003e\n\u003cp\u003e1、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/01/29/web_performance_server.html\" title=\"HTTP服务器\"\u003eHTTP服务器\u003c/a\u003e.\u003c/p\u003e\n\u003cp\u003e2、\u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/04/28/web_performance_tools.html\" title=\"性能测试工具推荐\"\u003e性能测试工具推荐\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e3、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/02/22/web_performance_image.html\"\u003e图片篇.\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e4、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/04/08/web_performance_js_where.html\" title=\"如何加载JS，JS应该放在什么位置\"\u003e如何加载JS，JS应该放在什么位置\u003c/a\u003e.\u003c/p\u003e\n\u003cp\u003e5、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/04/18/reduce_number_of_request.html\" title=\"为什么要减少请求数，如何减少请求数.\"\u003e为什么要减少请求数，如何减少请求数.\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e6、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/04/26/web_performance_reduce_weight.html\" title=\"高性能WEB开发(5) - 减少请求，响应的数据量.\"\u003e减少请求，响应的数据量.\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e7、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/05/04/js_css_merge_compress_cache.html\"\u003eJS、CSS的合并、压缩、缓存管理\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e8、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/05/10/web_performance_repaint_relow.html\"\u003e页面呈现、重绘、回流。\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e9、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/05/12/best_use_google_analytics.html\"\u003e该如何加载google-analytics(或其他第三方)的JS.\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e10、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/05/16/html_compressor.html\"\u003e疯狂的HTML压缩\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e11、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/05/19/flush_chunk_encoding.html\"\u003eflush让页面分块,逐步呈现\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e12、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/06/07/efficient_css.html\"\u003e了解CSS的查找匹配原理，让CSS更简洁、高效\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e[作者]：BearRui(AK-47)\u003c/p\u003e"

"\u003cp\u003eDynaTrace AJAX是一个运行在IE浏览器下的免费页面性能分析工具，它可以支持主流的IE6、IE7、IE8浏览器。这款工具正是DynaTrace为进入前端性能分析领域而发布的。您可以利用它来分析页面渲染时间、DOM方法执行时间，甚至可以看到JS代码的解析时间。连JQuery的创始者 John Resig 也鼎力推荐了一把。\u003c/p\u003e\n\u003cp\u003e从John Resig的 \u003ca href=\"http://ejohn.org/blog/deep-tracing-of-internet-explorer/\"\u003eDeep Tracing of Internet Explorer\u003c/a\u003e 了解到了这款刚发布的免费的前端性能分析工具，John Resig对其评价甚高,John Resig对其评价到：“我一般不随便写关于性能分析工具的东西，坦率地说，我感觉它们绝大部分都比较烂，根本不能提供任何有价值的信息和分析结果。不过 dynaTrac提供了一些我以前在任何其他工具上都没见过的东西。”\u003c/p\u003e\n\u003cp\u003eAjax的本事真不是盖的！那么，它到底有啥特别之处呢？“这个工具可以跟踪JavaScript从执行开始，经过本地的XMLHttpRequest、发送网络请求，再到请求返回的全过程。”\u003c/p\u003e\n\u003cp\u003e\u003cstrong\u003e更多的我这里就不多说了，权威人士们都说过了，这东西我也刚上手没多久，还谈不上有多深入的 …\u003c/strong\u003e\u003c/p\u003e"

"\u003cp\u003e在BlogJava里写了一些关于高性能WEB开发的随笔，因为都是跟前端技术相关(html,http,js,css等)，所以也贴到博客园来，吸收下人气。\u003c/p\u003e\n\u003cp\u003e1、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/01/29/web_performance_server.html\" title=\"HTTP服务器\"\u003eHTTP服务器\u003c/a\u003e.\u003c/p\u003e\n\u003cp\u003e2、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/04/28/web_performance_tools.html\" title=\"性能测试工具推荐\"\u003e性能测试工具推荐\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e3、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/02/22/web_performance_image.html\"\u003e图片篇.\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e4、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/04/08/web_performance_js_where.html\" title=\"如何加载JS，JS应该放在什么位置\"\u003e如何加载JS，JS应该放在什么位置\u003c/a\u003e.\u003c/p\u003e\n\u003cp\u003e5、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/04/18/reduce_number_of_request.html\" title=\"为什么要减少请求数，如何减少请求数.\"\u003e为什么要减少请求数，如何减少请求数.\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e6、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/04/26/web_performance_reduce_weight.html\" title=\"高性能WEB开发(5) - 减少请求，响应的数据量.\"\u003e减少请求，响应的数据量.\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e7、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/05/04/js_css_merge_compress_cache.html\"\u003eJS、CSS的合并、压缩、缓存管理\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e8、 \u003ca href=\"http://www.blogjava.net/BearRui/archive/2010/05/10/web_performance_repaint_relow.html\"\u003e页面呈现、重绘、回流。\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e9、 \u003ca href=\"http://www.cnblogs.com/BearsTaR/archive/2010/05/12/best_use_google_analytics.html\"\u003e该如何加载google-analytics(或其他第三方)的JS.\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e10、 \u003ca href=\"http://www.cnblogs.com/BearsTaR/archive/2010/05/17/html_compressor.html\"\u003e疯狂的HTML压缩.\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e11、 \u003ca href=\"http://www.cnblogs.com/BearsTaR/archive/2010/05/19/flush_chunk_encoding.html\"\u003eflush让页面分块,逐步呈现\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e12、 \u003ca href=\"http://www.cnblogs.com/BearsTaR/archive/2010/06/07/efficient_css.html\"\u003e了解CSS的查找匹配原理，让CSS更简洁、高效\u003c/a\u003e\u003c/p\u003e\n\u003cp\u003e[作者]：BearRui(AK-47)\u003c/p\u003e"

"\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"