AMD and CMD are dead之KMDjs在JS工程化的努力

【當耐特】發表於2014-07-03

總覽

kmdjs釋出了最接近最終版本的0.0.4版本https://github.com/kmdjs/kmdjs,你已經完全可以在專案中使用。我已經無法用語言形容其完美程度。借用我發的微博:

68d92ef5jw1ehyh20msfdj20hs0dw77y 

模組管理

kmdjs僅僅需要一處配置,即main.js上部的kmdjs.config,用於配置專案名稱、baseUrl,並且列出所有Class和其於路徑的mapping。在開發桌面程式的時候,這個可能IDE會自動幫助管理。

image

依賴可視

想看整個專案的依賴關係,只需在main後面新增?view

image

當然也支援細粒度的依賴可視,比如引用了其他模組,檢視該模組的依賴關係,這個功能會在後續版本中新增。

開發

image

其中,父類的靜態屬性也可以繼承和覆蓋。

除錯

開啟除錯非常方便,只需:

image

就可以在任意瀏覽器的開發者工具裡面輸出經過kmdjs管線聲稱的Class,如:

image

延遲按需載入

在kmdjs v0.0.3版本,假如了kmdjs.get方法用於非同步載入模組。那個版本只支援單一js檔案,而0.0.4版本已經可以自動把該非同步模組及其依賴全部獲取。寫法支援兩種方式:回掉形式和promise形式:

image 

打包

早在0.0.1版本,就支援all in one code。開啟方式也非常簡便:

image

kmdjs會自動建立一個textarea並把打包的程式碼放入其中,只需把該程式碼替換原來的<script src=”kmd.js”></script>即可正常執行。

細粒度打包

在寫kmdjs第一行程式碼的時候,我就知道all in one code只有在業務小、或者打包成apk或者ipa時候才能使用。引用前端農民工一句話:

可以把其依賴於項全部單獨壓縮起來。當且僅當業務規模很小,快取命中、按需載入收益不明顯時,all in one code的方式才因為沒那麼矬而不被察覺其劣勢。

 QQ截圖20140703123230

所以,在kmdjs0.0.4版本中,可以支援細粒度打包,打包的模組會自動合併其依賴。而且被打包之後的模組可以被任意kmdjs專案使用。

是不是有點dll的感覺了?我引用某一dll,我就能使用dll裡的方法!

重生入口

https://github.com/kmdjs/kmdjs

最後

image

update20140704

今天釋出了kmdjs v0.0.5,較大的改動就是build之後的程式碼經過ug2全力壓縮。相關的壓縮程式碼如下:

QQ截圖20140704104204

相關文章