Heim > Artikel > Web-Frontend > Eine einfache HTML-Vorlagen-Engine
Zu den zuvor verwendeten Vorlagen
gehören ejs und jade (später umbenannt in pug). Ersteres ist so konzipiert, dass es einfach zu verwenden ist, und seine Syntax kommt der von HTML relativ nahe. Letzteres ist entmutigend, und wenn ich mich richtig erinnere, gelten für jade strenge Anforderungen an die Einrückung, da es die hierarchische Beziehung von Tags anhand der Einrückung beurteilt. Das Schreiben in Python war fast unmöglich auf dünnem Eis (wo ist mein Messschieber???), daher habe ich damals noch ejs für die Entwicklung verwendet.
Dieses Mal habe ich mich also grob an die Syntaxspezifikationen von ejs gehalten, um Leopard zu implementieren.
Dies ist die Github-Adresse, nachdem Sie sie gelesen haben auch willkommen.
Sie können Leopard auch über npm herunterladen:
<span style="font-size: 14px;">$ npm install leopard-template<br></span>
Derzeit implementiert Leopard die folgenden Funktionspunkte:
Interpolation: einschließlich Textinterpolation und HTML-Interpolation
Logisches Urteil: <code><span style="font-size: 14px;">if</span>
if und <span style="font-size: 14px;">else</span>
<span style="font-size: 14px;">for</span>
Schleife: for
<span style="font-size: 14px;">capitalize</span>
Filter: Unterstützt das Hinzufügen von Filtern zur Interpolation, und Filter können in Reihe verwendet werden. Die Engine verfügt über zwei integrierte Filter: <code><span style="font-size: 14px;">reverse</span>
capitalize und reverse<code><span style="font-size: 14px;">Leopard.filter(filter, handler)</span>
. Leopard unterstützt auch benutzerdefinierte Filter. Sie können Leopard.filter(filter, handler) verwenden, um einen Filter global zu registrieren. In Bezug auf Filter unterscheidet sich Leopard
<span style="font-size: 14px;">var Leopard = require('leopard-template')<br>var leo = new Leopard()<br><br>var template = '<% if (isOk) { %>' +<br> '<span class=\"nickname\"><%= nickname | capitalize %></span>' +<br> '<% } else { %>' +<br> '<span class=\"realname\"><%= realname | capitalize %></span>' +<br> '<% } %>'<br><br>var html = leo.compile(conditions, {<br> isOk: false,<br> nickname: 'leo',<br> realname: 'leopard'<br>})<br><br>// html就是最终编译成功的的html了,可以直接通过document的方法渲染到页面上<br></span>
Leistung
<span style="font-size: 14px;">li</span>
Eigentlich kennt jeder die Leistung der String-Template-Engine. Unter den aktuellen Hardwarebedingungen kann man fast sagen, dass sie sehr schnell ist. (Das Kind, das unter der schlechten Renderleistung des virtuellen DOM-Servers litt, weinte und fiel auf der Toilette in Ohnmacht. Mein Firmenprojekt bleibt hier hängen und kann nicht online sein) Ich habe einen einfachen Benchmark erstellt Das Durchschleifen von 50.000 <em>li</em>
dauert etwa 60 ms. Natürlich unterstützt
<span style="font-size: 14px;"># benchmark<br>$ npm run benchmark<br></span>derzeit nur das Parsen und Kompilieren von
Open SourceObwohl es sich um ein Radherstellungsprojekt handelt und es fast genauso aussieht wie
ejs<span style="font-size: 14px;"># unit test<br>$ npm run test<br><br># coverage<br>$ npm run coverage<br></span>Das Gleiche gilt, daher ist es unwahrscheinlich, dass es in einer Produktionsumgebung zum Einsatz kommt (außerdem wird jetzt das MVVM-Framework zum Entwickeln von Projekten verwendet), aber ich hoffe immer noch,
Leopard
gemäß den Spezifikationen zu entwickeln von Open-Source-Projekten. Ich habe Testfälle mit 100 % Abdeckung fürNode.js Template Engine Jade Beispielerklärung
php implementiert die Template Engine-Funktion Einfaches BeispielPHP-Designmuster-Container-Bereitstellungsframework basierend auf der Template-EngineDas obige ist der detaillierte Inhalt vonEine einfache HTML-Vorlagen-Engine. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!