AngularJS网站：单个SPA与多个SPA应用/组件

这个问题困扰了我一段时间了

如果您正在使用Angular构建一个具有多种功能的网站，那么最好是构建一个大型SPA，还是将网站分解为功能性“应用程序”，并为每个应用程序构建SPA

例如，我们有一个社交媒体网站，其中包含通知提要、用户配置文件、报告和组。您会将所有这些功能构建到一个SPA中，还是构建4个不同的SPA，让后端框架路由到正确的SPA

e、 g

www.mywebsite.foo#/profile/12345/education

vs

www.mywebsite.foo/profile/12345#/education

---

我个人更赞成后一种方法，因为它减少了应用程序的大小，但在应用程序之间导航时确实需要重新加载页面。

马克·柯林斯在你的文章中谈到了一件事：

“3.结构至关重要……”

他建议在开始工作之前计划好每一页

然后，我相信，你会发现什么是满足你特定需求的最佳方法

---

我更喜欢隔离在小型服务中，因为我不认为使用require.js或类似方法在复杂的负载层次结构中共享少量javascript有什么好处。

因此，以下是我学到的和我做的：

我的服务器有一个默认路由：

  var express = require('express');
  var router = express.Router();

  ... 

  router.get('*', function(req, res) {
    res.sendfile(path.resolve(__dirname + '/../../../build/index.html')); // Send index.html for HTML5Mode
  });

  return router;

所以，我可以在我的网站上有多个SPA，因为我只是为它们发送不同的html模板。HTML5风格的应用程序将需要选择一个如上所述的默认应用程序

什么属于一个水疗中心

用户体验中相互关联的所有状态。在应用程序之间共享状态（例如身份验证）将变得复杂。当然，它们都可以访问服务器的完整状态

什么时候有用

如果您有清晰显示不同用例的模型，例如两种不同登录的用户。或者他们登录的两个不同的“地方”

能得到什么

• 如果你的“仪表板”应用程序加载了一堆图形代码，但你的“登录页”应用程序不需要它，那么你可以为最终用户提供更好的体验
• 如果用户体验不同，那么在不同的地方存储不同的代码更容易管理
• 在我的例子中，在服务器上呈现“登录页”模板也有SEO的好处

---

在你尝试之前，你可能不知道你真正需要什么。因此，我建议收集所有依赖于登录到同一应用程序的内容。默认的应用程序应该包括“匿名访客”体验。

i我认为唯一的spa是可行的方法。唯一棘手的方面是，如果你使用HTML5模式，机器人索引是正确的