Google在部落格上說明了UI開發工具Flutter的最新發展情況,分享Flutter支援複雜網頁應用程式的技術細節。
Flutter是一個開源的UI框架,由Google開發,可快速地建立原生編譯的應用程式介面,一開始僅支援iOS與Android行動平臺,但隨著發展,Flutter越來越受到歡迎,全球現有數十萬工程師使用,而且Google內部開發團隊也越來越倚重Flutter,再加上用來開發底層框架的程式語言Dart,提供了網頁移植性,因此Google在去年的時候宣布,Flutter將會支援更多的平臺,除了桌面、嵌入式裝置之外,還開始支援網頁平臺。
Google正在改進Flutter,使其更容易用於網頁應用程式開發,除了改善基本的操作功能外,使得文字渲染、網頁捲動、導覽和存取性,更符合原本瀏覽器網頁的操作習慣,還強化複雜圖形應用程式的支援,以及提升效能。
Flutter本身是一個多層的系統,提供了一個抽象小工具、動畫和渲染等功能的框架,並且同時也是一個能夠利用系統公開的API,渲染目標裝置畫面的引擎。框架是以Dart撰寫,Flutter會將這些框架元件與使用者程式碼結合在一起,並在編譯時利用樹搖演算法,僅將需要的程式碼下載到瀏覽器中。Flutter採用回應式程式模型,會根據狀態變化更新使用者介面,在每個影格使用瀏覽器底層的API,繪製與改變UI的狀態或是布局等。
在預設情況下,Flutter使用標準的HTML DOM和Canvas技術,在這種模式,引擎會將每個Flutter場景翻譯成為HTML、CSS或Canvas,並以HTML元素樹的形式,將框架渲染到頁面上。Google稱這種方法為DomCanvas後端,不只提供最大的瀏覽器相容性,而且適合短暫的對話,與需要快速啟動的應用程式。
雖然DomCanvas的效能良好,但Google同時發展了另一種後端技術,使用CanvasKit為基礎的後端,這個後端可以使用WebAssembly和WebGL,在瀏覽器中渲染開放圖形引擎Skia的繪製命令,Google提到,之所以他們開始試驗CanvasKit,是因為Flutter行動與桌機版本都使用Skia圖形引擎,且不像是HTML DOM,Skia能夠直接存取低階圖形堆疊。
目DomCanvas仍提供較好的瀏覽器支援,更小的程式碼以及更快的初始頁面載入速度,但是CanvasKit讓Flutter開發人員可以利用新的技術,建立圖形密集的網頁應用程式,設計軟體供應商Rive已經使用Flutter,和基於Skia的瀏覽器渲染功能,重新打造了自家的動畫平臺。
未來可能會逐漸走向其中一種後端技術,但是當前Flutter開發者還可以選用符合自己需求的後端。
(本文轉載於iThome,完整文章請至https://www.ithome.com.tw/news/139117觀看)
精選專案.網頁設計.RWD響應式網站.行動版網站.企業形象網站 / 電子工業類
網站技術:PHP . Javascript/MySql
全台唯一自有工廠及正式品牌授權 (Samsung、Walsin、PDC、Kamaya)的被動元件代理製造商與經銷商,在半導體供應鏈站有一席之地。
精選專案.網頁設計.RWD響應式網站 / 休閒餐飲類
網站技術:PHP . Javascript/MySql
用最純粹的方式來鎖住食材最天然的味道,因應不同季節推出當季的水果冰淇淋,讓消費者可以品嘗到在地好滋味。可以利用官網訂購冰淇淋,也可以親自到門市享用冰淇淋與其他甜點喔。
網頁設計.企業形象網站 / 機械工業類
網站技術:PHP . Javascript/MySql
提供專業氣動打釘槍的研發與製造服務,並且有優良的產品品質。
電話:(02)2739-9096 | 傳真:(02)2739-6637 | 客服:[email protected] | 臺北市信義區和平東路3段257號6樓map
© 2019 傑立資訊 All rights reserved.| 網站隱私政策