iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 1
2
Mobile Development

Why Flutter why? 從表層到底層,從如何到為何。系列 第 1

days[0] = "為什麼你應該現在開始學習Flutter?"

總之先上個圖。

雖然這系列的定位主要是針對正在學習或已經有些經驗的Flutter開發者,深入探討一些開發過程中,大家可能比較「知其然而不知其所以然」的問題。但在一切開始之前,還是希望能向其它沒聽過Flutter、抱持懷疑,或還在觀望的各路高手,大力推坑一下Flutter這個轟動武林,驚動萬教的跨平台APP開發框架。所以,到底為什麼你應該現在開始學習Flutter?

跨平台是APP開發的聖杯

打從智慧型手機問世,Android/iOS兩大陣營各據一方,雙系統的APP開發就一直是所有開發者和創業者心中永遠的痛。明明是幾乎一模一樣的UI、幾乎一模一樣的商業邏輯、串接同一個後端,竟然需要動用兩位工程師從頭到尾獨立開發,使用完全不同的語言和框架,熟悉完全不同的作業系統、開發環境、工具、函式庫乃至於整個生態系,這實在是一件很不合理的事。因此,能夠讓工程師只學一套語言/框架,撰寫/維護一份程式碼,就能一次建立雙平台甚至更多應用程式,這樣的跨平台開發框架就成了所有人這十年來苦苦追尋的聖杯(Holy Grail,不是擲笅那個)。

Flutter的獨特之處

本來想寫為什麼Flutter是目前跨平台框架的最佳選擇,想一想覺得很容易起爭議,還是針對Flutter本身寫就好了。
Flutter其中一個獨特之處是,所有UI元件都是Flutter自己透過Skia引擎在原生的Canvas上畫出來的,而不是像React Native透過JS Bridge去建立和操控原生UI元件。這一來避免了和原生溝通的效能問題,二來降低了複雜度,三來讓你對於畫面上的每一個像素有完全的掌控,可以說是相當革命性的設計。
另一個特點是Dart語言,它最獨特之處在於同時有JIT和AOT兩種編譯模式,讓你可以在開發階段用JIT享受如Web開發般的Hot Reload速度,而在發佈時又可以用AOT來達到和原生開發接近的效能。個人認為這是未來所有新語言都值得效法的優良設計。
另外,當年的Dart是個極為小眾且不成熟的語言,隨著Flutter的熱潮才跟著蓬勃發展。這其實也不完全是個缺點,因為這代表Dart本身沒有太多的歷史遺毒存在,改動時也不會造成大量專案的問題,而來自其它各平台的開發者們可以很大程度的影響Dart語言的發展,吸收其它語言的經驗和教訓後,將Dart中各種語言特性去蕪存菁,例如Extension和NNBD。
最後,Flutter背後的金主是Google這點也是至關重要的。不同於React Native的Facebook和Xamarin的Microsoft,Google本身就是其中一個行動平台Android的主要開發商和金主,同時也在雙平台上開發了十多個Google App,可以說Google對於行動開發的經驗、誘因以及對Flutter的投入、支持程度都不是另外兩家公司可以比較的。

Flutter非常容易上手

如果你學過React, Vue等component base的UI框架,Flutter絕對會讓你感到十分熟悉,上手輕而易舉。Widget就是Component、想setState()就用StatfulWidget、Dart一開始只是個加強版的JS,還有各個從React來的老朋友Redux, MobX...。當然如果你是來自其它門派也沒關係,不論是Android, iOS, React Native還是Xamarin.Form,Flutter官方文件都貼心的幫你準備了轉職小手冊,讓你能以你熟悉的概念去理解Flutter,大幅縮短你盲目摸索的時間。

以我個人的學習經驗為例。在2017年Google剛推出Flutter時,我從學習Dart、學習Flutter,到把一個大約五千行的Android App用Flutter全部重寫,大概花了一個月。那時即使是國外社群討論度也趨近於零,不像原生開發有著無窮無盡的教學文件、影片、StackOverflow和現成函式庫。幸好,Google一推出Flutter時就搭配了相當完善的官方文件,大部分常用的Widget都有詳細到你不想看的文字說明和使用範例。即使官方文件有不足之處,Dart靜態型別也能幫助你明確知道Widget每個參數,每個函式的輸入輸出是什麼。再加上Flutter有點走火入魔的複合Widget,把每一個Widget的職責切割的更明確,很多時候你在玩一個新Widget時根本也不用看任何文件,只要照著參數型別一個蘿蔔一個坑填進去,然後Hot Reload看看有什麼效果就好了。

