性能基准：PHP生成的内容VS。JavaScript和DOM over AJAX

Question

对于以下非常简单的任务： 从数据库查询产品列表并将其显示在网页上，请 考虑2种设置：

Setup1 ：PHP脚本查询。所有内容都建立在服务器上，并且整个页面都返回给客户端。

Setup2
：使用AJAX请求内容的静态HTML“页面框架”。接收到的内容使用Javascript在客户端进行解析，并使用innerHTML或类似内容呈现。

当然，只有当您有可供客户选择的页面，类别和标签时，第二种设置才有意义。

我需要至少通过以下方式 比较 这两个：

• 内容需要花费的时间
• 用户体验（setup1整体交付，setup2分为“两部分”交付）
• 可扩展性-每天有100,000个查询时，设置如何进行比较

任何对此问题的想法将不胜感激。

Answer 1

在回答这个问题时，我提出了几点：

• 您应该使用服务器端脚本来显示页面加载时已知的所有数据 。在这种情况下，您知道应该显示产品列表。应该在页面加载时显示问题答案的事实。

• 您只应使用AJAX调用来加载 页面加载时尚 不 知道的动态数据。例如，当您单击Stack Overflow上一个问题或答案下的“评论”链接时。您想查看特定问题的评论的事实在页面加载时是未知的。

• JavaScript的应该 不 要求你的网站的访问核心功能。

• 禁用Javascript后，应适当降低功能 。例如，在禁用Javascript的情况下，Stack Overflow可以正常工作。您无权访问Markdown实时预览或动态徽标通知，但核心功能仍然完整。

• 到服务器生成的页面的单个HTTP请求的加载速度将比加载进行五个或六个其他AJAX调用的页面的请求的加载速度快得多 ，尤其是在高延迟连接（例如蜂窝网络）上。请参阅Yahoo 加速网站 的 最佳做法 。

您应该将Javascript视为可能无法启用的附加功能，而不是应用于构建网站关键部分的功能。此规则有例外。如果要进行某种分页，单击“下一页”按钮，而只更改产品列表，则AJAX可能是正确的选择。但是，您应该确保不使用Javascript的用户不会被排除在查看整个列表之外。

没有什么比无法访问页面时更令人沮丧的了，因为Web开发人员没有遵守
KISS原则
。例如，以Friendly’s
Restaurants
为例。我想在购物中心时查看他们的菜单，所以我在iPhone上加载了他们的网站，却发现如果没有Flash，您实际上无法获得有关餐厅的任何有意义的信息。到处都是花哨的菜单，到处都是飞扬的甜点，但是最后，我只想看看菜单上的项目。我不能这样做，因为他们需要Flash。在这种情况下，服务的平稳降级将是有帮助的。

没有Java脚本，网络上的某些事情将无法有效完成。显示产品列表 不是
其中之一。如果您仍然不确定，请查看其他热门网站的工作方式。我认为您会发现大多数成功且设计精良的网站都遵循上述指南。