hi 掘友們，「JTalk大前端做者專訪」第二期來啦，本期咱們專訪的是你們在站內很是熟悉的一個做者——戀貓de小郭（掘金主頁 juejin.cn/user/817692… ），他在掘金高等級做者中一直保持着很高的更文頻率，在本身的領域不斷的深耕學習。每個做者都不少閃光的點，此次專訪待你們一塊兒來了解一下戀貓de小郭。前端

自我介紹

做者的主要經歷，擅長和關注的領域是哪些？咱們看到做者有一本著做《Flutter 開發實戰詳解》，做者是什麼契機開始接觸 Flutter 技術的，最初是如何學習 Flutter 的？vue

你們好，我是戀貓de小郭，《Flutter 開發實戰詳解》 的做者郭樹煜，Github ID CarGuo，在移動開發領域已深耕多年，目前主要從事大前端相關的工做，主要涉及領域有：Flutter 、Android 、React Native 、Weex 、Cordova 等等，固然有時候也會「兼職」作一些 iOS 和 Web 相關的內容。react

我是在 2016 年收到掘金邀請入駐的，做爲平臺第一批入駐做者，現在已經發布了 100 多篇文章，內容主要覆蓋 Android 、 React Native 和 Flutter 等，其中包含了一些技術領域的熱門資訊；固然我也是沸點的「摸魚達人」，發佈的沸點總數有近 500 條。android

伴隨着掘金一路走來，能夠說在快速成長的這幾年，掘金平臺給予了我很大的幫助，經過掘金也結識不少大佬，獲得了去一些大會論壇進行技術分享的機會，固然這也得益於業餘時間的寫做和開源，它們給予了我更多交流和學習的途徑。git

我接觸 Flutter 的契機是由於當時要作一場公司的內部技術分享，公司要作技術選型，因此那時候分享的主題是 《移動端跨平臺開發的現狀和分析》 ，而剛好那時候 Flutter 「初出茅廬」，就被我加入到 ReactNative 、Weex 的調研分析中。程序員

初識 Flutter 的我對它的第一感受並不看好：github

首先 Flutter 的嵌套寫法第一印象讓我有點抵觸；面試
其次 Flutter 選擇了 Dart 而不是 JS，那時候 Dart 語言原本就是經歷過「滑鐵盧」；小程序
最後當時 Flutter 的第三方支持實在少的可憐；windows

固然隨着瞭解的深刻，我發現以前確實「草率了」！

首次 Flutter 在跨平臺的渲染效果上着實驚豔到我，由於以前在學習在 React Native 和 Weex 的時候有開源過對應的 GSYGithubApp 客戶端，因此在對 Flutter 進行調研學習時，我就把 GSYGithubApp 項目重構了一版 Flutter 版本，雖然期間也遇到了很多問題，可是經過解決這些問題，也讓我對 Flutter 有了新的理解。

我還記得當時在 Android 上開發完基本項目效果後，第一次在 iOS 上運行完竟然沒有出現問題，而且渲染結果還徹底一致，甚至我在 Android 上使用本來應該 Android 上特有的界面效果，也天然地出如今 iOS 上，這就讓我對 Flutter 產生了一種極大的吸引，從而走上了 Flutter 的佈道路。

從 Android 到大前端

從 Android 到大前端從 Android 到跨平臺再到現在的大前端領域，順着技術的潮流發展是如何作好適應以及過渡的，能夠舉一兩個例子講一下嗎？

其實從 Android 到跨平臺是一個天然而然的過程，隨着技術平臺的成熟和穩定，該項技術的門檻就會相對下降，從而就會有追求更高效的開發方式。

舉個不是很嚴謹的例子：

還記得 2016 年，那時候我帶的移動開發團隊最少時也有 6 我的，其中大部分時候是 3 個 android 和 3 個 iOS，基本算是那時候開發一個常見中小型移動應用的團隊標配。

而 2021 年如今不少中小型的應用，基本只須要 2 到 3 個移動開發就能夠完成 App 的基本開發需求，甚至這兩年接觸過很多團隊是 1 個 Android 、1 個 iOS 和 1 個前端共同開發的搭配。

近兩年我就接觸到很多前端開始經過 uni-app 、React Native 、Flutter 去負責 App 相關的業務；也面試過一些 iOS 和 Android 開發在學習前端和小程序的技能；大概這就是圈子內所說的「卷」吧，固然我更願意稱之爲「消失的紅利期」。

早些時候新興的技術會由於領域內的「蠻荒」而帶來不少紅利，第一批「啃螃蟹」的人每每能博得頭彩，可是隨着社區的發展和「前人的耕耘」，成熟的技術一定讓「門檻」愈來愈低、使用愈來愈便捷、商業對技術的追求確定是「更低成本」而且有「更高的可用性」。

