2020前端發展趨勢 -

迅速發展的前端開發,在每⼀年,都爲開發者帶來了新的關鍵詞。2019 年已步⼊尾聲,2020 年前端發展的關鍵詞⼜將有哪些呢?發展的方向又會是什麼呢?參考2019年大前端的發展,不出意外,前端依舊會圍繞⼩程序、超級APP、跨端開發、前端⼯程化以及新技術運用等幾個方面進行展開(可以參考2019年大前端技術趨勢深度解讀)。

小程序
在⼩程序⽅⾯,今年仍然是⼩程序突⻜猛進的⼀年,各⼤主流的 App 都上線了⼩程序能⼒的⽀持,各前端團隊也都有了專⻔的⼩程序開發團隊,以適應更快的⼩程序開發需求。同時App 中很多關鍵的功能都被⼩程序所替代,甚⾄有些 App 已經變成 Native ⼩程序殼,上層的應⽤實現全部是⼩程序。

在微信小程序出現以前,大家在談 Hybird、ReactNative,但終歸只是技術層面的狂歡,始終沒有業務屬性的注入。小程序的出現,一方面告訴業界在當前設備上 Webview 也沒差到哪去,另外一方面告訴業界如何讓有能力的商家在超級 APP上進行私域運營。

另一方面,從技術角度說,在上層 DSL 的嚴格限制下,超級 APP 就可定義符合自己訴求的 Web 標準,彌補當前 Web 標準的不足,最後和客戶端配合,結合離線、預加載、定製Webview 能產出類似於 NSR 等各種酷炫的技術模型,讓 Web 在端內低成本達到 Native 版的體驗,端外也不會像 Weex 一樣有點小別扭。

不過由於需要依賴超級APP(微信、支付寶、百度、美團、頭條等),由於各家平臺採用的具體方案的差異,造成目前小程序的落地方案也不一樣,有時候需要開發多套代碼。

跨端開發
跨端開發⽅⾯,RN ⽣態已經⾮常成熟,或者說看不到太多發展前景,因爲目前還停留在0.61版本,似乎1.0版本仍然遙遙無期。因此,今年很多團隊轉戰⾕歌⽣態的 Flutter,特別是 Flutter for Web 的第⼀個 Release,⼜讓 Web 前端重燃希望、躍躍欲試。

同時,蘋果公司也發佈了全新的 UI 系統——SwiftUI,同時,開源社區中 SwiftUI for Web已經在路上了,SwiftUI for Android 還會遠嗎?

跨端開發⽅⾯,Flutter 仍會快速發展,並且會有更多的開發者,Flutter on JS、SwiftUIfor Web&Android 也將是開源⽣態值得期待的事情,畢竟跨端仍沒有⼀個完美的解決⽅案。

前端工程化
在前端⼯程化⽅⾯,開發者最重要的基本素養就是通過⼯具提升效率,⽽前端開發者在這⽅⾯會持續迭代和優化。

曾經我們談 Yoman,談 CLI 等系列構建工具,但在團隊大了之後始終覺得差點什麼。反觀 Java 同學,從沒聽說過 Spring Boot 配置工程師。今年很多團隊都在建設完整的前端 DevOps 流程⼯具集,⼀些團隊之間也開始協作共建,不管是 Web 還是⼩程序項⽬,從新建項⽬、開發、聯調(tiao)、部署、測試、發佈、運維到監控統計,都有完善的⼯具做保障和提效,今後前端⼯程也會越⾛越標準化。

展望2020年前端的發展,前端工程體系一定會更加閉環,不再是一個腳手架這麼簡單,而是會結合 IDE,打通業務屬性,從項目初始化、到編寫代碼、到 CI、到灰度、到發佈 形成一個完成的閉環。

Serverless
Serverless 的⽕爆⼏乎可以歸因於前端。因爲 Serverless 能夠較完美的⽀持Node.js,使⽤ Serverless 幫助前端開發者解決了使⽤Node.js 過程中的諸多問題。

當前的前端工程師大多都是科班出身,雖不能和正宗的服務端開發同學比,但也可寫很多服務端層的業務邏輯。當前已經有很多公司在做 BFF 層,來滿足這部分訴求,但依舊擺脫不掉運維、機器分配 這條攔路虎。隨着 Serverless 的逐步落地,BFF 這層的代碼會擺脫運維、機器分配等複雜的問題,同時大概率會由前端同學寫這部分代碼,服務端同學專注中臺系統的實現。從業務上說,業務的試錯成本也會大幅度降低。

