如何高效地实现客户端 JavaScript 模板部分？
我想构建自己的，但我不确定最好的方法。部分模板是另一个更大模板的一部分，可以随意插入到多个其他模板中。 模板本身是相当基本的，只是字符串提取和连接，但客户端部分让我有点困惑。
以下是我想到的几个方法：
1、 我可以编写一个 javascript 辅助函数，通过 ajax 将部分加载到某种形式的本地存储中，并且所有需要该特定部分的后续模板将首先查看本地存储。我认为这种方法不太安全，因为本地存储并不总是得到保证。如果我无法将它们保存到本地存储中，则部分会导致过多的 ajax 调用。
2，我可以将它们全部放入我的主 html 文件内的脚本标签中。这会工作得相当好，特别是使用 head.js （以启用脚本标签的并行加载），但仍然 - 我认为每个脚本标签都是对服务器的单独调用，对吧？这并不能完全改善情况。
3，我可以将所有模板放入单个脚本标签（或者我猜是html）中，并通过某种分隔符手动过滤...例如：“#template1(blabla template1 string) #template2(blablabla template2 string)并放置这些字符串进入全局变量。 这只会导致对服务器的一次调用，其余所有操作都在客户端上完成。
建议？我查看了现有的模板引擎，但我无法真正确定它们是如何做到的。代码相当复杂
I'd like to build my own, but I'm not sure about the best way to do it. A partial is a template that is only a part of another bigger template and which can be inserted into multiple other templates at will.
Templating itself is fairly basic, just string exctraction and concatenation, but clientside partials have me a little stumped.
Here are a few methods I thought about:
1,
I could write a javascript helper function that loads partials through ajax into some form of local storage I suppose, and all subsequent templates that require that particular partial would first look inside local storage. I think this method isn't very safe because local storage isn't always guaranteed. And if I can't save them into local storage, partials would result in too many ajax calls.
2, I could put them all into script tags inside my main html file. This would work reasonably well, especially with head.js (to enable parallel loading of script tags), but still - I think each script tag is a separate call to the server right? That doesn't exactly improve the situation.
3, I could put all templates into a single script tag (or html I guess) and manually filter through some kind of delimiter...like: "#template1(blabla template1 string) #template2(blablabla template2 string) and put those strings into globals.
This would result only into a single call to the server, all the rest is done on the client.
Suggestions? I have looked at existing templating engines, but I can't really determine how they do it. The code is pretty complicated
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
我为 jQuery 模板的规范/重写指定模板调用和按需加载的方法是对其进行管道化。
请参阅（早期）规范草案的第 9 节，并查看一致性套件测试 底部的自定义按需模板加载示例（测试用例“主要调用并及时加载！”是相关的）。
基本要点是插件加载器（用 JS 编写）在解析和编译之间进行挂钩以检查解析树。插件传递获取对象映射模板名称以解析树。如果他们看到任何部分模板选择器（用你的说法），他们可以尝试使用 AJAX 调用或 Node.js 上的文件 I/O 加载任何未解析的模板，并将部分添加到输入对象以使编译器编译刚刚的模板。与公共模板一起加载部分内容。
就效率而言，请参阅基准。我正在将代码迁移到 github ： https://github.com/ mikesamuel/jquery-jquery-tmpl-proposal 如果您想合作。
The approach I took to spec out template calls and on-demand loads for the spec/rewrite of jQuery templates is to pipeline it.
See section 9 of the (early) draft spec, and see the conformance suite tests at the bottom for an example of custom on-demand template loading (Testcase "Main calls and Loaded just in time!" is the relevant one).
The basic gist is that plugin loaders (written in JS) get to hook in between-parsing and compiling to inspect the parse tree. A plugin pass gets an object mapping template names to parse trees. If they see any partial template selectors (to use your parlance) they can try and load any unresolved templates using AJAX calls or file I/O on Node.js, and add the partials to the input object to cause the compiler to compile the just loaded partials along with the public templates.
Efficiency-wise, see the benchmarks. I'm in the process of migrating the code to github : https://github.com/mikesamuel/jquery-jquery-tmpl-proposal in case you want to collaborate.