說到Hot Reload,這也是Flutter最大的賣點之一。長久以來,原生開發的專案建置速度一直是一件令原生開發者苦不堪言,而Web開發者難以想像的事。在專案裡即使是一個字元的改動都有可能需要經過短則數十秒,長至幾分鐘,甚至幾十分鐘的建置,才能在APP裡看到更新的結果。Android這邊雖然在經歷過Jrebel, Instant Run, Apply Change之後有了令人欣慰的改善,但跑起來依然是一個會令Web開發者同情的速度。至於iOS開發者,就讓我們所有人一起關懷他們。Flutter的Stateful Hot Reload大多情況都可以在毫秒到一兩秒之內完成並且保留當前頁面的狀態,即使未來專案持續增長,Hot Reload速度也不會有顯著的改變。這讓人能夠以不可思議的迭代速度去探索並學習Flutter SDK提供的各式各樣的Widget,社群開發的各種函式庫,甚至即時同步的跟隨著教學影片一步步撰寫程式。

另外,一開始就同時支援VS Code, IntelliJ, Android Studio這3套IDE也讓Flutter一開始的學習門檻下降許多。能夠善用自己熟悉的IDE的各種自動完成、語法檢查、靜態分析、修改建議、文件瀏覽等功能,在學習一個全新語言/框架時是非常有幫助的。

再來就穩定性而言,Flutter IDE Plugin和SDK本身也從一開始就不錯的表現。當然不是完全沒有Bug,但至少不像Xamarin前輩這麼令人 髮指。嘗試任何全新語言/框架時最怕的就是問題多討論少,遇到問題解不了,當年的Flutter雖然討論少但幸好問題也相對較少,至少在我一個月的開發體驗中,只遇到兩次有問題找不到文件、issue、StackOverflow,須要自己trial&error到成功的情況。

當然這一切都是三年前的事了。現在的Flutter聲勢如日中天,官方文件更完善,開發工具更穩定,StackOverflow也已經超越React Native,不論中英文學習資源都十分充沛,你甚至還能在台灣找到Flutter家教(aka.我XD)。現在這個時間點,我家教學生的Flutter學習經驗大概是,從只上過一堂大學Web開發相關課程開始,到使用Flutter建立一個有登入/儲存/資料庫系統的課堂作業繳交APP,花了兩個多禮拜。

Flutter還很年輕

Flutter(或任何新框架)過去常常被詬病的問題,不外乎社群小、文件少、函式庫少、功能不齊全等等,一切都可以概括成三個字:太年輕。這些並不是什麼框架設計本質上無法改變的問題,而是隨著框架使用者人數持續增長,自然會解決的問題。當然如果你是創業者,現在馬上就要一個APP上線,這些都是你實際要考量的問題。
但別忘了這篇文章的標題是「為什麼你應該現在開始學習Flutter?」
跨雙平台、三平台、四平台的開發絕對是未來的趨勢,而Flutter未來的蓬勃發展也是毋庸置疑的。雖然現在台灣Flutter相關職缺還非常少,但就業市場的興盛也只是時間的問題。
如果你能現在就開始累積經驗,為什麼要等到所有人都跑在你前面了才起跑?
想像一下如果你從2017就開始學習Flutter,現在還有哪份相關工作你拿不到?
當未來好幾個平台的職缺緊縮成一個,而一個跨平台工程師可能拿到比單平台好得多的職缺和待遇,你會是被淘汰的人,還是留下來的人?

Go Flutter go

寫到這裡,希望有說服你嘗試看看Flutter這個美麗的框架。如果你想開始學習,你可以在iT邦幫忙這裡找到一些Flutter系列文,基本上都不錯。畢竟Flutter真的很簡單,怎麼寫都不會錯。如果你學了一段時間發現,有些地方好像不知道為什麼要這麼做,之其然而不知其所以然,也許你可以回到這個系列,看看有沒有寫到你想問的問題,或是可以留言給我,也許我有空就會寫一篇。


下一篇
days[1] = "為什麼build()在State裡?"
系列文
Why Flutter why? 從表層到底層,從如何到為何。30

尚未有邦友留言

立即登入留言