我們來看看web前端開發的壹些常見框架結構。
1.這種全包框架的壹大特點是從底層渲染引擎和布局引擎到中間DSL再到上層的所有框架都是自己開發的,代表框架有Qt和Flutter。
這種框架的優點很明顯:高性能;各平臺渲染結果壹致。
缺點也很明顯:需要徹底重新學習DSL(QML/Dart),難以適應中國特色的結局:小程序。
這種框架是壹種原始的、純粹的多端開發框架。因為從底層到頂層的每壹個環節都掌握在自己手中,也能盡可能保證開發和跨端體驗的壹致性。
但是他們的框架開發成本巨大,渲染引擎、布局引擎、DSL、上層框架每壹部分都需要大量的人力進行開發和維護。
2.基於Web技術的框架將Web技術(JavaScript、CSS)引入移動開發。自研布局引擎處理CSS,使用JavaScript編寫業務邏輯,使用流行的前端框架作為DSL,每端使用自己的原生組件進行渲染。
代表性的框架有ReactNative和Weex,其優點是:開發速度快;重用前端生態;易學易用,無論前端後端移動端,多多少少都會有點JS,CSS。
缺點是:1。交互復雜時很難寫出高性能的代碼,這樣的框架設計必然導致JS和Native之間需要通信。頻繁觸發類似手勢操作的通信,很可能會導致UI無法在16 ms內及時繪制..
ReactNative有壹些聲明性組件來避免這個問題,但是聲明性編寫很難滿足復雜交互的需求。
2.因為沒有渲染引擎,使用各端的原生組件進行渲染,渲染相同代碼的壹致性不高。
3.JavaScript編譯框架是本文的主角:Taro、WePY、uni-app、mpvue和chameleon,它們的原理都差不多:首先選擇壹個基於JavaScript的DSL框架,基於這個DSL框架在每壹端編譯成不同的代碼,每壹端都有壹個運行時框架或者兼容的組件庫來保證代碼的正確運行。