舉一些粗淺的生態例子：

react 、 react-native 、 react-native-windows 、 Taro 、alita 等的 react 生態；
vue 、mpvue 、 weex 、uni-app``Jetpack Compose 、Compose for desktop 在移動端和桌面端的支持；
SwiftUI 在 iOS, iPadOS, macOS, watchOS, tvOS 構件應用的能力；
Flutter 在移動端、桌面端和 Web 端的支持；

正如上面的圖片所示，咱們能夠看到愈來愈多的 App 開始使用跨平臺的能力，而我我的認爲這種「技術紅利」對於程序員來講是好事，新的技術表明着新的可能，甚至是新的就業機會，就我我的而言，無論是 React Native 仍是 Flutter 都成爲我職業生涯裏很重要的組成。

固然我也理解對新東西的抗拒和抵觸：由於大多數時候咱們會但願安於現狀，夠用就好，整那麼多花裏胡哨幹什麼？

因此還有一點就是：學東西仍是須要深刻去理解框架和設計的思想，理解了一項技術的設計理念，才能「以不變應萬變」的方式去面對快速迭代的潮流。

固然有人說：「你看這傢伙又在誤導別人，嚼多不爛，雜而不精，爲何我不在一個平臺精通呢？」

這個確實是個問題，可是思考這個問題以前，我之前就和一些網友的交流中發現：有時候你們都只是停留在思考這個問題上，主要是用這個問題來講服本身能夠「躺平」。其實多而不精是對的，可是反之並非，不是你不學多就天然而然的精了。

若是你的工做能給你提供深刻精通的場景，那固然是最好不過，由於不少時候精通某項技術，是須要業務場景去驗證和推動的。可是若是不是大致量的業務場景，沒有經歷過各類極端的考驗，不少時候所謂的精通只是表層精通。

在我看來的精通不是熟練掌握了 React，Vue 等框架調用和源碼的背誦，也不是精通 Flutter ，Android 等框架的 API 調用技巧，而是你理解了這些東西的核心思想和理念。

好比把 Android 上關於 Canvas 的技能就利用到 Flutter 和Web 上；
好比響應式開發和狀態管理的理解可讓我在 RN 和 Flutter 也能很好地利用，甚至將來的 Jetpack Compose 也能夠快速的上手；

技術的抽象能力讓你的技術能夠遷移適配，因此在個人眼中，**大前端的將來「不是我會什麼因此作什麼，而須要什麼我就能作什麼。」

關於 Flutter

關於 Flutter由於你寫過一本 Flutter 相關的書嘛，能夠簡單介紹一下你對於 Flutter 認識和理解，對於它的現狀、以及跟其餘的技術相比，你以爲優點在哪裏？

首先 Flutter 是一個跨平臺 UI 框架，它核心解決的是 UI 跨平臺的能力，因此它不是一個可以「包辦全部」的跨平臺框架。

因此你能夠看到 Flutter 會須要各類平臺插件來支撐它的非 UI 能力，也須要一些平臺的構建能力來完善 Flutter 的開發體驗，**因此 Flutter 的出現不是幹掉原來的平臺，Flutter 更可能是「寄生」的關係。

其次 Flutter 最關鍵是它的控件渲染能力是經過 skia 直接和 GPU 交互，skia 在 Android 上根據不一樣狀況就可能會是 OpenGL 或者 Vulkan ，在 iOS 上若是有支持 Metal 也會使用 Metal 加速渲染。

因此 Flutter 而言它的控件和平臺能夠很好地解耦，而且獲得還不錯的性能，如上圖對比所示：

對於原生 Android 而言，原生代碼通過 skia 最後到 GPU 完成渲染繪製，Android原生系統自己自帶了 skia；
對於 Flutter 而言，Dart 代碼裏的控件通過 skia 最後到 GPU 完成渲染繪製，這裏在 Andriod 上使用的系統的 skia ，而在 iOS 上使用的是打包到項目裏的 skia ；
對於 ReactNative/Weex 等相似的項目，它們是運行在各自的 JS 引擎裏面，最後經過映射爲原生的控件，利用原生的渲染能力進行渲染；
對於 ionic 等這類 Hybird 的跨平臺框架，使用的主要就是 WebView 的渲染能力；

因此能夠看出 ReactNative/ Weex 這類跨平臺和原平生臺存在較大關聯：

好處：若是須要使用原平生臺的控件能力，接入成本會比較低；
壞處： 渲染嚴重依賴平臺控件的能力，耦合較多，不一樣系統之間原生控件的差別，同個系統的不一樣版本在控件上的屬性和效果差別，組合起來在後期開發過程當中就是很大的維護成本。

