Template7

优质
小牛编辑
145浏览
2023-12-01

Template7 is a mobile-first JavaScript template engine with Handlebars-like syntax.

It is ultra lightweight (around 1KB minified and gzipped) and blazing fast (up to 3 times faster than Handlebars in mobile Safari!) and it is already included in Framework7. So you don't need to include any additional scripts.

Usage & API

Сheck out Template7 Website for the most relevant guide and API. But skip the part about downloading, it is already included into Framework7.

Performance Tips

Template7 is fast and you can make it works even faster in your apps. The slowest part (but still very fast in T7) in all this compilation/rendering process is the compilation from string to pure JS function when you do Template7.compile(). So don't compile the same templates multiple times, one time will be enough:

// Initialize app
var myApp = new Framework7();
 
// Compile templates once on app load/init
var searchTemplate = $('script#search-template').html();
var compiledSearchTemplate = Template7.compile(searchTemplate);
 
var listTemplate = $('script#list-template').html();
var compiledListTemplate = Template7.compile(listTemplate);
 
// That is all, now and further just execute compiled templates with required context
myApp.onPageInit('search', function (page) {
    // Just execute compiled search template with required content:
    var html = compiledSearchTemplate({/*...some data...*/});
 
    // Do something with html...
});        

在F7之外使用 Template7

Template7 可以作为一个独立仓库使用。你需要在这里下载 Template7 GitHub repo

或者通过 bower 安装:

bower install template7