個人プロジェクトXのコード書いてたら副産物としてテンプレートエンジンがある程度仕上がった

f:id:rokujyouhitoma:20170528222128j:plain

にゃーん。これはねこの飼い主との思い出が詰まった投稿。

なお、画像は知人の飼い猫で、使用許可取ってない。

経緯

2011年11月にtornado.templateJavaScriptに移植した。
使えはするけど、細かい機能まで作りきれてなかった。

ちょうど、今回の個人プロジェクトXで、

  • JavaScriptで書かれた
  • テンプレートエンジン

が必要になったので、メンテして使えるようにした。

前提の個人プロジェクトX

詳細は割愛。テンプレートエンジンに関して記載すると、

- X自体は外部のコード使いたくなかったので、巷で流行ってる?vanilla js。
- Closure Compilerは採用。

テンプレートエンジン

ざっくりと整理。

こんな感じで使える。

var loader = new DictLoader({
    "base.html": '<title>{% block title %}default title{% end %}</title>\n' +
	'<body>{% block body %}default body{% end %}</body>',
    "page.html": '{% extends "base.html" %}' +
        '{% block title %}page title{% end %}' +
        '{% block body %}page body{% end %}'
});
loader.load('page.html').generate();

https://github.com/rokujyouhitoma/horse-racing-game/blob/master/src/js/lib/template_test.js (将来リンク切れになってもしらね)

既知の不具合、問題点

  • 一部でテンプレートエンジン内部コードを構築するの面倒だったのでeval使ってる。
  • テンプレート構文が部分的にバグってる。具体的には{{this}}でブラウザだとglobalオブジェクトにアクセスできちゃったり{{XXX}}で任意のオブジェクトにアクセスできてしまう。また自由な構文(内部的にはStatementBlockで評価するだけ)を許可してしまっている。

私感

  • 個人的に使う限りは困らないところまではできた。
  • Closure Compiler最高。
  • Pythonのwith構文相当を関数で提供は大したコードではなかったけど、面白かった。
  • 個人プロジェクトXではこんなだいそれたコードは複雑度が増すし要らなかったんや!実際に削減できたコード?そんなの数十行だけだ!!増えたコード??2000行近くだ!!満足感はある。後悔はしていない(ただし個人プロジェクトだから!、業務だったら...)。
  • にゃーん