2020年是國內(nèi)互聯(lián)網(wǎng)公司發(fā)展最迅速的時代, 前有技術(shù)公司華為獨立開發(fā)了操作系統(tǒng)和國內(nèi)芯片產(chǎn)業(yè), 后有疫情時代興起的在線教育和直播產(chǎn)業(yè), 無疑對前端團隊帶來了巨大的挑戰(zhàn)和機遇. 筆者將結(jié)合一線互聯(lián)網(wǎng)公司實際做的事情來對2020年技術(shù)做一次梳理, 希望對大家有所幫助.

2020年前端團隊的新挑戰(zhàn)和方向

1. 跨平臺應(yīng)用架構(gòu)的研發(fā)和應(yīng)用

跨平臺應(yīng)用開發(fā)在幾年前國外就開始做了, 比如React Native, 筆者這里梳理一下具體的場景和技術(shù)方案:

• H5(HTML5)+ 原生 ( Cordova、 Ionic、微信小程序)

• Javascript 開發(fā) + 原生渲染 ( React Native、Weex、快應(yīng)用)

• 自繪 U+ 原生 ( QT Mobile、 Flutter)

• uniApp / Taro

這里筆者采用uni的架構(gòu)來給大家展示跨平臺的底層架構(gòu):

筆者周圍的很多前端工程師其公司業(yè)務(wù)基本都有跨平臺的需求, 所以如果你對這個方向感興趣, 可以提前了解研究一下.

2. 實時音視頻技術(shù)發(fā)展和應(yīng)用(WebRTC)

隨著人們對用網(wǎng)的要求日趨迫切和5G技術(shù)的發(fā)展, 實時音視頻通信風(fēng)頭正勁，實時音視頻技術(shù) WebRTC 也因此受到了廣泛關(guān)注。相關(guān)數(shù)據(jù)顯示，2017-2021 年期間，全球網(wǎng)絡(luò)實時通信（WebRTC）市場將以 34.37％ 的年均復(fù)合增長率增長。 目前國內(nèi)的很多廠商比如騰訊云, 阿里云, 七牛云等都提供了非常完善的技術(shù)支持, 作為前端工程師的我們, 不僅要學(xué)會如何去應(yīng)用這些技術(shù), 也要了解這些技術(shù)的底層實現(xiàn)原理. 筆者這里介紹一下使用場景:

3. 前端應(yīng)用監(jiān)控體系逐漸完善和服務(wù)化

前端監(jiān)控包括行為監(jiān)控、異常監(jiān)控、性能監(jiān)控等，為了在競爭日趨激烈的時存活下去, 企業(yè)不得不對應(yīng)用做好全方面的分析, 保障應(yīng)用的可監(jiān)測和穩(wěn)定性.

一般而言，一個監(jiān)控系統(tǒng)，大致可以分為四個階段：日志采集、日志存儲、統(tǒng)計與分析、報告和警告。

根據(jù)異常代碼的后果的程度，對前端異常的表現(xiàn)分為如下幾類:

所以作為前端工程師的我們, 需要了解前端監(jiān)控的基本組成和表現(xiàn), 不管未來我們是使用第三方的監(jiān)控平臺還是自己開發(fā), 都會有一個大致的方向. 筆者也會在 趣談前端中分享相關(guān)的技術(shù)實踐, 感興趣的可以相互交流.

4. lowcode平臺和可視化搭建平臺

最近我們可能聽到很火的一個技術(shù)話題就是lowcode. 云開發(fā)低碼 LowCode 是高效、高性能的拖拽式低代碼開發(fā)平臺，向上連接前端的行業(yè)業(yè)務(wù)，向下連接云計算的海量能力，助力企業(yè)垂直上云。云開發(fā)低碼將繁瑣的底層架構(gòu)和基礎(chǔ)設(shè)施抽象化為圖形界面，通過行業(yè)化模板、拖放式組件和可視化配置快速構(gòu)建多端應(yīng)用（小程序、H5應(yīng)用、Web 應(yīng)用等），免去了代碼編寫工作，讓您能夠完全專注于業(yè)務(wù)場景。云開發(fā)低碼以云開發(fā)作為底層支撐，云原生能力將應(yīng)用搭建的全鏈路打通，提供高度開放的開發(fā)環(huán)境，且時刻保障我們的應(yīng)用。

目前很多云廠商有很多方案, 這里我們不一一介紹了, 接下來我們來看看它的應(yīng)用場景:

