handlebar.js和handlebar.runtime.js有什么区别？
handlebar.js和handlebar.runtime.js有什么区别？
提问于 2013-10-03 05:30:02
我发现handlebar.runtime.js没有compile方法。所以我下载了不正确的版本，只使用模板引擎。
但是handlebar.runtime.js是用来做什么的呢？
如果Download: runtime-1.0.0在下载页面上变得更不引人注目会更好？
回答 1
Stack Overflow用户
回答已采纳
发布于 2013-10-03 05:49:46
Handlebar使用的标签看起来像{{this}}，浏览器本身无法理解这些标签。为了使浏览器呈现这些标记，必须对它们进行编译。编译可以在加载页面之前或之后进行。
为了加快速度，您可以预编译模板。更多信息请访问handlebars site。如果这样做，您只需要在页面上包含handlebars运行时脚本。它比完整的handlebars脚本更小，因为它不需要担心编译模板。它假定您已经预编译了它们。
当一个模板被编译时，它被转换成一个函数，当被调用时，它将返回真正的HTML，其中大括号标记已经被转换为浏览器能理解的值。
例如，这个..。
<div class="entry">
<h1>{{title}}</h1>
<div class="body">
{{body}}
</div>
</div>...will预编译后转换为以下格式(截至2014年6月)：
(function() {
var template = Handlebars.template, templates = Handlebars.templates = Handlebars.templates || {};
templates['test.hbs'] = template({"compiler":[5,">= 2.0.0"],"main":function(depth0,helpers,partials,data) {
var helper, functionType="function", escapeExpression=this.escapeExpression;
return "<div class=\"entry\">\n <h1>"
+ escapeExpression(((helper = helpers.title || (depth0 && depth0.title)),(typeof helper === functionType ? helper.call(depth0, {"name":"title","hash":{},"data":data}) : helper)))
+ "</h1>\n <div class=\"body\">\n "
+ escapeExpression(((helper = helpers.body || (depth0 && depth0.body)),(typeof helper === functionType ? helper.call(depth0, {"name":"body","hash":{},"data":data}) : helper)))
+ "\n </div>\n</div>\n";
},"useData":true});
})();这里重要的一点是，在某些情况下，handlebars模板必须转换成这个函数，这样才能生成真正的HTML。handlebars运行时脚本不包含编译器，因此使其更小。而且，通过预编译模板，JavaScript在呈现页面之前要经历的步骤就少了很多。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/19147161
复制相关文章
相似问题