动态 HTML 页面的 PHP 与 JavaScript

PHP vs JavaScript For Dynamic HTML Pages

提问by Eric

Typically when I put together dynamically generated HTML markup, I've been using PHP to store the information and then looping through that to create elements on the page. One example is navigation; create an array of objects and then loop through them to echo the markup. This helps out a lot for times that I might have to make minor (or major) changes during development or maintenance.

通常，当我将动态生成的 HTML 标记放在一起时，我一直使用 PHP 来存储信息，然后循环遍历这些信息以在页面上创建元素。一个例子是导航；创建一个对象数组，然后循环遍历它们以响应标记。这对我在开发或维护期间可能需要进行小（或大）更改的时候很有帮助。

Lately I've been wondering if I should use JavaScript to do this instead. Same principle, but using addElement.

最近我一直在想是否应该使用 JavaScript 来代替。原理相同，但使用 addElement。

Just wanted to get some opinions on this; pros, cons, php vs js, seo considerations, etc.

只是想就此获得一些意见；优点、缺点、php vs js、seo 考虑等。

Thanks folks!

谢谢各位！

回答by Quentin

Doing it client side means:

做客户端意味着：

1. Doing it in lots of different environments instead of a single one
2. Having it break whenever a user comes along without JS (for whatever reason)
3. Having it fail to work for the vast majority of bots (including search engines)
4. Investing development time in converting all your logic
5. Requiring the browser to make additional requests to the server, slowing down load times

1. 在许多不同的环境中而不是在一个环境中进行
2. 每当用户在没有 JS 的情况下出现时，它就会中断（无论出于何种原因）
3. 让它无法适用于绝大多数机器人（包括搜索引擎）
4. 投入开发时间来转换所有逻辑
5. 要求浏览器向服务器发出额外请求，从而减慢加载时间

When deciding if you should do something client side instead of server side, as a rule of thumb ask yourself two questions:

在决定是否应该在客户端而不是服务器端做某事时，根据经验，问自己两个问题：

1. Would the user benefit from getting instant feedback in response to them doing something? e.g. An error message for improper data in a form they are trying to submit. If so, then doing it client side would be beneficial.
2. Can it be done server side? If so, do it server side first as it is more reliable (and for non-cosmetic things, harder to interfere with). Build on things that work.

1. 用户会从他们做某事时获得即时反馈中受益吗？例如，他们试图提交的表单中不正确数据的错误消息。如果是这样，那么在客户端执行此操作将是有益的。
2. 服务器端可以做吗？如果是这样，首先在服务器端进行，因为它更可靠（对于非装饰性的东西，更难干扰）。建立在有用的东西上。

回答by El Yobo

It's not an either one or the other type of situation; generally you will need to do both.

这不是一种或另一种情况；通常，您需要同时执行这两项操作。

Doing it client side will probably be slower, as the server still needs to figure out all the data but the client needs to render it; this will involve multiple requests (most likely) and DOM manipulation is slow (especially on older browsers).

在客户端执行它可能会更慢，因为服务器仍然需要找出所有数据但客户端需要呈现它；这将涉及多个请求（最有可能）并且 DOM 操作很慢（尤其是在旧浏览器上）。

回答by Charlie Tran

Best practice would be to produce any necessary markup on the server side. Reasons for this include:

最佳实践是在服务器端生成任何必要的标记。原因包括：

SEO:Most crawler bots won't parse Javascript, so they'll skip over anything crucial that you're generating with addElement.

SEO：大多数爬虫机器人不会解析 Javascript，因此它们会跳过您使用 addElement 生成的任何重要内容。

Accessibility:Your site should basically functional without Javascript. Consider people who might be browsing your site on Kindles, older Blackberries, Nokias or other feature phones with data. They don't need all the fancy styles and effects, but they should at least be able to get around your site.

可访问性：您的网站应该基本上可以在没有 Javascript 的情况下运行。考虑一下可能在 Kindle、旧版黑莓、诺基亚或其他有数据功能的手机上浏览您网站的人。他们不需要所有花哨的样式和效果，但他们至少应该能够绕过您的网站。

Consistency:JS can add yet another level of cross-browser variability. Why rely on client-side rendering of necessary markup? Do it server-side.

一致性：JS 可以添加另一个级别的跨浏览器可变性。为什么要依赖客户端渲染必要的标记？在服务器端做。

Of course, this advice can be taken in stride if you're developing an all-JS desktop app or using something like the Sencha Touchframework.

当然，如果您正在开发一个全 JS 桌面应用程序或使用类似Sencha Touch框架的东西，则可以从容地采纳这个建议。

回答by Denis de Bernardy

If SEO is your concern, things are simple: JS is not indexed.

如果您关心 SEO，事情很简单：JS 未编入索引。

There also are UI issues: if JS is not enabled, no JS-dependent stuff will load.

还有 UI 问题：如果未启用 JS，则不会加载依赖于 JS 的内容。

回答by ygosteli

One possibility would be to detect what kind of user is viewing your site :

一种可能性是检测哪种用户正在查看您的网站：

• If it's a bot: parse on the server-side, you may just output what is needed by the bot, without graphical things,...

• If it's a mobile : show a mobile optimized version, using something like Sencha Touch, as Charlie pointed out

• If it's a standard browser, without javascript : render the page on the server side

• If it's a standard browser, with javascript enables : just send the data from server side (or load it with Ajax) and render the data from the client-side

• 如果它是一个机器人：在服务器端解析，你可能只输出机器人需要的东西，没有图形的东西，......

• 如果是移动设备：正如查理指出的那样，使用 Sencha Touch 之类的东西显示移动优化版本

• 如果是标准浏览器，没有 javascript ：在服务器端呈现页面

• 如果它是标准浏览器，启用 javascript：只需从服务器端发送数据（或使用 Ajax 加载它）并从客户端呈现数据

You may use something like Mustache, wich is a template engine running on many server-side languages (PHP, Ruby, Java,... but also on Javascript, enabling client-side page rendering!

您可以使用Mustache 之类的东西，它是一个在许多服务器端语言（PHP、Ruby、Java 等）上运行的模板引擎，但也可以在 Javascript 上运行，从而启用客户端页面渲染！

And try to use a Javascript framework like jQuery, Mootools, Dojoor ExtJS, they will help you to write code that will run on every browser.

并尝试使用jQuery、Mootools、Dojo或ExtJS等 Javascript 框架，它们将帮助您编写可在每个浏览器上运行的代码。

回答by Gort

PHP is good for some things, including Handlebars type templating, and fast server-side content replacement. But it is also not great for some things, like single page applications and games, real-time updates to websites. Those things are where JavaScript is strong.

PHP 在某些方面很有用，包括 Handlebars 类型模板和快速的服务器端内容替换。但它也不适用于某些事情，例如单页应用程序和游戏、网站的实时更新。这些是 JavaScript 强大的地方。