例如：在 iOS 上調試好的樣式，在 Android 上出現了異常；在 Android 上生效的樣式，在 iOS 上沒有支持；在 iOS 平臺的控件效果，在 Android 上出現了不同的展現，好比下拉刷新，Appbar等；

Flutter 與之不一樣的地方就是渲染直接利用 skia 和 GPU 交互，在 Android 和 iOS 平臺上實現了平臺無關的控件。

簡單說就是 Flutter 裏的 Widget 大部分都是和 Android 和 iOS 沒有關係，可是這也致使了和原生控件進行混合也會有較高的成本和難度，而且 framework 和 engine 須要面對更多的兼容挑戰。

Flutter 學習的建議

對於前端 Flutter 的學習者，能夠分享一下做者本身的學習經歷嗎？對於不一樣階段的 Flutter 學習者能夠分享一下本身的建議。

學習 Flutter 最重要的一點就是要理解： Flutter 裏的 Widget 不是真正的控件。

雖然在使用 Flutter 時咱們寫的界面代碼基本都是 Widget ，可是 Widget 做爲一個 immutable 對象，它不多是真正工做的 UI 對象。

在 Flutter 裏真正的 View 級別對象是 Element 和 RenderObject，其中 Element 的抽象對象就是 Flutter 裏常常用到的 BuildContext。

舉一個我常常提到的例子：

以下代碼所示，其中 testUseAll 這個 Text 在同一個頁面下在三處地方被使用，而且代碼能夠正常運行渲染，若是是一個真正的 View ，是不能在一個頁面下這樣被多個地方加載使用的。

因此 **Flutter 中 Widget 更多隻是配置文件的地位：

用於描述界面的配置代碼，因此描述文件很大程度上並不用擔憂嵌套帶來的性能問題，咱們也能夠經過配置模版去優化代碼的可維護性。

因此對於學習 Flutter 我一直強調，比起去學習 Flutter 裏上百個 Widget 的使用方式，更重要的是理解 Widget 背後的 Element 、 RenderObject 乃至 Layer 的工做原理，這樣你才能系統地明白：

Flutter 如何經過 BoxConstraints 和 Size 佈局？
Flutter 如何經過 SliverConstraints 和 SliverGeometry 完成列表的滑動和排版？
Element 在 Flutter 裏的做用是什麼？它是如何抽象爲 context 而且鏈接 Widget 到 RenderObject ？
Flutter 裏每一個 Layer 是如何獨立工做？每一個 Route 又是如何在一個畫板和 Canvas 維持本身的獨立性？

只有搞清楚了這些問題，纔可能對 Flutter 使用駕輕就熟，可以在平常開發中「周旋」在 Flutter 的各類 UI 細節問題而不掉坑。

對於這些問題的答案，主要集中在《Flutter開發實戰詳解》中的第三章和第四章部分，這部分其實也是這本書的核心內容，其餘內容可能會隨着 Flutter SDK 的升級而發生變化，而這部份內容做爲 Flutter 的靈魂設計理念，能夠跟隨版本迭代而不至於被淘汰。

大前端學習建議

如今單點的技術在實際業務運用起來愈來愈沒有優點，對於大前端的學習做者有什麼建議嗎？

首先不是說愈來愈沒優點，而是對於龐大的開發者羣裏來講，深刻底層的崗位和場景很少，前面也說過，若是沒有對應的場景和平臺，其實很難支持你在深刻精通的路上發展。

舉個例子：

你但願在音視頻的路上有深刻的發展，因此你開始學習 FFMpeg ，而後你學會了如何經過 FFMpeg 播放視頻，轉碼編碼，交叉編譯等等...而後呢？

若是你須要繼續精通下來，就須要開始瞭解視頻的封裝協議、視頻編碼格式，音頻編碼格式、網絡協議相似，而後須要去實踐：

如何針對不一樣格式的編碼進行優化；
不一樣協議如何優化和減小冗餘；
針對關鍵幀和幀序列如何優化；
不一樣網絡條件下對碼率進行優化播放；
直播如何追幀下降延遲；
如何儘量不失幀地壓縮和傳輸視頻；

以上對應這些內容，若是你沒有真實的場景和用戶數據，很難支撐你在這條路持續精通深造，固然我不是勸你放棄，若是有能力和條件，確定仍是在某項技術能持續精通才是王道。

而什麼是大前端？那就是知識的廣度！這裏的廣度不是指你要懂不少技術，而是你要會技術的抽象與通用能力的拓展。

