在大前端技術領域,當我們遇到了需要解決重復性的問題時,通常會考慮設計一個DSL(Domain-Specific Language)或者抽象出一個框架層,專門來解決這些類似的問題。使用DSL我們并不需要為特定終端編寫多套代碼,還可以利用宿主語言的抽象能力,確保各終端渲染效果的一致性以及對開發者友好。
目前流行DSL有:React支持的JSX語法、Vue定義的SFC結構和v-*指令集、微信小程序的WXML/WXS語法等。這些DSL最終被編譯為目標代碼,直接發布于小程序平臺,或者借助JS-Runtime運行于APP和Web瀏覽器。
其中,React是函數式編程思想的實踐者,最大的特點是發明了JSX語法,允許開發者使用xml的方式在JS中聲明UI,并通過組件化和更加語義化的代碼而非模板來高效的定義界面,以提供最大的靈活性和響應能力;React只對開發者暴露基礎的生命周期和過程,更多的實現和邏輯細節則交由用戶靈活定制,單純的使用JS語言即可完成整個開發過程,有客戶端開發經驗的開發者將更容易上手React。
而Vue則希望通過盡可能簡單的API實現響應式的數據綁定和UI組件的組合及管理,因此默認屏蔽了非常多的操作細節,這對初學者而言提供了巨大的方便;其單文件組件模板語法也更貼近原生Html5,具備Web前端基礎的開發者,將能夠流暢的過渡到Vue開發中。
二者的共同設計思想是虛擬DOM以及數據驅動視圖更新,設計目的都是為了降低Web開發的復雜度,提升編碼體驗以及開發和維護效率,讓開發者聚焦在業務上。
隨著移動互聯網的迅猛發展,前端技術的范疇已經從Web前端擴展到移動端H5,Android& iOS App,小程序等多端,業務重心也轉移到移動端。而經過多年發展的React和Vue已經變得臃腫,難以適應多端背景下,更個性化和深入下層的應用場景,我們迫切需要從已有的技術中提取精華,構建出更簡單輕巧,能夠對不同端的特性實現針對性優化和處理的能力。
APICloud新產品前沿諜報
即將發布的全新AVM(APICloud View Model)是APICloud基于標準H5子集設計的DSL中間語言編程框架,其可具備如下能力:
● Virtual DOM:通過虛擬DOM,渲染到不同終端,充分尊重系統特性,為不同終端執行差異處理,實現高效渲染;
● 組件化:高可重用性、可組合性、可維護性的架構設計,隱藏了復雜的DOM結構和行為,讓開發者專注于應用的功能和外觀;
● 數據綁定:輕松將數據源綁定到應用用戶界面,降低邏輯復雜性和開發難度;
● 狀態管理和路由:有效分離用戶界面和數據處理,實現項目的工程化管理;
● 類Vue語法和兼容React JSX,兼具Vue的輕巧和React的靈活性。
APICloud DSL最終可編譯為標準JS,通過DeepEngine渲染到app端和Web端,或者編譯為微信小程序代碼,用于微信小程序平臺發布。
APICloud DSL使用Vue方式定義組件或頁面:
APICloud DSL使用兼容React JSX方式定義組件或頁面: