性能基准:PHP生成的内容VS. JavaScript和DOM over AJAX [英] Performance benchmark: PHP Generated content VS. javascript and DOM over AJAX
问题描述
对于以下非常简单的任务:从数据库中查询产品列表并将其显示在网页上， 考虑2种设置:
For the following pretty straightforward task: query a list of products from a DB and present it on a webpage, consider 2 setups:
Setup1 :PHP脚本查询.所有内容都建立在服务器上，整个页面都提供给客户端.
Setup1: PHP script queries. All content is built on the server and the entire page is served back to the client.
Setup2 :使用AJAX请求内容的静态HTML页面框架".接收到的内容使用Javascript在客户端进行解析，并使用innerHTML或类似内容呈现.
Setup2: Static HTML "page skeleton" requesting content using AJAX. Received content is parsed on the client side using Javascript and rendered using innerHTML or similar.
第二种设置当然只有在您拥有可供客户用户选择的页面，类别和标签时才有意义.
Of course the second setup only makes sense when you have pages, categories and tags for the client user to choose from.
至少需要通过以下方式比较这两个:
I need to compare these two, at least by means of:
- 需要花费时间才能提供内容
- 用户体验(setup1整体交付，setup2分为两部分"交付)
- 可扩展性-每天有100,000个查询时，设置如何进行比较
任何对此问题的想法将不胜感激.
Any thoughts on the issue will be much appreciated.
推荐答案
You may find the following question helpful: Smarty Vs. Javascript/AJAX
我对这个问题的回答提出了几点:
I brought up a few points in my answer to that question:
-
您应该使用服务器端脚本来显示页面加载时已知的所有数据.在这种情况下，您知道应该显示产品列表.在页面加载时就知道应该显示问题的答案.
You should use server-side scripts to show any data that is known at the moment the page is loaded. In this case, you know the list of products should be displayed. The fact that a question's answers should be shown is known at page load.
您仅应使用AJAX调用来加载在页面加载时未知的动态数据.例如，当您单击Stack Overflow上问题或答案下的评论"链接时.您想要查看特定问题的评论的事实在页面加载时是未知的.
You should only use AJAX calls to load dynamic data that is not known at the moment the page is loaded. For example, when you click the "comments" link under a question or answer on Stack Overflow. The fact that you want to view a particular question's comments is not known at page load.
不应 使用Java脚本访问您网站的核心功能.
Javascript should not be required to access core functionality of your site.
在禁用Javascript后，您应适当降低功能.例如，在禁用Javascript的情况下，Stack Overflow可以正常工作.您无权访问Markdown实时预览或动态徽章通知，但核心功能仍然完整.
You should gracefully degrade functionality when Javascript is disabled. For example, Stack Overflow works just fine with Javascript disabled. You don't have access to real-time Markdown previews or dynamic badge notices, but the core functionality is still intact.
对服务器生成的页面的单个HTTP请求的加载速度将比对请求进行五到六个额外AJAX调用的页面的请求加载的速度明显快，尤其是在高延迟连接(例如，蜂窝网络).请参见Yahoo的 加快网站访问速度的最佳做法 ./p>
A single HTTP request to a server-generated page will load significantly faster than a request to load a page that makes five or six additional AJAX calls, especially on high latency connections (like cellular networks). See Yahoo's Best Practices for Speeding Up Your Website.
您应该将Javascript视为可能无法启用的附加功能，而不是应用于构建网站关键部分的功能.此规则有例外.如果要进行某种分页，只需单击下一页"按钮，而仅更改产品列表，则AJAX可能是正确的选择.但是，您应该确保不使用Javascript的用户不会被排除在查看整个列表之外.
You should think of Javascript as a bonus feature that might not be enabled, not as something that should be used to construct critical pieces of your website. There are exceptions to this rule. If you want to do some sort of pagination in which you click a "next page" button and only the product list changes, AJAX might be the right choice. You should, however, make sure users without Javascript are not excluded from viewing the entire list.
没有什么比无法访问页面更令人沮丧的，因为Web开发人员没有遵守友善餐厅为例.我想在购物中心购物时他们的菜单，所以我加载了他们的菜单我的iPhone上的一个网站，却发现如果没有Flash，您实际上无法获得有关餐厅的任何有意义的信息.到处都是花哨的菜单，到处都是飞扬的甜点，但是最后，我只想看看菜单上的项目.我不能这样做，因为他们需要Flash.在这种情况下，服务的正常降级将是有帮助的.
There's nothing more frustrating than when a page can't be accessed because the web developer didn't obey the KISS principle. As an example, take Friendly's Restaurants. I wanted to check out their menu while I was at the mall, so I loaded their website on my iPhone, only to find out that you literally can't get any meaningful information about the restaurant without Flash. It's nice to have fancy menus with swooshing desserts flying everywhere, but in the end, I just wanted to see the items on their menu. I couldn't do that because they required Flash. Graceful degradation in service would have been helpful in that case.
如果没有Javascript，网络上的某些事情将无法有效完成.显示产品列表不是其中之一.如果您仍然不确定，请查看其他热门网站的工作方式.我认为您会发现大多数成功且精心设计的网站都遵循上述指南.
Some things on the web can't be done effectively without Javascript. Displaying a list of products is not one of them. If you are still unsure, look at how other popular websites do things. I think you'll find most of the successful, well-engineered websites follow the guidelines listed above.
这篇关于性能基准:PHP生成的内容VS. JavaScript和DOM over AJAX的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
