缓存Ajax结果
Ajax经常被提及的一个好处就是由于其从后台服务器传输信息的异步性而为用户带来的反馈的即时性。但是，使用Ajax并不能保证用户不会在等待异步的JavaScript和XML响应上花费时间。在很多应用中，用户是否需要等待响应取决于Ajax如何来使用。例如，在一个基于Web的Email客户端中，用户必须等待Ajax返回符合他们条件的邮件查询结果。记住一点，“异步”并不异味着“即时”，这很重要。
为了提高性能，优化Ajax响应是很重要的。提高Ajxa性能的措施中最重要的方法就是使响应具有可缓存性，具体的讨论可以查看Add an Expires or a Cache-Control Header。其它的几条规则也同样适用于Ajax：
Gizp压缩文件
减少DNS查找次数
精简JavaScript
避免跳转
配置ETags
让我们来看一个例子：一个Web2.0的Email客户端会使用Ajax来自动完成对用户地址薄的下载。如果用户在上次使用过Email web应用程序后没有对地址薄作任何的修改，而且Ajax响应通过Expire或者Cacke-Control头来实现缓存，那么就可以直接从上一次的缓存中读取地址薄了。必须告知浏览器是使用缓存中的地址薄还是发送一个新的请求。这可以通过为读取地址薄的Ajax URL增加一个含有上次编辑时间的时间戳来实现，例如，&t=11900241612等。如果地址薄在上次下载后没有被编辑过，时间戳就不变，则从浏览器的缓存中加载从而减少了一次HTTP请求过程。如果用户修改过地址薄，时间戳就会用来确定新的URL和缓存响应并不匹配，浏览器就会重要请求更新地址薄。
即使你的Ajxa响应是动态生成的，哪怕它只适用于一个用户，那么它也应该被缓存起来。这样做可以使你的Web2.0应用程序更加快捷。
尽早打开缓冲
当用户请求一个页面时，无论如何都会花费200到500毫秒用于后台组织HTML文件。在这期间，浏览器会一直空闲等待数据返回。在PHP中，你可以使用flush()方法，它允许你把已经编译的好的部分HTML响应文件先发送给浏览器，这时浏览器就会可以下载文件中的内容（脚本等）而后台同时处理剩余的HTML页面。这样做的效果会在后台烦恼或者前台较空闲时更加明显。
输出缓冲应用最好的一个地方就是紧跟在<head />之后，因为HTML的头部分容易生成而且头部往往包含CSS和JavaScript文件，这样浏览器就可以在后台编译剩余HTML的同时并行下载它们。 例子：
… <!– css, js –>
</head>
<?php flush(); ?>
<body>
… <!– content –>
为了证明使用这项技术的好处，Yahoo!搜索率先研究并完成了用户测试。
使用Get方法发送Ajax请求
Yahoo! Mail团队发现在使用XMLHttpRequest的时候，POST在浏览器中的实现分两步执行：先发送头，然后发送数据。所以最好使用GET，这种方式仅仅发送一个TCP包（除非你有一大堆cookie要发送）。IE中最大的URL长度是2K，所以如果你要发送超过2K的数据，你不能使用GET。
一个有趣的情况是POST像GET那样不发送任何数据。按照HTTP specs的规定，GET的意思是获取信息，所以当你仅仅需要请求数据的时候使用GET是有意义的（符合语义），反之，当你需要把数据存储在服务器端的时候，就应该使用POST。
post-load Component
你可以看一看你的页面，问问自己：“哪些元素是渲染页面必须的？”其他部分都可以稍候再下载。
Javascript是一个理想的候选者用来分割onload事件之前和之后。例如你有一个Javascript代码或库用来实现拖放和动画，这些可以延迟下载，因为拖动元素发生在页面渲染完成以后。其他可以延迟下载的包括隐藏内容（在用户进行某些操作以后显示）和一开始不显示的图片。
YUI Image Loader能够帮助你做到延迟非必须图片的下载，YUI Get utility是一个用来引入JS和CSS的方便工具。你可以用Firebug的Net面板看看打开Yahoo! Home Page
的情况。
确保优化目标能和其他良好的web开发实践相结合。在这种情况下，Javascript用来在客户端支持的时候改善用户体验，但你得确保如果不支持JS，你的页面还能正常工作。因此在确保你的页面工作良好的情况下，你可以用JS逐步地强化它如拖放和动画。
预加载组件
一个复杂的页面意味着需要下载更多数据，同时也意味着JavaScript遍历DOM的效率越慢。比如当你增加一个事件句柄时在500和5000个DOM元素中循环效果肯定是不一样的。
大量的DOM元素的存在意味着页面中有可以不用移除内容只需要替换元素标签就可以精简的部分。你在页面布局中使用表格了吗？你有没有仅仅为了布局而引入更多的<div>元素呢？也许会存在一个适合或者在语意是更贴切的标签可以供你使用。
YUI CSS utilities可以给你的布局带来巨大帮助：grids.css可以帮你实现整体布局，font.css和reset.css可以帮助你移除浏览器默认格式。它提供了一个重新审视你页面中标签的机会，比如只有在语意上有意义时才使用<div>，而不是因为它具有换行效果才使用它。
DOM元素数量很容易计算出来，只需要在Firebug的控制台内输入：
document.getElementsByTagName(’*').length
那么多少个DOM元素算是多呢？这可以对照有很好标记使用的类似页面。比如Yahoo!主页是一个内容非常多的页面，但是它只使用了700个元素（HTML标签）。
减少DOM元素的数量
一个复杂的页面意味着需要下载更多数据，同时也意味着JavaScript遍历DOM的效率越慢。比如当你增加一个事件句柄时在500和5000个DOM元素中循环效果肯定是不一样的。
大量的DOM元素的存在意味着页面中有可以不用移除内容只需要替换元素标签就可以精简的部分。你在页面布局中使用表格了吗？你有没有仅仅为了布局而引入更多的<div>元素呢？也许会存在一个适合或者在语意是更贴切的标签可以供你使用。
YUI CSS utilities可以给你的布局带来巨大帮助：grids.css可以帮你实现整体布局，font.css和reset.css可以帮助你移除浏览器默认格式。它提供了一个重新审视你页面中标签的机会，比如只有在语意上有意义时才使用<div>，而不是因为它具有换行效果才使用它。
DOM元素数量很容易计算出来，只需要在Firebug的控制台内输入：
document.getElementsByTagName(’*').length
那么多少个DOM元素算是多呢？这可以对照有很好标记使用的类似页面。比如Yahoo!主页是一个内容非常多的页面，但是它只使用了700个元素（HTML标签）。
使用多个域名下载资源
分割资源允许你最大化平行下载的效果。但要确保在2-4个域名之间因为会有DNS查询代价。
举例，你可以把你的HTML和动态资源放在www.example.org上，把其他静态的资源放在static1.example.org和static2.example.org上。
减少iframe的使用
iframes允许一个html文档插入到当前文档中。为了有效地使用它必须理解iframe的利弊。
好处：
显示第三方内容如广告
安全的沙箱
并行下载脚本
坏处：
即使是一个空的iframe也会耗费资源
阻止页面的onload事件
无语义