是否有必要在require.js中有多个html文件?

时间:2012-11-21 05:19:57

标签: backbone.js webview requirejs

我使用backbone.js和require.js创建了一个简单的应用程序。之前我曾经只有一个index.html文件,用于动态呈现/隐藏不同的视图。现在使用require.js,我仍然有index.html文件,但我已经为应用程序中的每个视图创建了单独的html文件,并将它们全部放在模板文件夹中。重点是,这四个html文件没有<!DOCTYPE html></html>标签,只有视图的<div>标签。

我不确定这是使用require.js执行此操作的正确方法。我应该将所有html代码集成到一个index.html中并使用<script>标记进行模板化吗?

2 个答案:

答案 0 :(得分:1)

...取决于

大多数情况下,我会将它们分开,因为它更有组织,更容易维护,但是...如果你有太多它们(让我们称之为“Tiles”)它会使你的网站变慢,因为你将做几个服务器绘制网站的旅行,我已经读到某个地方,当浏览器必须同时发出超过4个请求HTTP时,你会因为性能较慢而受到惩罚,我会尝试找到源并发布到这里。 / p>

如果您的图块总是在一起,我认为将所有内容放在一个HTML中就可以了,所以您可以使用单个HTTP请求获取所有这些内容,但不好的是当您更新单个模板时客户端所有模板的缓存都会变成地狱。

另一种解决方案是将它们放在单独的文件中,以便它们更有条理,并使用构建工具创建一个用于生产的大型缩小模板文件,但这需要一些工作。

所以你必须找到适合你网站的最佳方式。

P.S:你在使用模板机制吗?在这种情况下,我发现它们真的很有用。

答案 1 :(得分:1)

您不应该将模板放在一个大的html文件中, require.jsBackbone.js是完美的组合,以便在高度灵活的模块中包含所有内容,仅在必要时加载

只有几个模块你可能没有注意到它们的优势,但相信我,如果你编写更复杂,动态增长的高速Web应用程序,你可以节省大量的调试和重构,并且你的代码阅读起来非常简单并修改。

您可以通过多种方式使用Backbone,e.x处理模板。如果您将模板加载到this.$el.html( _.template(template, this.model.toJSON() ))变量中,则template

它不会影响速度,模板只有几千字节。与您的页面可能已经加载了十几个文件(许多图标,一些图像,css-es,js-es)甚至没有BB.jsRequire.js和模块的事实相比,新的一些-kilobyte-big文件不会是显而易见的。此外,如果使用Require.js加载模板,则可以在首次加载后缓存模板。