2019年前端趨勢(shì)分析

elarity 發(fā)布于2019-08-23 17:00 / 2951人閱讀

摘要：據(jù)狀態(tài)調(diào)查顯示，只有的前端開(kāi)發(fā)人員使用過(guò)，但是有驚人的的開(kāi)發(fā)人員已經(jīng)聽(tīng)說(shuō)過(guò)它并希望使用它。事實(shí)上，在調(diào)查中，的評(píng)分高于本身，為，而最受喜愛(ài)的語(yǔ)言為。在年，的下載數(shù)量大幅增長(zhǎng)，而保持不變。

2018年TypeScript 全面開(kāi)花，GraphQL 蠢蠢欲動(dòng)，WebAssembly 更是打開(kāi)了瀏覽器上多語(yǔ)言的大門(mén)。所有這一切跟現(xiàn)在的前端有哪些關(guān)系呢？下面小編來(lái)分享一下

1.三大框架標(biāo)準(zhǔn)化

有朋友吐槽：“Vue 的特點(diǎn)就是上手快，初期相當(dāng)好用，但如果接手一個(gè)別人寫(xiě)的 Vue 項(xiàng)目，再和 React 對(duì)比一下，你會(huì)感謝 React 的”。但當(dāng) Vue 3.0 發(fā)布之后，估計(jì)他就不會(huì)這樣說(shuō)了。因?yàn)?Vue 3 的 Class API 和 React 的寫(xiě)法幾乎是一模一樣的，這個(gè)改動(dòng)不是 Proxy 和 TypeScript，而是支持原生 Class 的寫(xiě)法。你用 Class 來(lái)寫(xiě)，那代碼和 React 寫(xiě)法幾乎是一模一樣的！

import Vue from "vue"class App extends Vue.Component { ?count = 0 ?up() { ???this.count++ ?} ?down() { ???this.count-- ?} ?render() { ???return ( ?????

???????

{this.count}

??????? ??????? ?????

???) ?}}Vue.render(, document.body as HTMLElement)

從上面的討論可以看出，前端三大框架已經(jīng)趨于平穩(wěn)化、標(biāo)準(zhǔn)化，在我看來(lái)未來(lái)是?

二．新技術(shù)和新概念

1、GraphQL 、PWA 、WebAssembly
GraphQL已被GitHub等技術(shù)領(lǐng)導(dǎo)者采用。然而，它并沒(méi)有像一些預(yù)測(cè)的那樣快速地起飛。

據(jù)JS狀態(tài)調(diào)查顯示，只有1/5的前端開(kāi)發(fā)人員使用過(guò)GraphQL，但是有驚人的62.5％的開(kāi)發(fā)人員已經(jīng)聽(tīng)說(shuō)過(guò)它并希望使用它。

PWA和 WebAssembly這兩個(gè)東西，如果你們現(xiàn)在還不懂或者沒(méi)接觸沒(méi)關(guān)系，我會(huì)出一系列教程，我們一起學(xué)，持續(xù)關(guān)注北媽就好。

因?yàn)檫@個(gè)以后，會(huì)越來(lái)越流行，只不過(guò)現(xiàn)在還不重要。

2、各種CLI工具封裝
眾所周知，要跟上最新的庫(kù)，正確配置應(yīng)用程序并做出正確的架構(gòu)決策，這可能會(huì)讓人感到筋疲力盡。

這種痛苦催生了管理工具的CLI包的創(chuàng)建，允許開(kāi)發(fā)人員專注于應(yīng)用程序和業(yè)務(wù)邏輯。

大家熟知和不熟知的流行的框架包括 Next.js（SSR for React），Create-React-App（客戶端React），Nuxt.js（SSR for Vue），Vue CLI（客戶端） -side Vue），React Native的Expo CLI，默認(rèn)情況下使用Angular

