问题标签 [singlepage]

我试图弄清楚为什么在下面的 jsperf 中，javascript 字符串模板比等效的 knockout.js 模板慢得多。测试的目标是测量单页应用程序中的完整页面和部分页面更改链接。

http://jsperf.com/knockoutvjquery/6

最初我打算只测试 underscore.js 模板的速度，但现在我只是将原始硬编码字符串写入 dom。似乎当速度测试是简单的 dom 元素时，它们很快，但是一旦我进入“现实世界”的情况，淘汰赛测试就会更快。是什么赋予了？

准备代码 HTML

为所有测试定义设置

为所有测试定义拆解

测试 1 - jquery

测试 2 - 淘汰赛

我目前正在编写一个 Backbone Marionette 应用程序，该应用程序最终相当于大约 6 个不同的“屏幕”或页面，它们经常共享内容，我不确定如何最好地构建和访问区域。

我正在使用此处描述的应用程序/模块设置：StackOverflow 问题 11070408：如何使用主干和 require.js 定义/使用多个路由。这将是一个应用程序，它将随着时间的推移添加新的功能和内容，并且需要可扩展（并且显然尽可能可重用）

我正在构建的单页应用程序在每个屏幕上都有 4 个主要部分：页眉、主要内容、次要内容、页脚。

所有页面的页脚将保持一致，其中 3 个页面的页眉将相同，并在其余 3 个页面上稍作修改（使用大约 80% 的相同元素/内容）。“更多内容”区域将可在各个页面中重复使用。

在我的 app.js 文件中，我正在定义我的区域，如下所示：

现在，回到前面提到的帖子中的应用程序设置，处理区域的最佳方式是什么。我会在每个子应用程序中独立地重新声明每个区域吗？这似乎是保持模块尽可能独立的最佳方式。如果我走那条路，在子应用程序之间打开/关闭或隐藏/显示这些区域的最佳方式是什么？

或者，我是否保留 app.js 中声明的区域？如果是这样，那么我将如何最好地从子应用程序中更改和协调这些区域的事件？在 app.js 文件中定义区域似乎与将模块和核心应用程序相互了解的内容保持在最低限度有悖常理。另外，我看到的每个示例在主应用程序文件中都有 appRegions 方法。那么从子应用访问和更改这些区域的最佳实践是什么？

提前致谢！

我目前正在编写一个非常非常大的单页 web/javascript 应用程序。

我使用的技术是 ASP.NET MVC4、jquery、knockout.js 和 amplify.js。

我遇到的问题是，大多数（如果不是全部）单页应用程序示例都适用于较小的应用程序，其中所有脚本模板（无论是 jquery、handlbars 等）都与其余的都在同一个文件中的html代码。这对于较小的应用程序来说很好，但我正在构建的应用程序是一个完整的维护物流应用程序，有很多很多屏幕。

到目前为止，我采用的方法是我有一个外壳（我的主 index.cshtml 文件），并且我使用 jquery 的 load() 方法来加载或更确切地说是在用户进行特定选择时注入我需要的特定文件。

例子：

这是 App.loadModule 函数的代码：

一切都很顺利，直到我需要真正开始与新加载的屏幕上的各种表单元素进行交互。jquery 似乎无法直接处理它们。我不能使用 .live() 或 .delegate() 因为它们不是事件，它们是文本框和按钮，有时我需要更改它们的 css 类。

我发现他们唯一的方法是从外壳中获取一个元素的句柄（不是通过 .load() 加载的东西）并使用 jquery 的 .find() 方法，如下所示：

显然，每次我需要与表单元素交互甚至从表单元素中检索值时，我都不想做这样的事情。

是否有人对我如何创建一个可维护的非常大的单页应用程序有任何想法，其中可能包含数百个 .html 文件，而不必将所有 html 代码放在一个文件中，并且仍然可以解决这个 .load() 问题有？

任何想法将不胜感激。:-)

视听/视听

克里斯

更新

我想我会发布一个更新，以及事情的进展和效果。经过大量研究后，我决定使用 Google 的 AngularJS Javascript 框架。它成倍地简化了考验，我肯定会建议所有正在考虑制作大型 SPA 的人来看看。

链接：

主站 http://angularjs.org/

Angular 上很棒的免费短视频： http ://www.egghead.io/

有没有人让 Disqus 与 PJAX 甚至常规的#!AJAX 一起正常工作。

让我们看一些这样做的人的例子：

1. http://donejs.com/
2. http://www.playmodules.net/demo/1

第一个是使用 Hash bang 风格，第二个是 PJAX。现在单击这些站点，您会在 Disqus 中注意到您的 gravatar 图标消失了，如果您打开 javascript 控制台，您通常会收到错误和日志消息，因为该DISQUS对象无法解除绑定。

我已经尝试过自己的随机黑客（这很困难，因为我找不到没有通过缩小混淆的 DISQUS js）：

