迅速發展的前端開發，在每⼀年，都爲開發者帶來了新的關鍵詞。2019 年已步⼊尾聲，2020 年前端發展的關鍵詞⼜將有哪些呢？發展的方向又會是什麼呢？參考2019年大前端的發展，不出意外，前端依舊會圍繞⼩程序、超級APP、跨端開發、前端⼯程化以及新技術運用等幾個方面進行展開（能夠參考2019年大前端技術趨勢深度解讀）。前端
小程序
在⼩程序⽅⾯，今年仍然是⼩程序突⻜猛進的⼀年，各⼤主流的 App 都上線了⼩程序能⼒的⽀持，各前端團隊也都有了專⻔的⼩程序開發團隊，以適應更快的⼩程序開發需求。同時App 中不少關鍵的功能都被⼩程序所替代，甚⾄有些 App 已經變成 Native ⼩程序殼，上層的應⽤實現所有是⼩程序。web
在微信小程序出現之前，你們在談 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的大規模商業，會誕生一批新的互聯網巨頭。
本文同步分享在 博客「xiangzhihong8」（CSDN）。
若有侵權，請聯繫 support@oschina.cn 刪除。
本文參與「OSC源創計劃」，歡迎正在閱讀的你也加入，一塊兒分享。