性能基准:PHP生成的内容VS. AJAX上的javascript和DOM

对于以下相当简单的任务:从数据库查询产品列表并将其显示在网页上,请 考虑2个设置:

Setup1:PHP脚本查询.所有内容都构建在服务器上,整个页面都会返回给客户端.

Setup2:使用AJAX请求内容的静态HTML"页面框架".使用Javascript在客户端解析接收的内容,并使用innerHTML或类似方法呈现.

当然,只有当您拥有供客户端用户选择的页面,类别和标签时,第二个设置才有意义.

我需要比较这两者,至少通过以下方式:

它需要时间才能提供内容

用户体验(setup1作为一个整体提供,setup2以"两个部分"提供)

可扩展性 - 当我每天有100,000个查询时,设置如何比较

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

您可能会发现以下问题有用:Smarty Vs. 的JavaScript/AJAX

我在回答这个问题时提出了几点意见:

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

您应该只使用AJAX调用来加载动态数据不能在页面加载的时刻知道.例如,当您单击Stack Overflow上的问题或答案下的"评论"链接时.在页面加载时,您不想知道要查看特定问题的注释的事实.

JavaScript的应该不要求访问您的网站的核心功能.

禁用Javascript时,您应该优雅地降级功能.例如,Stack Overflow在禁用Javascript时工作正常.您无权访问实时Markdown预览或动态徽章通知,但核心功能仍然完好无损.

对服务器生成的页面的单个HTTP请求的加载速度明显快于加载页面的请求,该页面会生成五到六个额外的AJAX调用,尤其是在高延迟连接(如蜂窝网络)上.请参阅雅虎加速网站的最佳实践.

您应该将Javascript视为可能未启用的奖励功能,而不是应该用于构建网站关键部分的内容.这条规则有例外.如果你想做某种分页,你点击"下一页"按钮,只有产品列表发生变化,AJAX可能是正确的选择.但是,您应确保不会将没有Javascript的用户排除在查看整个列表之外.

没有什么比无法访问页面更令人沮丧的了,因为Web开发人员不遵守KISS原则.举个例子,选择Friendly's Restaurants.当我在商场时,我想查看他们的菜单,所以我将他们的网站加载到我的iPhone上,结果发现你确实无法获得有关没有Flash的餐厅的任何有意义的信息.很高兴有花哨的菜单,到处都是飞舞的甜点,但最后,我只是想看看菜单上的物品.我不能这样做,因为他们需要Flash.在这种情况下,服务的优雅降级会有所帮助.

没有Javascript,网络上的某些内容无法有效完成.显示产品列表不是其中之一.如果您仍然不确定,请查看其他热门网站如何做事.我想你会发现大多数成功的,精心设计的网站都遵循上面列出的指导方针.