開源HTML5APP開發神器CanTK

CanTK是一套基於HTML5 Canvas的GUI系統，它提供了完整的控制元件庫，事件分發系統，視窗管理系統和不同的平臺的適配。CanTK是為解決HTML5 App開發的兩個基本難題而生的：

開發真正Native體驗的APP

HTML的基因是文件，它的長處是呈現內容，而不是與使用者互動，所以不管怎麼努力，都很難開發出與Native媲美的應用。即使拿目前最優秀的HTML5 Mobile Framework(如Sencha touch和KendoUI）開發出來的App來看: 與網頁相比，它們確實像APP，但是與真正的APP相比，它們又更像網頁。這就是目前HTML5 APP最尷尬的地方。

HTML難以勝任APP開發的主要原因有：

HTML的基因是文件，文件內容微小的改變都會導致介面重排，而使用者操作過程有反饋是現代APP最基本的要求，這些反饋都導致介面需要不斷重排，消耗大量的CPU時間，所以HTML APP有了效能不佳的名聲。

HTML本身並沒有視窗管理機制，通常都是通過載入不同的頁面來模擬不同的視窗。由於頁面載入本身需要時間，HTML5 APP介面切換時通常都要啟用等待動畫，這也極大的影響了使用者體驗。

HTML控制元件本身的侷限讓模擬Native效果變得非常困難，HTML只提供了最基本的控制元件，雖然可以通過CSS來模擬一些控制元件，但是和原生GUI庫相比那就差得太遠了。

HTML5用來開發APP本身也是很困難的。很多外行都會說HTML不是很簡單嗎? HTML是很簡單！但是用它開發APP卻是很難的，否則Sencha touch這些庫就不可能賣這麼貴了。

上面有些原因可以通過工具或庫來解決，有些原因則完全無法解決的。HTML5的出現確實為HTML APP帶來了轉機，因為HTML5 Canvas元素為開發者帶來了巨大的靈活性，但是大部分廠商都是在CSS上是動腦子，所以幾年之後HTML5 APP仍然不死不活。

CanTK則是完全放棄CSS和HTML控制元件，在HTML5 Canvas元素上實現的一套完整的GUI系統。雖然CanTK不是第一個在Canvas上做控制元件的，但是CanTK卻是目前唯一一個完整的GUI系統。

為HTML5遊戲引擎提供UI支援

任何一個遊戲玩家都知道，遊戲場景是隻是遊戲的一部分，稍微的複雜一點的遊戲都有其它介面，比如設定，裝備和商店等等。仔細觀察這些介面， 我們會發現它們除了皮膚外，與普通APP的介面沒有太大不同。HTML5遊戲引擎都是基於HTML5 Canvas實現的，它們的優勢是挖掘硬體圖形渲染潛力（拼的就是速度），而GUI控制元件方面幾乎都很弱。HTML控制元件表現力不佳，而且很難與HTML5 Canvas無縫整合，這讓HTML5遊戲開發者不得不花大量時間去做遊戲介面。

CanTK解放了HTML5遊戲開發者在UI的工作，讓他們專注於遊戲本身的開發。CanTK為目前流行的HTML5遊戲引擎做了適配，其中包括cocos2d-html5, egret, pixi.js, panda.js和phaser.js，以後還會增加其它遊戲引擎的支援。

CanTK的特色：

• 完全開放原始碼給公司和個人免費使用(Under LGPL 2.0)。
• 完整的GUI系統滿足APP開發的需要。
• 開發真正的Native-Like的應用程式。
• 比傳統HTML5 APP更好的效能和體驗。
• 無縫整合到HTML5各種遊戲引擎。
• 超強擴充套件性，可以實現任何你想要的控制元件。
• 提供視覺化開發工具，線上開發HTML5 APP和遊戲。
• 根據Layout引數自動適配不同解析度和密度的螢幕。
• 用JSON取代HTML和CSS，全部介面資料放到一個壓縮的JSON檔案，一次載入全部介面(資料很少，30個視窗小於40K)，介面切換瞬間完成。
• 支援各種Mobile平臺，測試過的平臺包括iOS, android, windows phone, firefox, blackberry和tizen。

文章轉載自 開源中國社群 [http://www.oschina.net]