大前端能力須要的是你可以在某個平臺達到 75 分的能力，而且將這個分數在很短的時間內應用到其餘平臺，就像前面說的：

把 Android 上關於 Canvas 的技能就利用到 Flutter 和 Web 上；
響應式開發和狀態管理的理解在 RN 和 Flutter 也能很好地利用，甚至在 Jetpack Compose 也能夠快速的上手；

技術的抽象能力讓你的技術能夠遷移適配，只須要短期的文檔和適應，就能夠完成平臺的工做，在我看來**大前端的將來「不是我會什麼因此作什麼，而須要什麼我就能作什麼。」

關於持續寫做

咱們也看到做者是掘金高等級做者裏面更文頻率很是高的做者，且內容質量都很好，寫做帶給你最大的影響是什麼？有什麼寫做心得跟建議嗎？

寫做給我最大的影響有三個方面：**學習、記憶和激勵。

學習

首先持續寫做的基礎是學習，事實上不少時候學習國外的文章和文檔我是沒有耐心的，而當選擇把它翻譯成中文輸出時，這時候反而會耐下性子把對應的內容看完，由於不看完內容就沒辦法很好的翻譯出效果。

另外就是，當我在寫文章時常常會寫到某個點時，忽然會停下來思考「爲何」？由於不少時候「知道一個東西」和「理解一個東西」是兩個不一樣的概念。

而當我寫文章時，我就須要把」我知道」的變成「我理解」的狀態，把零散的知識變成可以串通的體系，只有我真的理解了這個知識點「是什麼」的時候，纔可以把它轉化爲通熟易懂的文字，這其實就是我學習的一個過程。

記憶

首先持續寫做的第二個目的就是記憶。

在掘金上能夠看到我寫過不少類型的文章，從 Android 、React Native 、Weex 到 Flutter，有介紹框架的，也有深刻底層和問題集錦等，可是事實上不少內容寫過一段時候後我可能就會忘了。

因此當我選擇把本身想要的內容轉化爲文章後，在須要時，我就能夠經過這些文章找回對應的記憶，這也是我產出的目的之一。

激勵

最後就是激勵，寫做對我來講是一個很好的正向激勵，由於我寫的東西有人看，而且有人喜歡，這就會給我持續產出的動力。

我相信不少程序員都嘗試過去作開源和寫做，由於這其實自己就是很好的自我包裝，可是這裏面有個誤區：那就是可能你們覺得只要開源一個項目就能一晚上爆火，只要寫一篇好文就能一晚上10W+，這其實很難，抱着這樣的心態每每很容易就帶來消沉。

就個人寫做經歷而言，一篇文章一開始最多能有幾百閱讀就挺好的了，而後靠的就是時間和推廣。

「酒香也怕巷子深」，因此寫做也須要通推廣，好比：

經過配套項目去介紹你的文章；
去各大平臺投稿；
去解答別人的問題，而後創建本身的社羣；

這是一個漫長的過程，但我一直比較喜歡一句話：「人們每每高估了短時間的收益，低估了長期的回報」，持續分享和推廣是一件很重要的因素。

另外寫做選題時可能會發現：「哦，原來網上已經有人寫過了」，以後就放棄題材不寫了，這是很正常的心態，可是這樣的放棄就會讓你愈來愈難產出內容，由於你不能保證你必定快過別人。

其實當你有須要寫內容時，發現別人已經產出過相應的內容後，那你能夠參考下別人的內容是否和你的想法有什麼不一樣，而後有什麼遺漏或者能夠昇華的地方，甚至是你能夠從另外的角度或者更系統的方式去描述你的觀點。

站在別人的肩膀上能夠看得更遠，固然不是讓你 cv 抄襲，由於抄襲的意義不大，又不是小學生罰默寫。

最後，寫做提供的服務是內容，指望獲得的是關注和交流，因此要比較本身陷入沒必要要的情緒陷阱。

「不要成爲別人情緒的垃圾桶，那就在開始時把蓋子蓋上或者遠離」，面對不善意的評論或者無效的交流，我會選擇屏蔽或者遠離，這樣可能幫我節省出更多的時間來作有用的事情。

福利到

第二期「Jtalk大前端」做者專訪內容就是這些啦

你們有問題能夠在評論區留言

會召喚做者來回答你們的提問哦

另外送一個福利🎉🎉🎉

評論區抽一個掘友送一個 掘金新款周邊T恤

若是你也是前端學習者

掃碼回覆 「前端」進掘金前端做者羣

也歡迎大前端優質做者帶上本身的掘金主頁自薦

下一期再見👋

從Flutter佈道者到大前端全能專家 | 「JTalk大前端」做者專訪第二期