带有 Express 模板或纯 HTML 的 AngularJS？优点和缺点？答案

【问题标题】：AngularJS with Express Templates or pure HTML? Pros and Cons?带有 Express 模板或纯 HTML 的 AngularJS？优点和缺点？
【发布时间】：2013-12-14 05:07:28
【问题描述】：

Express JS 使用模板生成 HTML，然后服务器将它们发送给客户端作为响应。可能还有其他几个可以从中生成 HTML 的模板。我能够发现的是：

玉(http://jade-lang.com/)
EJS (http://embeddedjs.com/)

在我的应用程序中，我需要同时使用 ExpressJS 和 AngularJs。我对这两种技术都很陌生。在学习 Angular 时，我不得不在纯 HTML 中使用它。在学习了ExpressJs之后，我意识到，要使用angularjs，我需要在上述任何一个模板中使用它们，这些模板将在发送到客户端时转换为HTML。

现在，我想使用 expressjs 作为我的服务器，使用 angularjs 作为我的客户端应用程序。为此，我认为我有两个选择。

选项 1

我可以完全停止使用模板并使用我们的 NodeJS 服务器通过发送简单的 HTML 文件来响应。这些 HTML 文件将在其中包含 AngularJS 编码。然后，AngularJS 在客户端将充当我们的应用程序。它将要求服务器提供其他 HTML 文档。或者它也可以像 AJAX 一样使用，我们只能请求一条信息来更新页面的一部分，而不是刷新整个页面以进行微小的更改。

选项 2

我可以在 expressjs 模板（jade 或 ejs）中使用 angularjs。

请帮助我了解这两种选择的优缺点。在这种情况下，您将选择哪一个。

【问题讨论】：

你也可以编写html模板并使用express.static()提供服务
为什么不在前端和后端都使用选项二和模板。您可以控制是否搞砸应用程序

标签： node.js angularjs express pug ejs

【解决方案1】：

这是一个非常有意见的问题，Stack Overflow 管理员讨厌任何带有意见的东西，但这是我的经验和意见。

我已经完成了几个使用纯静态文件（HTML、CSS 和 JavaScript）的应用程序，这些应用程序在后端调用服务来传递数据。它将后端（无论它是什么（我使用过 Java 和 Node.js））减少为只是一组服务 URL，但它工作得非常好。

您在两个系统
独立处理和测试每一项都非常容易
Bug 通常在前端或后端（所有你要做的就是看看传输的数据就知道了）
后端服务已准备好被重用，以支持来自如果需要，可以使用命令行或特定于移动设备的东西
您可以从后端开始使用一种技术（例如 Node.js 或 Ruby on Rails），然后在需要时切换到其他技术。只要 API 保持不变，前端就永远不会知道。

【讨论】：

这种方法的更多好处： 1. 静态 html 页面可以通过 CDN 提供，并且更容易被浏览器缓存。 2. 通过先加载静态页面，然后从服务器获取数据完成动态部分，页面可以开始加载比您先从数据库获取数据并在发送到客户端之前使用它构建整个页面要快得多。跨度>
好一个 CodeToad！缓存是一个很好的好处，我们现在正在努力。我们正在尝试在我们的 JavaScript 中放置 expires 标头，这将允许它们被缓存长达一年，并设置一种机制，允许我们在需要时破坏该缓存。它应该可以实现非常快速的页面加载。我应该列出来的。
我承认提供静态 html 并异步加载内容（使用角度）呈现比服务器端更快。但是只是想……如果页面某些部分的某些菜单受到授权（访问权限）怎么办？角度可以很好地处理吗？而且它可以在完全加载之前轻弹，不是很好的用户体验吗？
@aheryan 我发现最好假设用户没有权限开始（因此默认为关闭）。因此，零件可能会在我们发现他们有权执行时出现，而不是在我们发现他们无法执行时消失。
@aheryan 你绝对可以拥有多个页面，每个页面都是它自己的 ng-app。我们必须在现有应用程序中这样做，因为我们正在逐渐替换一些恐怖表演代码，这些代码是 JSP 和数百行嵌入的 JavaScript 和 jQuery 代码。当我们替换一个页面时，每个页面都是它自己的 AngularJS 应用程序，在单个路由器上具有一个视图或几个视图。但是在像 Google 的收件箱这样的情况下，它是一个真正的 SPA，您可以下载一次数据，将其保存在服务中（跨路由持续存在），而不必在访问每条路由及其相应视图时继续进行 API 调用。

【解决方案2】：

我个人将 AngularJS 与 Express/Jade 一起使用。设置实际上非常简单，我发现编写 Jade 比编写 HTML 更有趣。我还采用了在 CoffeeScript 中编写 Angular 代码，因为它再次加快了开发速度。如果您希望节省击键，那么 Jade 是一个很好的解决方案，它与 Express 的集成让它变得轻而易举。如果您不担心更快地生成代码，那么使用 HTML 绝对没有问题。

我会指出，我发现使用 Jade over HTML 的最大好处之一是能够在多个文件中开发单个页面，然后使用 include 在编译成 HTML 之前将它们连接起来。这使您可以获取更大的页面并将它们分成更易于管理的块。与 Angular 的模板一起，这可以减轻很多挫败感。

真的，这完全是见仁见智，但自从我决定试一试 Jade，我并没有后悔，我也从未遇到过使用 Angular 时我的 HTML 渲染不正确的情况。

【讨论】：

【解决方案3】：

我选择了选项 1，因为我不想处理任何可能的问题，因为我不想处理 jam 或 ejs 错误地转换模板并干扰 Angular 的问题。我的应用程序本质上具有索引页面（实际上只是包含我的 css 和 js 的基本页面模板）从 Express 中作为翡翠出来，然后 Angular 将它带到那里，我所有的 Angular 模板都位于与我的翡翠模板不同的位置.

【讨论】：