3、靜態(tài)站點(diǎn)話題重新興起
隨著JavaScript革命的發(fā)生，每個(gè)人都喜歡學(xué)習(xí)最新最好的圖書(shū)館，但現(xiàn)在事情已經(jīng)解決，我們已經(jīng)意識(shí)到并非每個(gè)網(wǎng)站都需要是一個(gè)復(fù)雜的單頁(yè)面應(yīng)用程序（SPA）。

這導(dǎo)致了靜態(tài)站點(diǎn)生成器的增長(zhǎng)。

三.TypeScript可能是JavaScript的未來(lái)
JavaScript因沒(méi)有靜態(tài)類型變量而受到批評(píng)。試圖糾正這個(gè)問(wèn)題的兩個(gè)主要庫(kù)是TypeScript和Flow，但TypeScript看起來(lái)是最受歡迎的。

事實(shí)上，在Stack Overflow調(diào)查中，TypeScript的評(píng)分高于JavaScript本身，為67％，而最受喜愛(ài)的語(yǔ)言為61.9％。

根據(jù)JS的狀態(tài)調(diào)查，超過(guò)80％的開(kāi)發(fā)人員希望使用TS或已經(jīng)使用它并享受它。對(duì)于Flow，只有34％的開(kāi)發(fā)人員正在使用它或想要使用它。

根據(jù)所有跡象，TypeScript是JS中靜態(tài)類型的首選解決方案，許多人選擇使用普通的JavaScript。在2018年，TS的npm下載數(shù)量大幅增長(zhǎng)，而Flow保持不變。

四．移動(dòng)端

Flutter 是 Google 推出的幫助開(kāi)發(fā)者在 Android 和 iOS 兩個(gè)平臺(tái)，同時(shí)開(kāi)發(fā)高質(zhì)量原生應(yīng)用的全新移動(dòng) UI 框架，和 React-native/Weex 一樣支持熱更新。Flutter 使用 Google 自己家的 Dart 語(yǔ)言編寫(xiě)，剛好今年 Dart 2 也正式發(fā)布，不知道二者之間是否有關(guān)聯(lián)。目前 Dart 主攻 Flutter 和 Web 兩塊，同時(shí)提供了 pub 包管理器，儼然是一門(mén)全新的語(yǔ)言，學(xué)習(xí)成本有些高。反觀 TypeScript 就非常容易被接受，基于 npm 生態(tài)，兼容 ES 語(yǔ)法，因此，2019 年對(duì) Dart 我還是會(huì)持觀望態(tài)度。

除了不喜歡 Dart 外，F(xiàn)lutter 的其他方面都很好，在移動(dòng)端現(xiàn)在強(qiáng)運(yùn)營(yíng)的背景下，支持熱更新是必備能力。

關(guān)于 Weex，一邊罵一邊用，很無(wú)奈的一種狀態(tài)。Weex 本身是好東西，捐給了 Apache，目前在孵化中，會(huì)有一個(gè)不錯(cuò)的未來(lái)。但社區(qū)維護(hù)的非常差，問(wèn)題 issue 不及時(shí)，文檔不更新。如果公司沒(méi)有架構(gòu)組，還是比較難搞定的。

不過(guò)也有很多不錯(cuò)的案例，比如 2018 年優(yōu)酷雙十一活動(dòng)就是使用 Weex 開(kāi)發(fā)的，效果非常不錯(cuò)。通過(guò)自建的可視化活動(dòng)搭建平臺(tái)，能夠非常高效的完成開(kāi)發(fā)，結(jié)合 App 內(nèi)的緩存，整體效果比 H5 好的多。

我對(duì) Weex 的看法是，以前 Weex 只是解決 H5 渲染效率的問(wèn)題，但如今強(qiáng)運(yùn)營(yíng)的背景，使得 Weex 承載了非常多的內(nèi)容，比如動(dòng)畫(huà)、游戲甚至是圖形圖像處理等。可以看到，未來(lái) Weex 還會(huì)戰(zhàn)略性的增加。

更多精彩資訊或者獲取1000集前端視頻可以加我?3252897743