[轉] 2016 JavaScript 發展示狀大調查

有人認爲JavaScript是最好的語言，有人認爲它一團糟。可按照C++之父的話來說：

世界上只有兩種編程語言：一種是每天被人噴的，另外一種是沒人用的。

不論你喜歡認可與否，JavaScript已經一天比一天火了，甚至火得有點過頭，生態圈太過繁榮，每月均可能有新的相關構建工具、開發框架或者別的什麼庫發佈。若是你想了解更多，請查閱：

你的第一門編程語言應該學什麼？ʇdıɹɔsɐʌɐɾ :ɹǝʍsuɐ

前段時間歪果仁對JS的發展示狀專門作了一個調查，發起者是Sacha Greif（以前本專欄也發過他的一篇文章6周學習計劃，攻克JavaScript難關(React/Redux/ES6 etc.)）。全世界有超過9000名開發者參與了這次調查，內容涉及：

1. 代碼風格（JS預編譯語言）
2. 前端框架
3. 狀態管理
4. API層
5. 全棧框架
6. 測試框架
7. CSS 構建工具/預處理器
8. 構建工具
9. 移動端框架
10. 新特性

以及一些別的JS相關話題的意見和討論。

JavaScript的發展示狀

JavaScript已經逐步發展成爲了一門流行可靠的語言，但與此同時也變得臃腫起來，框架工具之間各類複雜的依賴甚至能讓你崩潰。

對於原本就有選擇恐懼症的你來講更是噩夢：你應該用React仍是Angular 2？你真的須要使用Webpack麼？這個月又有什麼新的處理CSS的解決方案？

我天天也會爲相似的問題頭疼，因此纔有了這個調查，我在2周的時間裏就收到了超過9000份回覆。

代碼風格

總評：

• ES6成爲了新的標準
• CoffeeScript已通過氣了
• 新一波的流行趨勢正在襲來

JavaScript擁有不止一種語法，自2009年CoffeeScript出現後，各式各樣的JS語法，轉編譯語言如雨後春筍般涌現出來：ES6, TypeScript, Elm……

先解釋一下這個統計圖怎麼看，受訪者一共有5種選項：

1. Never heard of it 歷來沒據說過
2. Heard of it, not interested 據說過可是沒興趣
3. Heard of it, would like to learn 據說過，打算學着用用看
4. Used it before, would not use again 用過了，不想再用了
5. Used it before, would use again 用過，而且還會繼續用下去

ES6, CoffeeScript, 和 TypeScript都已經家喻戶曉了，而TypeScript看上去卻並無另外兩個那麼受歡迎。

Elm 和 ClojureScript就不是那麼廣爲人知了，它們還多少侷限在本身獨立的生態體系裏。

雖然ES6尚未正式被瀏覽器兼容，但是絕大多數開發者都已經嘗試過它的語法了。

TypeScript 和 Elm多是由於對普通的JS開發者來講不是特別友好，因此不少人都是抱着想試試的態度卻尚未嘗試過，畢竟對於只知道JS的程序員來講，靜態類型都是很難理解的概念。

前端框架

總評：

• 選擇React準兒沒錯
• Vue愈來愈火
• Angular 2 要比 1 強

框架的優劣常常是人們爭論的焦點。在調查提供的幾個選項中，除了比較新的Vue之外，全部框架基本都是人盡皆知的。

Angular 2 纔剛剛推出，因此它從開發階段到實際應用確定還有個過程。從統計數據上來看，React是毫無爭議的贏家。因爲Vue卓越的性能表現，它在滿意度方面已經排到了第二位。

補錄其餘：

狀態管理

總評：

• Redux 是最火的
• 你們採用的其實仍是Flux的理念

狀態管理逐漸成爲了一種新類型的JS輪子。當前並非對全部的開發者都適用。

Redux顯然是最火了，而做爲Redux第一大替代品的Mobx，仍然有不少人沒據說過。

Redux的開發者Dan Abramov本身也反覆強調過，並非全部的應用都須要使用Redux，等到你真正有相關需求的時候再說。

補錄其餘：

API 層

總評：

