【第1162期】2018 要學習的優秀 JavaScript 庫與知識

前端早讀課發表於2018-01-08

前言

關於2017年回顧的文章,也曾分享過幾篇了,當看到這篇的時候想去找找看在2017年初的時候有沒分享過2017值得學習的庫,可惜翻看了只有講到前端工具的趨勢。那2018年有哪些可以學的呢?今日早讀文章由@gy134340翻譯分享。

正文從這開始~

去年,我寫了一篇關於 2017 需要學習的技術 的文章。今年有一些驚喜。

我們致力於回答 “在你投資學習的時候,哪些最高效?” 的問題


640?wx_fmt=jpeg&wxfrom=5&wx_lazy=1
JavaScript 有最多的包,取得壓倒性勝利。

首先,軟體吞噬了世界,web 吞噬了軟體,同時 JavaScript 吞噬了 web。而在 2018 年,React 正在吞噬 JavaScript。

2018: React 之年


React 在 2017 年贏得了人氣之戰。

從 Google 趨勢可以看出,還是有很多開發者基於 Angular 開發:

0?wx_fmt=jpeg

但是 React 持續的贏得使用者滿意度。它迅速增長並遠遠拋開 Angular (以及其他) 框架。

Vue.js 呢? 我聽說它很火

每個人都喜歡口頭上談及相關的替代選項,比如 Vue.js。這是我去年說的:

Vue.js 有很多的 GitHub star 和下載量。如果情況繼續發展的話,它在 2017 年將會表現的很好,但我不認為它會在下一年裡替換 Angular 或者 React。所以在你學習 React 或者 Angular 之後再學習它吧。

Vue.js 在 2017 年表現出色,贏得了很多新聞頭條和人們的興趣。像我所預測的那樣,它沒有趕上 React, 同時我也肯定的說在 2018 年也不會發生。即便如此,它可能在 2018 年超過 Angular:

0?wx_fmt=jpeg

Vue.js 下載量/月

如你所見, Vue.js 正在趕上 Angular 的下載量:


0?wx_fmt=jpeg

angular/core 下載量/月

但是 React 有很強的領先趨勢和與之相同的增長率:

0?wx_fmt=jpeg

React 下載量/月

Vue.js 比 React 增長的更快,那與 2017 年 React 和 Angular 的對比有什麼不同呢?

在 2016 年末,JavaScript 世界準備好迎接新的框架了。Angular 的使用者非常的不滿,React 的使用者則與之相反,許多人想學習 React,很少人願意學習 Angular。在 2017 年年尾,Angular 2 之後的使用者滿意度還是不到一半,只有 49%。

React 和 Vue.js 則是完全不同的情節React 的使用者滿意度更高 (93% 對比 90%)。2017 年早期,從 React 轉向 Vue 的最大的刺激是 React 的開源許可證的問題。Facebook 聽取了使用者的建議後來更改了協議。

在這一階段,我看不到任何跡象可以讓市場從 React 切換到其他的。Vue.js 從 React 手中奪取使用者要比從 jQuery 和 Angular 那裡難的多。

從 Angular 和 jQuery 那裡奪取使用者有很多空間,但是從 React 那裡獲取使用者來獲得持續的增長將會很快碰到瓶頸。

我預測 Vue.js 這種快速的增長只會持續一到兩年,它會在頂部與 React 進行激烈的競爭,然後會停在第二位,除非有大的改變可以打破這個平衡。

職位


jQuery 涼了。

在職位列表中, React 完全取代了 jQuery 之前的位置——這是十年來第一個超越 jQuery 的庫¹。我們看到一個時代的終結。

0?wx_fmt=jpeg

React 取代了十年來 jQuery 第一的位置(來源: Indeed.com)


對比一下去年的圖:

0?wx_fmt=jpeg

jQuery 2016 年是這樣的

有趣的點在於其他庫的增長值大於 jQuery 滑落的值。總的來說,庫相關的職位在去年增長了 10k 或更多。

在職位的增加下,我們還看到平均工資的增長$110k 對比 2016 年的 $93k。通貨膨脹同期保持在2%以下,這也不會過多的影響這一爆炸式增長。

顯然,在 2018 還有是賣方市場。

1. 方法: 職位的搜尋在 Indeed.com 完成。為了增強資料的可靠性,我成對的搜尋 “軟體” 相關的關鍵字擴大相關性,然後乘以大約 1.5 (粗糙的區分那些程式設計工作列表使用 “軟體” 關鍵字和不使用的)。所有相關的都按日期排序記錄相關性,其結果不一定 100% 準確,但是已經足夠用來在此文中表示粗略的度。

框架推薦

在看了今年的資料之後,我強烈用最廣泛使用的 React 來開發應用,包括移動端應用(PWAs, React Native),web 應用,大部分的生產力工具,以及桌面媒體應用(Electron)。

某些明顯的情況下,其他的可能更為適用好:輕量的營銷頁面(完全不需要框架),3D 遊戲,AR/VR。對於 3D 的內容,看看 Unity, Unreal, 或者 PlayCanvas。即便如此,React 也可以作為 3D 內容的 UI 庫。

我強烈不建議轉向其他可以備選的前端框架。這並不是說它們不好,只是它們不是市場上 React 有力的競爭者。記住,這個列表是關於投資回報率,而不是哪一個技術是最棒的。

為什麼對 React 這麼感興趣?