對于可視化搭建平臺, 目前也是很多公司在竭力去研究的方向, 筆者的朋友開的公司都在做這一塊的業(yè)務(wù), 包括電商平臺的營銷可視化搭建系統(tǒng), 后臺業(yè)務(wù)系統(tǒng)可是可視化, H5可視化搭建等, 如下:

• Outsystems

• Mendix

• iVX | 跨平臺lowcode解決方案

• amis | 管理業(yè)務(wù)先行的B端低代碼解決方案

• H5-Dooring | 移動先行的可視化編輯器

關(guān)于 H5-Dooring 的實現(xiàn)方式, 筆者也寫了很多文章, 感興趣的可以學(xué)習(xí)參考一下, 目前還在持續(xù)迭代和更新.

如何搭積木式的快速開發(fā)H5頁面?

5. severless技術(shù)應(yīng)用普及

Serverless，即無服務(wù)器架構(gòu)，是一種新的架構(gòu)方式。目前也是非常熱門的一種技術(shù)，很多大公司都在往 Serverless 這個方向上發(fā)力。它的核心思想是讓開發(fā)者專注構(gòu)建和運行應(yīng)用，而無需管理服務(wù)器。在傳統(tǒng)模式下，如果我們想將應(yīng)用程序上線，一般得提前了解它需要多少臺服務(wù)器、多大的存儲量和數(shù)據(jù)庫等。并且還需要安裝應(yīng)用程序所依賴的其他軟件。但如果使用 Serverless，就可以讓我們不需要去費心布置和管理這一切。 總的來說，Serverless 的特點有：

• 事件驅(qū)動

• 自動擴展伸縮

• 無狀態(tài)

• 無需自己管理服務(wù)器

• 低成本，按需收費，不運行不收費

所以, 2020年, 如果我們前端er們還不好好了解一下 serverless, 是不是要更不上時代了呢?

6. 腳手架生態(tài)日趨成熟, 百花齊放

腳手架主要是為前端團隊做工程化管控的工具, 使用它我們可以輕松的開發(fā)應(yīng)用和打包部署, 目前也有很多腳手架生態(tài)百花齊放, 其核心還是對 nodejs 和 webpack 等的掌握, 就拿umi來說, 作為企業(yè)開發(fā)的開箱即用的集成工具已經(jīng)是非常強大了, 我們可以定制umi的插件, 利用其加載機制去實現(xiàn)各種復(fù)雜業(yè)務(wù)的場景應(yīng)用. 如下:

所以如果我們想進階前端, 我們可以學(xué)習(xí) umi 的架構(gòu)模式, 推陳出新. 筆者也基于umi 開發(fā)了對應(yīng)的組件庫, 大家感興趣可以研究學(xué)習(xí)一下:

微前端架構(gòu)實踐

從0到1教你搭建前端團隊的組件系統(tǒng)（高級進階必備）

7. 前端Vr技術(shù)應(yīng)用落地

Vr技術(shù)也是近幾年比較火的技術(shù), 目前國內(nèi)公司也在布局這塊的業(yè)務(wù), 包括x寶等電商網(wǎng)站做的Vr商品展示, 看房平臺的房屋全景Vr等, 某字節(jié)的某個產(chǎn)品目前也在做這一塊的事情, 所以大家可以參考一下, 主要實現(xiàn)可以使用 three.js 等.

8. 華為鴻蒙系統(tǒng)上市之后的javascript技術(shù)應(yīng)用紅利

關(guān)于華為操作系統(tǒng)的上線, 很多前端 coder們又迎來了新一波的學(xué)習(xí)潮, 想一想我們可以用javascript來開發(fā)操作系統(tǒng)的應(yīng)用軟件, 是一種什么感受呢, 嗅覺敏銳的企業(yè)家估計早已默默規(guī)劃相關(guān)產(chǎn)品了, 所以前端的未來, 無限可能.

2021, 無限可能

2021年將繼續(xù)驗證2020的技術(shù), 并不斷將技術(shù)落地, 前端工程師們將迎來新一波的技術(shù)迭代, 所以我們抓住以上的趨勢, 持續(xù)努力吧......

了解更多，請點擊：https://www.bilibili.com/video/BV13a4y1n7tS/

作者：徐小夕
鏈接：https://juejin.cn/post/6913003799141416973
來源：掘金
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。