隨着 Node.js 成爲前端開發者必備技能之後,雲計算的不斷普及會讓Serverless 觸⼿可及。當越來越多的開發者嚐到研發⾼效的甜頭之後,Serverless 必將對前端的研發模式產⽣變⾰。

同時,使用Serverless的同學一定會使用 TS。這也意味着,2020 不寫 TS 可能真的就 Out 了。

WebAssembly
WebAssembly 是一種新的字節碼格式,目前主流瀏覽器都已經支WebAssembly。 和 JS 需要解釋執行不同的是,WebAssembly 字節碼和底層機器碼很相似,可以快速裝載運行,因此性能相對於 JS 解釋執行而言有了極大的提升。 也就是說WebAssembly 並不是一門編程語言,而是一份字節碼標準,需要用高級編程語言編譯出字節碼放到 WebAssembly 虛擬機中才能運行, 瀏覽器廠商需要做的就是根據 WebAssembly 規範實現虛擬機。

有了 WebAssembly,在瀏覽器上可以跑任何語言。從 Coffee 到 TypeScript,到 Babel,這些都是需要轉譯爲 js 才能被執行的,而 WebAssembly 是在瀏覽器裏嵌入 vm,直接執行,不需要轉譯,執行效率自然高得多。

舉個例子,AutoCAD 軟件是由美國歐特克有限公司(Autodesk)出品的一款自動計算機輔助設計軟件,可以用於繪製二維製圖和基本三維設計。使用它時,無需懂得編程,即可自動製圖,因此它在全球被廣泛應用於土木建築、裝飾裝潢、工業製圖、工程製圖、電子工業、服裝加工等諸多領域。

AutoCAD 是由大量 C++ 代碼編寫的軟件,經歷了非常多的技術變革,從桌面到移動端再到 web。之前,InfoQ 上有一個演講,題目是《AutoCAD & WebAssembly: Moving a 30 Year Code Base to the Web》,即通過 WebAssembly,讓很多年代久遠的 C++ 代碼在 Web 上可以運行,並且保證了執行效率。

WebAssembly 的核心 JavaScript 引擎 V8 目前已包含了 Liftoff 這一新款 WebAssembly baseline 編譯器。Liftoff 簡單快速的代碼生成器極大地提升了 WebAssembly 應用的啓動速度。2019年,很多的公司都開始投入人力進行WebAssembly的學習個改造,相信2020年WebAssembly會經歷爆發式期。

5G
2019年一個繞不開的話題就是5G。⾸先,5G 帶寬的⼤幅提升帶來傳統 Web ⻚⾯複雜度的進⼀步提升,如同 2G 到 4G 變⾰過程中⻚⾯從 WAP 的純⽂本超鏈接時代變⾰到 4G 全圖⽚視頻時代。5G 對於⻚⾯的變⾰必將是巨⼤的,但肯定不會⼀蹴⽽就。因爲相應的配套設施也需要逐步完善,如硬件性能和瀏覽器的處理速度。⽽服務端渲染(SSR)肯定是其中⼀個捷徑,輕前端重後臺,5G 是橋樑,把渲染放後臺,不像同構那麼簡單,需要關注和優化渲染性能。WebAssembly 或許會在這個機遇下得到快速發展,因爲它可以⽆縫對接後臺多種語⾔,⽽後臺渲染的優化也會帶來前端⻚⾯研發模式和技術架構的變⾰。

其次,5G 帶來的萬物互聯,⼜將帶來有別於智能⼿機和普通 PC 的多樣化的應⽤場景,VR、可穿戴設備、⻋載系統、智能投影、智能交互等⼜會把 Web 帶⼊各種各樣的垂直領域,這也意味着前端將有更多⼴闊的空間。相信隨着5G的大規模商業,會誕生一批新的互聯網巨頭。
————————————————
版權聲明:本文爲CSDN博主「xiangzhihong8」的原創文章,遵循 CC 4.0 BY-SA 版權協議,轉載請附上原文出處鏈接及本聲明。
原文鏈接:https://blog.csdn.net/xiangzhihong8/article/details/103233487

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章