• GraphQL 看起來比較有前途
• REST APIs 仍然是最普遍適用的

REST APIs確定就不用說了，你們都在用。Firebase由於它自身實時BaaS(back-end-as-a-service)的特性也算擁有了必定的佔有率（國內的朋友假如你沒據說過Firebase，那你多少應該據說過某狗實時後端雲）。

而近一段時間被炒得火熱的GraphQL，雖然有不少人感興趣，確定還須要必定時間才能發展起來。

補錄其餘：

全棧框架

總評：

• 最主流的是Meteor和MEAN
• 這種「一體化」框架並無那麼受歡迎

Meteor 是全棧框架裏的領導者。與此同時，使用MEAN（Mongo + Express + AngularJS + Node.js）架構的開發者也有不少，而且在滿意度方面它是表現最好的。

除此以外，火起來的還有用React-Redux替代AngularJS的MERN框架。

測試框架

總評：

• 最主流的是Mocha和Jasmine
• 開發者整體上對JS的測試不是特別滿意

CSS 構建工具/預處理器

總評：

• SASS/SCSS是主導
• CSS Modules 值得一試

CSS看上去可能和JavaScript沒什麼關係，可愈來愈多的構建工具和框架中把它們結合到了一塊兒。

CSS自己也像JS同樣，有着不少受人詬病的缺點。因此人們發明了不少CSS預處理器或者工具等等，來擴展優化原生的CSS，例如SASS, LESS, 和 CSS Modules .

關於CSS Modules本專欄以前專門發佈過一個系列入門教程：

• 第一部分：什麼是CSS Modules？爲何要使用它？
• 第二部分：如何上手CSS Modules
• 第三部分：在React中使用CSS Modules

補錄其餘：

構建工具

總評：

• Webpack 和 Gulp最受歡迎
• Grunt 已通過氣了

調查中涉及的每種工具還都算比較主流的。不出意外，只有兩歲的Webpack是最大的贏家（知名度/吸引力/滿意度綜合），Webpack是一種能夠打包構建一切甚至包括你的圖片音視頻一類靜態資源的工具，並且能夠靈活配套各類插件使用。

補錄其餘：

移動端框架

總評：

• 原生應用仍是最主流的解決方案
• React Native 證實了它本身

經過JS來開發移動應用的這種實現纔出現不久，大部分人仍是在採用開發原生App的解決方案。

但原生的弊病是你必須專門爲相應的系統平臺開發，這樣下來就會有很高的成本。

JavaScript提供了一種同時開發iOS/Android平臺應用的解決方案（WP用戶哭暈在廁所）。只掌握前端開發語言的程序員甚至能夠在各類設備上寫App了，愈來愈多的人開始使用這類技術。

React Native在滿意度和受歡迎程度上都是表現最好的。

Cordova 和 PhoneGap 愈來愈不行主要是由於它們的性能實在是個問題。

補錄其餘：

新特性

服務器端渲染

JavaScript 應用的誕生原本就是爲了發揮更多瀏覽器的效用，而不是每次都須要服務器來處理邏輯和數據。

但服務器固然也有它本身的效用。經過服務器端渲染能夠直接把生成好的頁面內容發送到客戶端，由此你能夠提升應用的性能，改善交互，而且也順帶解決了SEO和可訪問性的問題。

服務器端渲染對於一些之內容爲主的站點相當重要，而對於一些須要登陸使用的Web App 而且不擔憂SEO的站點就不是那麼有用了。因此大多數的開發者只以爲服務器端渲染只能算一個Nice-to-have的特性。

Code splitting代碼拆分/按需加載

雖然JavaScript是一個已有十多年曆史的語言，JS應用在工程化方面的發展纔剛剛萌芽。因此絕大多數的應用仍是把打包好的全部代碼直接發給客戶端。

Code splitting 能夠將你的代碼拆分，只在客戶端加載真正須要的使用的代碼，由此能夠極大地提升性能。

Optimistic Updates即時更新

一些複雜的JavaScript應用有着大量的客戶端服務器交互。經過Optimistic Updates技術，客戶端能夠無需等待服務器的響應，直接顯示出交互的結果，以後再處理服務器與客戶端直接不一樣步的數據。

