如何提高AJAX应用程序的性能？

Question

我们都知道过早优化是邪恶的。优化几乎总是涉及某种权衡 - 使系统更复杂，更难理解和调试等。

过早优化意味着（我认为）“在您知道问题所在之前进行优化 - 甚至是否存在问题。”在这种情况下，你正在做出所提到的牺牲之一并得不到任何回报。因此，一个坏主意。

另一方面，我认为杰夫阿特伍德2006年的帖子“Speed Still Matters”永远适用。用户满意度与速度有很大关系。

问题

考虑到这一点，在构建AJAX应用程序时，可以使用哪些工具来识别速度瓶颈？有哪些常见的，简单的改进可以做到？

一些初步想法

我知道的一些基本想法（随意扩展这些）：

• 减少请求次数。例如，如果您可以将多个JS或CSS文件捆绑到一个，那就是一个请求。
• 发送更少的数据。较小的文件大小（缩小的JS，嘎吱作响的图像等）很有帮助。

我很好奇的一些事情：

• Google Chrome（我使用）非常快速地运行JS。我的用户可能运行较慢的浏览器。 如何最大程度地降低浏览器速度对我的应用的影响？

Answer 1

在发出更少请求静脉：

• 确保您的服务器为所有可缓存的文件发送缓存标头。
• 如果您根据用户互动提出请求，并且有可能频繁发生互动和使之前的结果无效（例如自动完成输入），使用短暂的计时器在提出要求之前;如果发生其他交互，则取消操作。

在发送较少数据静脉：

• 确保您的服务器是 gzipping内容，可以进行gzip压缩。
• 通过AJAX重新加载较小的块 HTML。 （本地化您的更改。）
• 注意你回来的回应;它是否尽可能小？发送非常大的响应时，有时 JSON不是答案。

对于处理慢速浏览器，特别是关于Web应用程序编程，您为改进快速浏览器所做的一切都有助于减慢浏览器的速度。您可以最小化＃em>仅针对较慢的浏览器的俗气动画效果，但这不属于“简单改进”的类别，即IMO。正确的答案是确定您的性能要求，必须满足这些要求的最低机器/浏览器配置，以及测试您的网站。

当您遇到速度太慢的事情时，会对您的网站进行分析。在Firebug（用于Chrome / Safari的开发人员工具）和IE8 +的开发人员工具之间，开发人员可以通过一些非常好的方法来识别基于JavaScript的减速。确定非常重的命中并重写或删除它们。

Answer 2

  

Google Chrome（我使用）非常快速地运行JS。我的用户可能运行较慢的浏览器。如何最大限度地减少慢速浏览器对我的应用程序的影响？

我们不得不在IE6上运行应用程序，这是一场噩梦。尽量记住你可以在网上抓取的一般javascript优化技巧。然后，当您的应用程序准备就绪时，抓住慢浏览器并尝试查看它的速度慢得令人无法接受。然后回到Firebug并优化瓶颈。

为了记录，我们最终推出了Firefox 3，因为IE6使我们的应用程序成为等待的噩梦（许多UI元素）。我的结论是，如果您的用户使用旧版浏览器，请先为他们设计应用程序（即不要使用太多Javascript，更基本的HTML）。

Answer 3

你提到捆绑和缩小js和css文件，因此它们较小，我认为这些文件非常重要，但我认为你不应该通过ajax请求发送过多的文件。

我认为最好有一个更大的初始加载，其中所有的css / js都被下载，然后只是发出关于数据的ajax请求（可能是json）。如果它只是JSON的一小部分，它会快得多。

同样在客户端上，您可以使代码更快。 Jquery被证明是最快的库之一，因此在有意义的地方使用它很聪明，但你需要对它进行分析。

Firebug，Firebug，Firebug。

在服务器端，Node.js（反应堆服务器）速度非常快，值得研究。