Handlebars.js ist eine Template-Engine für JavaScript. Sie ermöglicht dem Entwickler, mit Hilfe von semantischen Templates Business-Logik und HTML zu trennen. Somit ist es nicht von Nöten, HTML-Code per JavaScript zu generieren. Ein großer Vorteil hierbei ist die Übersichtlichkeit durch das Auslagern des JavaScript- und Handlebars-Codes in eigene .js-Dateien. Die durch Handlebars geschaffene Struktur sorgt für einen verständlichen Code und erleichtert somit die Wartbarkeit.
Ein weiterer Vorteil ist es, dass Templates nicht bei jeder erneuten Verwendung neu kompiliert werden müssen. Gerade in der mobilen Nutzung ist dies ein essentieller Performance-Gewinn.
Wann empfiehlt es sich, Handlebars.js zu verwenden?
Es empfiehlt sich, Handlebars zu verwenden, wenn Seiteninhalte während eines Aufrufes öfters aktualisiert werden (z.B. durch Filterung oder Sortierung), denn hierbei müssen die DOM-Elemente nicht jedesmal im JavaScript-Code neu generiert und eingehängt werden, sondern es werden nur entsprechende Templates gerendert. Würde man all dies von JavaScript aus steuern, müsste man jedes DOM-Element z.B. per createElement()-Methode erstellen und per appendChild()-Methode oder innerHTML-Property einzeln erstellen und einhängen.
Man sollte jedoch die Notwendigkeit einer solchen Library überprüfen, denn bei einfachen Webseiten ohne viel Logik würde Handlebars zu viel Overhead produzieren.
Anwendung
Handlebars bietet neben dem Verwenden von Platzhaltern verschiedene Helper-Functions an, wie zum Beispiel if-Abfragen, foreach-Schleifen und Block Parameters. Um Handlebars anzusprechen, werden jegliche Statements und Variablen in doppelt geschweiften Klammern geschrieben. Der Zugriff auf Funktionen erfolgt jeweils mit einem „#“ und endet mit einem „/“ vor der Anweisung.
Im folgenden Code wird geprüft, ob die Property „items“ des JSON-Objekts „news“ Einträge enthält. Ist dies der Fall wird das entsprechende Template „news-table-template“ an dieser Stelle aufgerufen. Als Parameter wird dem Template das „news“-Objekt mit übergeben.