基本上我尝试了一堆清理技术，以便当我的 PJAX 加载新页面时它应该清理但我总是得到一些必然null引发异常的事件。

如何配置 nginx 以将所有 URL（未预先添加/api或某些静态资源，例如 JS/图像）重定向到index.html？原因是我在单页应用程序中使用 HTML5 推送状态 URL。意思是根据 URL 改变 AJAX 或 JS 的内容

我当前的 nginx 配置如下所示：

当我遇到问题时，我正在尝试使用 Upshot.js 对 SPA 进行编程。

错误：“System.Web.Mvc.HtmlHelper”不包含“元数据”的定义

我通过添加以下行解决了这个问题：

在 web.config 文件中。

但现在出现404错误。它找不到 Index.cshtml 文件。

在我添加“upshot.metadat ....”行之前，它运行良好。所以我不明白问题出在哪里。

我正在使用 jqueryMobile + 淘汰赛 + 微风 + WebAPI 编写一个简单的“todo - helloworld”，以了解移动环境中的 SPA（单页应用程序）（不可靠的互联网连接）

为了启用离线使用，WebApp 将利用

• 应用程序缓存
• 本地存储

应用程序应尽可能使用远程数据库来加载和保存数据，但应能够在离线时无缝切换到本地存储，并在重新在线时同步本地/远程更改。

现在回到问题：应用程序将使用 Breeze 的 EntityManager 来管理数据（本地缓存和远程同步）

• “远程数据库”

为了减轻不一致/并发问题，我将使用 2 个本地存储密钥：

• “localDb”用于远程数据库的本地副本（待办事项列表）
• “localPendingChanges”表示应用程序无法提交到远程数据库的更改

所以流程或多或少是（伪代码）：

您如何看待这种方法？是不是一团糟？可以吗？多用户场景下的并发问题怎么办？

我正在做一个具有 jee6 后端（仅基于 json 的 api）和大量客户端代码的应用程序。它看起来像单页应用程序（现在这个很酷的流行语）。

我不确定如何构建我的代码库。有几种方法我考虑

• 后端和前端有单独的项目——这意味着后端部分是纯 java 的，带有 maven 和所有这些东西，并且有单独的前端和所有特定于 js 的构建工具等。
• 将所有东西都放在一个项目中，这样我就可以在服务器上部署一个存档（战争），其中包含所有前端的东西。我真的不喜欢这种方法...

如果我使用第一个部署，该怎么办？我必须从这个前端部分构建另一个“战争”档案并将其放到服务器上吗？

我找不到人们使用的任何做法。

我正在开发单页应用程序样式的 Web 应用程序。我想根据用户的角色创建菜单，例如，对于管理员用户我想显示管理员菜单和 html 内容，对于一般用户我想显示不同的 html 内容。我正在使用带有 Razor 视图引擎的 asp.net mvc，所以这可以通过 Razor 代码实现，如下所示：

这是我过去以传统方式开发Web应用程序时的典型方式，但是自从我开始开发单页应用程序样式的Web应用程序以来，我尝试编写纯html代码并避免使用Razor，WebForm等服务器端视图引擎asp.net 或 Velocity，Java EE 中的 Jsp 标记库。我想写更独立的前端代码，不依赖服务器代码。

无论如何，当我使用javascript和knockoutjs而不是Razor时，上面的代码可以更改如下，

isAdmin、isGeneralUser 和 isOtherUser 是 viewmodel 的属性，这些值将通过检查用户角色的 ajax 调用设置。

我想知道的是，从安全的角度来看，这种根据用户角色控制内容的方式是否合适？

如果这些视图因用户角色而异，您如何处理视图内容？想问问大家遇到这种情况是怎么处理的。

可能重复：
在使用 Backbone.js pushstate 进行 seo/书签时重用服务器上的主干视图/路由

我正在使用Backbone.js和一堆其他模块来处理单页应用程序方法。我的目标：

1. 该网站必须是 SEO 友好的

2. 服务器将 html 代码引导到客户端和存储在 JSON 模型中的数据。

3. 子序列操作全部由 Javascript 处理（例如渲染新屏幕，使用 Backbone 路由器更改 url）。

我的问题是：如何构建服务器以与每个路由器 url 上的 Javascript 保持一致并保持干燥？

例如：如果用户去wwww.mysite.com然后点击某个链接去www.mysite.com/page/2，它必须和他www.mysite.com/page/2在第一次加载时直接去一样。

这似乎是一个老话题，但我找不到任何关于在服务器端处理此问题的最佳方法的可靠资源，而无需在 Javascript 中重复模板代码。

我正在考虑的一个选择是将后端拆分为 Node.js 和另一台服务器以仅处理 API。Node.js 服务器以某种方式共享模板构造代码作为 Javascript 前端

无论如何，如果这不是提出此类问题的正确地方，我很乐意听到一些建议和道歉。