Hot Module Reloading模塊熱重載

Hot Module Reloading指的就是在開發過程當中，你修改代碼以後無需刷新瀏覽器頁面，立刻就能看到改變後的效果。這也是爲何不少開發者大愛這一特性的緣由。

Time-Travel Debugging

Time-Travel Debugging是一種新的調試模式，指的是在調試使用Redux一類狀態管理的應用時，模擬應用在各個不一樣狀態的改變。

Real-Time Operations實時交互

隨着瀏覽器日趨強大，網速日益提高。實時交互的特性會愈來愈廣泛。（例如知乎不用刷新頁面就能夠收到新提醒的這類特性）

Dead Code Elimination冗餘代碼消除

如今，一方面你可讓客戶端按需加載代碼，另一方面，你也能夠直接在構建過程當中無用的代碼。這部份內容其實在本專欄的JavaScript 模塊化入門Ⅱ：模塊打包構建中介紹過。

Progressive Enhancement漸進式加強

JavaScript 的各類特性確實很酷。可是想象一下你的應用若是運行在一個很破的設備或不好的網絡中會怎麼樣。因此咱們就須要一種漸進式加強的設計，先加載你應用最基本最主要的功能，而後再逐步加載完畢。（相似於一些網站提供的基本版/極速版）

特性排名：

觀點

• 如今開發JavaScript有些過於複雜了
  • 經過整個調查咱們很容易就能發現這一點
• JavaScript被過分使用了
  • 網頁中是否過多地使用了JS？這一點JS程序員確定不會贊成
• JavaScript的發展變化實在是太快了
  • 等你剛掌握了Grunt，Gulp火了，等你剛學會Gulp，你們又開始用Webpack了
• 我願意選擇JS做爲我最主要的編程語言
  • JS的名聲一直不怎麼好（在某些人眼裏是無可奈何纔會去使用的語言），但在今天大多數開發者不是由於他們不得不使用JS，而是他們真的願意。
• JavaScript前途一片大好
  • JavaScript虐我千百遍，我待JavaScript如初戀，絕大多數的開發者仍是很看好JS的發展前景的。
• 我很享受用JavaScript開發App
  • JavaScript確實是一門頗有趣的語言
• 這份調查問卷真**長！
  • （哭，我寫的都快累死了！）

附錄：

• 受訪者背景分佈
• 獲取原始數據和結論

我不生產觀點，我只是觀點的搬運工。因此麻煩撕哪一種語言哪一種框架好不要來找我，本文不表明我的意見，雖然我支持React/Vue/Webpack，你們喜歡的我都喜歡。JavaScript是最好的語言，可是我真的不是來和任何人撕的！

我的水平有限，文中包含一些我幾乎沒聽過的術語詞彙，因此還但願有了解的大大可以多多指點指正。

歡迎在評論區參與討論！也能夠推薦你喜歡的JavaScript生態中好用好玩的東西！

 

推薦閱讀

學習方法

• 在2016年如何學習JavaScript？ - 從零學習前端開發 - 知乎專欄
• 6周學習計劃，攻克JavaScript難關(React/Redux/ES6 etc.) - 從零學習前端開發 - 知乎專欄
• 自學前端開發：代碼以外須要關注的問題

 

成功案例

• 科班狗的前端之路
• 非計算機專業出身的我是如何在兩年內成長爲前端工程師的 - 從零學習前端開發 - 知乎專欄

 

若是你想要完整的學習Web開發

• Come on Baby! 你也能夠成爲Web開發工程師！——Web開發工程師徹底成長指南 - 從零學習前端開發 - 知乎專欄
• 如何在一年以內經過自學找到Web開發工做 - 從零學習前端開發 - 知乎專欄
• 前端學習路徑 - 餘博倫的文章 - 知乎專欄
• 2016/2017 Web 開發者路線圖 - 從零學習前端開發 - 知乎專欄

若是你想要免費系統地學習Web開發

全世界學習Web開發的最好方式-FreeCodeCamp學習參考資料 - 從零學習前端開發 - 知乎專欄