JavaScript: Handlebars

При использовании шаблонизатора Handlebars самая "дорогая" операция - компилирование шаблона Handlebars.compile(). Используя gulp мы можем прекомпилировать шаблоны заранее и использовать "облегченную" версию библиотеки Handlebars - handlebars.runtime.

Каждый шаблон хранится в отдельном файле:

• dist/templates исходники шаблонов
• www/js/templates скомпилированные шаблоны

Для того, чтобы загрузить шаблон hello нужно выполнить код:

require(['templates/hello'], function(template) {
	console.log(template({
		name: 'Pavlikov'
	}));
});

Если в проекте будут использованы helper'ы, то они все должны быть расположены в файле dist/js/helpers.js, например так:

(function (root, factory) {
    if (typeof define === 'function' && define.amd) {
        define(['handlebars'], factory);
    } else {
        factory(root.Handlebars);
    }
}(this, function (Handlebars) {
	Handlebars.registerHelper('mr', function(text) {
		return 'mr. ' + text;
	});

	Handlebars.registerHelper('mrs', function(text) {
		return 'mrs. ' + text;
	});

	return Handlebars;
}));

В таком случае, если шаблон использует helper'ы, они должны быть добавлены в зависимость:

require(['templates/hello', 'helpers'], function(template) {
	console.log(template({
		name: 'Pavlikov'
	}));
});