瀏覽 React 的職位列表,我注意到很多本不應該屬於前端工作的有趣的趨勢:

  • React Native (看起來, 這些需求總量比 Vue.js 的還多)

  • React IoT

  • React AR/VR (Oculus Rift 主導需求市場)

  • React 對那些你從來沒聽說的模糊計算


React 已經脫離了它 web 的土壤

靈活性是 React 最大的賣點。不像其他框架,採用 React 並不意味著關注它的資料模型,甚至瀏覽器和 DOM。事實上,我發現不少 React 的工作需求完全沒有提到 JavaScript。

React 提供了基於其標準的豐富的充滿活力的生態系統,這些從 jQuery 統治 web 以來從來沒有看到過。

問題不再是“哪一個框架?”
問題是 “什麼技術可以更好的搭配 React?”

沒有任何事物可以在 2018 改變 React(也許 2019 也是)。你很安全。JavaScript 疲勞漸漸穩定了。我們有了一個偉大的構造應用的框架,同時有著相關的優秀的生態系統。

你應該學習哪些話題?


像去年一樣,你不能錯誤的關注一些要點,但是你應該更加重視 React 應用的函數語言程式設計。

React 有兩點優秀之處:

  • 確定性的檢視渲染

  • 將檢視層從 DOM 操作中抽象出來

確定性通過使用純函式構建應用來實現,這本質上也是函數語言程式設計的定義。

考慮這一點, 這是一些你需要學習的內容:

  • 基礎的 ES6 語法

  • 類的語法和它的各種陷阱 — 可以對 React 元件使用類,但是應該避免繼承你自己的類,避免 instanceof, 避免類的使用者使用 new關鍵字。

  • 函數語言程式設計 和 軟體組成

  • Currying

  • 閉包

  • 純函式

  • Promises

  • Generators和非同步函式

  • TDD

  • RAIL 效能模型

  • Progressive Web Applications (PWAs): 看一下 “Native Apps are Doomed”  “Why Native Apps Really Are Doomed”

  • GraphQL 在 2017 年成熟了很多,非常快速的取代 REST API, Apollo 採用了內建的離線客戶端快取架構讓 Apollo 和 GraphQL 成為 2018 Redux 的一個真正的備選方案(或補充)。


庫和工具


這裡是一些我發現的最有用的庫和工具:

  • React

  • Redux

  • Redux-Saga 管理非同步 IO 分離副作用

  • Next.js — Node 和 Express 的服務端渲染, 自動的分離打包, styled-jsx

  • Material UI

  • Storybook

  • Cheerio 用來做 React 元件的單元測試(相比 Enzyme 我更喜歡它)

  • Lodash (我更傾向於 lodash/fp)。只匯入需要的包避免增大打包體積。

  • Babel: 編譯 ES6 使它在更老的瀏覽器上執行

  • Webpack: 最流行 JavaScript 打包工具,向 kit/boilerplate找一些簡單的樣例來快速的開始。

  • ESLint: 提早檢測語法錯誤和樣式問題,在 code review 和測試驅動開發之外最好的可以減少你程式碼裡錯誤的工具。

  • Ramda— 主要是為了 lenses 和 transducers.

  • Node & Express

  • RxJS: 讓 JavaScript 可觀察,最近我一直在使用 transducers,記著使用 patch imports 來減小包體積。

TypeScript2017 年表現不錯, 但我認為它增加應用的複雜度的弊端大於它的幫助,它的主要缺點是過分依賴註釋而不是介面,同時對高階函式的型別有無法形容的扭曲,我做了一整天的試用,這些情況仍然存在:“靜態型別之祕”  “你也許不需要 JavaScript”。Flow 跟 TypeScript 有相同的問題同時開發者工具也不如 TypeScript 的棒。

2018 技術展望


所有的這些都是 2018 研究與開發領域真實的工作:

  • Progressive Web Apps (PWAs)

  • 區塊鏈與金融科技

  • 醫療科技

  • AR/VR — Hololens, Meta, 和 ODG 現在可以出貨了。 ODG R-9 本來預計 2017 發售但是很有可能放在 2018。MagicLeap 承諾 2018 釋出。AR 將會比過去手機更加改變人們的體驗。

  • 3D 列印

  • AI

  • 無人駕駛

量子計算也將改變世界,但是也許在 2019 或者更晚改變才會開始。目前有在網上工作的量子計算機,但是他們還做的不是很多。現在對於大多數開發者來說開始試驗性生產還太早。微軟最近釋出了它的量子計算程式語言 Q#,IBM  Google 也繼續大量投資自己的量子云計算市場。

如果你想學習量子計算,你也許需要學習 線性代數,同時也有對於量子計算也有一些基於 lambda 演算 的函式式探索。

很有可能,像我們看到的 AI, 雲 API 將會被開發出來讓有不同數學背景的人來更好的利用好量子計算的能力。

2019年的時候,我們在回過頭來看看這篇的內容,會不會有驚訝呢?

最後,為你推薦

【第1154期】2017 年 JavaScript 發展狀況回顧

【第1152期】2017 JavaScript 調查報告概述

關於本文
譯者:@gy134340
譯文:https://github.com/xitu/gold-miner/blob/master/TODO/top-javascript-libraries-tech-to-learn-in-2018.md(掘金翻譯)
原文:https://medium.com/javascript-scene/top-javascript-libraries-tech-to-learn-in-2018-c38028e028e6

作者:@Eric Elliott
校對者:@moods445, @vuuihc


0?wx_fmt=jpeg

你心目中2018年最值得學習的技術是什麼呢?

相關文章