Hello 2019! Hanjst/漢吉斯特 模板語言及引擎創新發布

Hello 2019! Hanjst/漢吉斯特 模板語言及引擎創新發布。

值此一元復始之際,恭祝 朋友們新年萬事如意!
寄望 Hanjst/漢吉斯特能幫助大家從各種模板中解脫出來,爲人類做出更大的貢獻。

1. 背景

網頁模板語言/引擎緣起於 MVC 思想的引入。當軟件項目膨脹複雜到足夠大時,軟件研發人員與UI/UE設計人員就需要分別獨立出來,其中設計製作人員工作的V(View)部分需要用模板語言與引擎。

模板語言及引擎的設計與研發工作是一項既簡單又複雜的工作。簡單地說,模板就是一種變量替換的工作,在模板中預留相應的佔位符和變量標記,模板引擎在工作時在相應的佔位符將對應的變量替換爲實際對應的數值即可。

複雜地說,模板語言是一種全新表達語言的設計,設計一門語言,其難度是可想而知的,這門語言要能夠滿足日常溝通之需要,首先或入門的是語言設計者要考慮的,是該模板語言能夠普遍接受和廣泛使用,這樣語言纔有生命力。無疑,簡潔而表意豐富是重要而優先的考慮項。

先行者已經在模板領域創制出大量符合各種需求的模板語言與模板引擎,這裏是一個簡單的歸集 -R/U2SJ , 爲了更好的梳理其發展類別,我們繪製了一個 Mind map:

TemplateLanguage_Engine_forWeb.201812.png

Fig1. 網頁模板語言分類概括

2. 問題討論

如在Fig1中所展示的,模板語言及引擎有很多種類,每個分類下面又有不同的應用實例,可謂多姿多彩,琳琅滿目。實際上,在網絡上搜索一下可能會發現,網頁模板語言和引擎多到不勝枚舉,連JSP、PHP這樣的開發語言都可以歸類爲某種模板語言的範圍。

通過腦圖的分析,我們發現在這一領域還有兩個問題沒有得到解決,或者沒有得到很好的解決:1)服務器端,有沒有一種模板語言與引擎可以實現跨開發語言的? 2)客戶端/瀏覽器終端,有沒有一種模板語言與引擎能夠不需要Script tags的?

針對第一個問題,我們搜索了多次,發現的確有針對不同開發語言而設計的模板語言與引擎,多數只是針對某幾種主流語言開發了模板編譯引擎,只是做到“準跨開發語言”,另外就是,這些看似高級的模板語言與引擎,大多數都是私有軟件,非開源,需要購買獲取授權才能使用。

至於第二個問題,Script tags,一般的定義是這樣的,如果我們在客戶端使用JavaScript來寫一個模板,通常都需要先聲明一段區塊頭部,然後完事之後再聲明一下區塊尾部,這個區塊的頭尾部使用Script tags來實現的,如下:

<script id="template" type="x-tmpl-mustache">
Hello {{ name }}!
</script>

這是令人不悅的,爲何要表述一句 “Hello {{name}}”, 無辜地多寫了第一行和第三行,不能省掉嗎?

令人無可忍受地還有其他的,
3)logicless 。如果一種模板語言無法表達邏輯,這是什麼邏輯?
4){{name}}。爲何必需用兩個“{{” ,而不是一個“{”?
5)<#list>. 爲何要用 “<#” , 能再簡潔易懂些嗎?

tencent-template-201901.jpg
Fig2 騰訊理財通客戶端等JavaScript模版

從 Fig2 中我們可以看到這些令人不滿意等地方,函數等調用 | f2y | n2t 借用了命令行管道等意思,如果有參數呢?能否寫成:

f2y(n2t(IMonthProfit)) 
or
IMonthProfit.n2t().f2y()

通過Fig2 我們還發現 模版語言,尤其是 JavaScript 模版語言在App上應用等依然存在,模版等使用並沒有隨着Web向App轉換而減少。

於是,懷着這些不滿意,我們設想滿足以下需要來設計一套新的模板語言與引擎:

A)跨開發語言,與服務器開發語言不做綁定,同時開源,免費使用;
B)去掉 Scripts tags;
C)基於JavaScript提供,同時與服務器端一致強大而複雜的表達、表示能力。

如能滿足以上,我們在繼續研製 -GWA2 / -吉娃兔 的道路上,有望一通各個開發語言的模板引擎,而不是在開發 Java 版本的 GWA2時 選擇 Velocity, 在 開發 PHP 版本的 GWA2 時選擇 -Smarty 等問題。

以語言學家的視角來設計這套模板語言與引擎,
以工程師的思維來實現語法、語義的程序化表達,
這就是 Hanjst 模板語言及引擎。

3. Hanjst, 漢吉斯特 模板語言及引擎

Hanjst是一種基於JavaScript的模板語言及解析引擎,她可以運行在客戶端,也可以運行在服務器端。

Hanjst能夠表述邏輯控制,能夠實現與服務器端模塊語言相同的功能。

特徵/功能
Hanjst運行在客戶端時完全客戶端解析,節省服務器端計算資源;

Hanjst模板語言獨立,不與服務器端開發語言做任何綁定;

純粹的MVC,層間數據用JSON格式傳遞;

常見模板語言功能全支持,附帶複雜而強大的JavaScript編程能力;

無學習成本,直接使用JavaScript書寫模板語言;

開源的,免費使用;
….

Han 是我妻子的姓(韓), 也是出現我女兒和兒子名字中的音節。Han 也是中文“漢族”的意思。

Hanjst 模板語言及引擎設計用來終止在HTML模板語言領域不斷地“再造輪子”的活動,儘管這聽起來有些怪異。

Hanjst 的語法與基於 PHP 的Smarty語言有相似的地方,原因是我們借鑑了 Smarty的一些設計,之所以如此,是我們贊同 Smarty 在語言精煉方面精益求精的探索( -R/x12SU )。

Note that the PHP syntax uses 5 punctuation characters to display a
simple variable: <?=?>, whereas Smarty uses 2: {}.

Hanjst 依託JavaScript內部對象及函數的功能,賦予了在模板中直接調用這些功能的能力,實現了媲美服務端模板語言一致的表示、表達能力。如表達截短一個字符串:

{$myString.substring(0, 10)} 


4. 發展規劃及設想

Hanjst 模板語言及引擎已發佈在 -GitHub 上,地址爲: https://github.com/wadelau/Ha...

Hanjst 模板語言及引擎的樣例展示地址, -Hanjst , -R/j2SP 。 現在就可以點開嚐鮮。

Hanjst 模板語言及引擎的參考手冊在編輯中,不日將在線發佈。

Table of Contents

I. What is Hanjst?
1.
Hanjst Installation
2.
Basic Settings
II. Hanjst for Template Designers
3.
Syntax and Semantic
4.
Variables
5.
Modifiers on Variables
6.
Built-in Functions
7.
Warnings and Errors
III. Hanjst Template for Programmers
8.
JSON Data
9.
Includes
10.
Compile and Cache
IV. Search Engine Optimization
11.
HTML Head Element
12.
Plain Content Div Element
13.
Robot-oriented Links
V. Advanced Applications for Hanjst
14.
Embedded in HTML Elements

5. 不足及改進工作

目前已知的不足之一是在客戶端運行編譯模板文件時,對搜索引擎不夠友好。

針對這一問題,我們提供了優化HTML head, 曝露 Hanjstjsondata 等方式進行補充。

其他的,請大家試用並反饋。

2019年元旦,Hanjst/漢吉斯特 正式對外公佈。

-R/U2SK

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章