В последнее время мой рабочий контент постепенно приближается к моей идеализации (веб-фронт), поэтому я уделяю больше внимания передовой производительности! Коллега в фоновом режиме представил использование шаблона Ajax для улучшения скорости рендеринга!
Вот несколько шаблонных двигателей JavaScript
1. Усы
Шаблонный механизм, основанный на JavaScript, аналогично плагину Microsoft JQUERY шаблона, но проще и проще в использовании!
2. Dot.js
dot.js содержит механизм шаблона JavaScript для браузеров и Node.js.
3. JSMART
JSMART - это портативная версия знаменитого шаблона PHP Smarty.
4. dom.js
Dom.js - это механизм шаблона JavaScript, который можно использовать как на клиенте, так и на стороне сервера.
5. Джейд
Jade-это высокопроизводительный шаблонный двигатель для узлов под влиянием HAML в JavaScript.
6. Hogan.js
Двигатель шаблона JavaScript из Twitter.
7. руль
Руль - это библиотека шаблонов страницы Javascript
8. ArtTemplate
Arttemplate - это новое поколение шаблон -двигателя JavaScript. Его эффективность рендеринга в V8 может быть близка к пределу производительности JavaScript. В тесте на эффективность рендеринга под Chrome он в 25 и 32 раза больше, чем у хорошо известных усов двигателей и Micro TMPL соответственно. Двигатель поддерживает отладку. Если во время рендеринга встречается ошибка, отладчик может точно найти оператор шаблона, который создает исключение, решая проблему, что передние шаблоны трудно отладить.
Уникальный инструмент компиляции шаблонов может собирать передние шаблоны в файлы JS, которые не полагаются на механизм шаблона для запуска, позволяя передовым шаблонам прорывать ограничения браузера и реализовать организацию файлов и каталогов одинаково, как и шаблоны на основе, нагрузка на спрос, включает гнездование и т. Д. Все это выполняется в 2KB (GZIP)!
Может быть, вы подумаете, что название этого плагина выглядит знакомым, это верно! Это также автор Artdialog.
Адрес блога: http://www.planeart.cn/
Цитата двигателя
Кода -копия выглядит следующим образом:
<script src = "js/template.js"> </script>
Напишите шаблон
Кода -копия выглядит следующим образом:
<script id = "test" type = "text/html">
// Используйте тег скрипта с типом = "Text/HTML" для хранения шаблона:
<h1> <%= title%> </h1>
<ul>
<%
для (i = 0; i <list.length; i ++) {%>
<li> iteml <%= i+1%>: <%= list [i]%> </li>
<%}%>
</ul>
// Символы определения для начала и конец синтаксиса логики шаблона составляют < % и %>. Если <% сопровождается = знак, то переменное содержимое будет выводиться.
</script>
Шаблон рендеринга
Кода -копия выглядит следующим образом:
var data = {
Название: 'Tag',
Список: [«Литературный», «Блог», «Фотография», «Фильм», «Народ», «Путешествие», «Гитара»]
};
var html = template.render ("test", data);
document.getElementById ('content'). innerHtml = html;