ME! 链滴 搜索 开始使用
   
🎶 Sym - 一款用 Java 实现的现代化社区（论坛/BBS/社交网络/博客）平台

📕 思源笔记 - 一款桌面端笔记应用，支持 Windows、Mac 和 Linux

🎸 Solo - B3log 分布式社区的博客端节点，欢迎加入下一代社区网络

♏ Vditor - 一款浏览器端的 Markdown 编辑器

2016 - 2019 前端现状对比统计

image.png

历史的车轮

每一条线都代表着 2016 到 2019 的数据统计，越往上表示使用的人越多，越往右表示有越多的用户想使用。

从下图可以看出 React、TypeScript、Express、Jest 越来越受用户的青睐。

WX201912212123292x.png

新特性

最让人兴奋的是 JavaScript 做为一种语言并没有停滞不前。从箭头函数到结构，在过去几年中添加的很多重要特性现在已经成为我们编写 JavaScript 的一部分。

{ "color": [ "rgb(65, 199, 199)", "rgb(29, 126, 126)", "rgb(206, 205, 204)" ], "legend": { "data": [ "使用过", "知道", "未使用" ] }, "tooltip": {}, "xAxis": { "data": [ "Destructuring", "Spread Operator", "Arrow Functions", "Proxies", "Async/Await", "Promises", "Decorators", "Maps", "Sets", "Typed Arrays", "Array.prototype.flat()", "Fetch", "i18n", "Local Storage", "Service Workers", "Web Animations", "Web Audio", "Web Components", "WebGL", "WebRTC", "WebSocket", "Web Speech API", "WebVR", "Progressive Web Apps", "WebAssembly (WASM)" ] }, "yAxis": {}, "series": [ { "name": "使用过", "type": "bar", "stack": "one", "data": [ 17864, 18719, 20336, 3601, 18363, 19465, 7883, 14533, 11602, 5768, 5515, 16646, 8476, 17918, 7366, 2886, 4184, 5637, 3398, 2210, 12048, 1528, 620, 9787, 1444 ] }, { "name": "知道", "type": "bar", "stack": "one", "data": [ 19627, 20282, 20791, 11856, 20587, 20543, 15661, 19373, 17893, 13042, 13912, 18958, 16511, 20021, 18388, 13455, 15990, 18090, 17349, 11612, 18926, 11060, 10461, 19017, 16694 ] }, { "name": "未使用", "type": "bar", "stack": "one", "data": [ 1763, 1563, 455, 8255, 2224, 1078, 7778, 4840, 6291, 7274, 8397, 2312, 8035, 2103, 11022, 10569, 11806, 12453, 13951, 9402, 6878, 9532, 9841, 9230, 15250 ] } ] }

JavaScript 语言

概览

下图从满意度对主流语言做了 2016 - 2019 的统计对比，恭喜 TypeScript 再次获胜

{ "tooltip": { "trigger": "axis" }, "legend": { "data": [ "TypeScript", "Reason", "Elm", "PureScript", "ClojureScript" ] }, "xAxis": { "data": [ "2016", "2017", "2018", "2019" ] }, "yAxis": { "type": "value", "axisLabel": { "formatter": "{value} %" } }, "color": [ "rgb(103, 139, 255)", "rgb(255, 104, 239)", "rgb(255, 151, 151)", "rgb(171, 120, 255)", "rgb(255, 201, 73)" ], "series": [ { "name": "TypeScript", "type": "line", "data": [ 83, 85.3, 89.6, 88.9 ], "smooth": true }, { "name": "Reason", "type": "line", "data": [ null, 69.7, 86.7, 78.8 ], "smooth": true }, { "name": "Elm", "type": "line", "data": [ 83.6, 80.8, 73.4, 71.7 ], "smooth": true }, { "name": "PureScript", "type": "line", "data": [ 66.6, 63.6, 72.1, 59.7 ], "smooth": true }, { "name": "ClojureScript", "type": "line", "data": [ null, null, null, 69.8 ], "smooth": true } ] }

分类比对

颜色越亮代表越积极

{ "color": [ "rgb(254, 106, 106)", "rgb(252, 143, 143)", "rgb(65, 199, 199)", "rgb(101, 224, 224)", "rgb(206, 205, 204)" ], "legend": { "data": [ "继续使用", "不再使用", "有兴趣", "没有兴趣", "没听过" ] }, "tooltip": {}, "xAxis": { "data": [ "TypeScript", "Reason", "Elm", "ClojureScript", "PureScript" ] }, "yAxis": { "axisLabel": { "formatter": "{value} %" }}, "series": [ { "name": "继续使用", "type": "bar", "stack": "one", "data": [58.5, 3.5, 4.7, 2, 1.6] }, { "name": "不再使用", "type": "bar", "stack": "one", "data":[7.3, 0.9, 1.8, 1.3, 0.7] }, { "name": "有兴趣", "type": "bar", "stack": "one", "data":[22.3, 18.6, 24.1, 14.9, 9.6] }, { "name": "没有兴趣", "type": "bar", "stack": "one", "data": [11.7, 24.8, 41.9, 49.9, 30.4] }, { "name": "没听过", "type": "bar", "stack": "one", "data": [0.3, 52.1, 27.5, 31.9, 57.7] } ] }

使用经验年限

<1 1~2 2~5 5~10 10~20 >20
TypeScript 1.4% 9.4% 34.5% 33% 18.1% 3.6%
Reason 0.9% 6.8% 32.5% 34.8% 21.7% 3.4%
Elm 0.5% 3.7% 26.4% 40.4% 24.8% 4.2%
ClojureScript 1.6% 5.5% 23.4% 36.2% 28.1% 5.2%
PureScript 3.7% 12.2% 27.5% 32.2% 19.3% 5.1%

使用者薪酬范围

$ 0 0~10k 10~30k 30~50k 50~100k 100~200k >200k
TypeScript 3.6% 5.7% 15.6% 19.6% 31.2% 21.3% 2.8%
Reason 3.9% 5.4% 9.7% 17.8% 31.5% 26.7% 5%
Elm 2.7% 3.4% 7% 16.5% 36.4% 30.1% 3.9%
ClojureScript 4.9% 4.4% 10.1% 15% 30.8% 31.1% 3.8%
PureScript 4.5% 12.9% 18.9% 19.9% 23.4% 16.4% 3.8%

使用者公司规模

雇佣人数 1 1~5 5~10 10~20 20~50 50~100 100~1000 1000+
TypeScript 6.6% 6.7% 6.8% 9.5% 13.8% 11.9% 24.1% 20.7%
Reason 5.7% 7.8% 9.4% 8.8% 15.1% 13.5% 18.9% 20.7%
Elm 6.5% 6.9% 7.7% 9.5% 14.7% 12.6% 22% 20.1%
ClojureScript 5.8% 6.6% 10.5% 8.7% 15.2% 12.9% 20.2% 20.2%
PureScript 7.7% 8.1% 8.4% 10.4% 14.1% 12.8% 20.2% 18.2%

满意程度

2016 2017 2018 2019
3.9 4 4.2 3.9

其他语言或工具

前端框架

概览

{ "tooltip": { "trigger": "axis" }, "legend": { "data": [ "React", "Vue.js", "Angular", "Preact", "Ember", "Svelte" ] }, "xAxis": { "data": [ "2016", "2017", "2018", "2019" ] }, "yAxis": { "type": "value", "axisLabel": { "formatter": "{value} %" } }, "color": [ "rgb(103, 139, 255)", "rgb(255, 104, 239)", "rgb(255, 151, 151)", "rgb(171, 120, 255)", "rgb(255, 201, 73)", "rgb(127, 226, 80)" ], "series": [ { "name": "React", "type": "line", "data": [92.5, 93.1, 90.6, 89.3], "smooth": true }, { "name": "Vue.js", "type": "line", "data": [87.2, 91.1, 91.2, 87.1], "smooth": true }, { "name": "Angular", "type": "line", "data": [67.9, 66, 41.3, 38], "smooth": true }, { "name": "Preact", "type": "line", "data":[null, null, 83.5, 77.8], "smooth": true }, { "name": "Ember", "type": "line", "data": [47, 41.4, 44.6, 30.5], "smooth": true }, { "name": "Svelte", "type": "line", "data": [null, null, null, 87.7], "smooth": true } ] }

分类比对

颜色越亮代表越积极

{ "color": [ "rgb(254, 106, 106)", "rgb(252, 143, 143)", "rgb(65, 199, 199)", "rgb(101, 224, 224)", "rgb(206, 205, 204)" ], "legend": { "data": [ "继续使用", "不再使用", "有兴趣", "没有兴趣", "没听过" ] }, "tooltip": {}, "xAxis": { "data": [ "React", "Vue.js", "Angular", "Preact", "Ember", "Svelte" ] }, "yAxis": { "axisLabel": { "formatter": "{value} %" }}, "series": [ { "name": "继续使用", "type": "bar", "stack": "one", "data": [71.7, 40.5, 21.9, 9.5, 3.6, 6.8] }, { "name": "不再使用", "type": "bar", "stack": "one", "data":[8.6, 6, 35.8, 2.7, 8.3, 1] }, { "name": "有兴趣", "type": "bar", "stack": "one", "data":[12, 34.2, 9.7, 25.6, 14.3, 44.9] }, { "name": "没有兴趣", "type": "bar", "stack": "one", "data": [7.7, 19, 32.4, 37.8, 64.6, 22.6] }, { "name": "没听过", "type": "bar", "stack": "one", "data": [0, 0.4, 0.2, 24.4, 9.1, 24.7] } ] }

使用经验年限

<1 1~2 2~5 5~10 10~20 >20
React 2.3% 11.5% 34.3% 31.3% 17.3% 3.3%
Vue.js 1.4% 10.1% 35.6% 31.6% 17.2% 4.2%
Angular 1.6% 9.8% 36.3% 32.3% 16.3% 3.6%
Preact 0.3% 4% 27.1% 40% 24.7% 3.8%
Ember 0.8% 4.5% 21.4% 40.8% 26.8% 5.6%
Svelte 0.7% 8.2% 32.2% 30.5% 22.9% 5.5%

使用者薪酬范围

$ 0 0~10k 10~30k 30~50k 50~100k 100~200k >200k
React 4.1% 6.6% 15.3% 19% 31.1% 21.4% 2.6%
Vue.js 4.3% 7.3% 17.3% 21.3% 31% 17.3% 1.5%
Angular 3.2% 7.4% 19.6% 20.9% 29.6% 17.3% 1.9%
Preact 3.2% 3% 10% 17.5% 35.9% 26.5% 3.9%
Ember 1.9% 3.3% 8.3% 15.3% 33.2% 33.2% 4.8%
Svelte 5.9% 5.6% 14.2% 19% 32.3% 20% 3%

使用者公司规模

雇佣人数 1 1~5 5~10 10~20 20~50 50~100 100~1000 1000+
React 7.6% 7.2% 7.1% 9.5% 13.2% 11.6% 23.6% 20.2%
Vue.js 8.6% 8.5% 8% 10.9% 14.5% 11.5% 21.6% 16.4%
Angular 5.7% 6.5% 6% 9.4% 13.8% 11.9% 23.9% 22.9%
Preact 7% 6% 6.9% 8.8% 13% 10.2% 24.8% 23.2%
Ember 5.5% 8.5% 7.3% 10.1% 12% 13.2% 19.9% 23.5%
Svelte 10.7% 9.7% 7.4% 8.5% 12.1% 10.4% 21.3% 19.9%

满意程度

2016 2017 2018 2019
3.8 3.8 4.3 4.1

其他框架

数据层

概览

{ "tooltip": { "trigger": "axis" }, "legend": { "data": [ "Redux", "Apollo", "GraphQL", "Relay", "MobX" ] }, "xAxis": { "data": [ "2016", "2017", "2018", "2019" ] }, "yAxis": { "type": "value", "axisLabel": { "formatter": "{value} %" } }, "color": [ "rgb(103, 139, 255)", "rgb(255, 104, 239)", "rgb(255, 151, 151)", "rgb(171, 120, 255)", "rgb(255, 201, 73)", "rgb(127, 226, 80)" ], "series": [ { "name": "Redux", "type": "line", "data": [93.1, 90.9, 82.1, 70.7], "smooth": true }, { "name": "Apollo", "type": "line", "data": [84, 93.9, 92.9, 89.8], "smooth": true }, { "name": "GraphQL", "type": "line", "data": [89.4, 94.2, 94.2, 94.8], "smooth": true }, { "name": "Relay", "type": "line", "data":[69.5, 71.2, 45.8, 53.3], "smooth": true }, { "name": "MobX", "type": "line", "data": [79.1, 78.2, 77.7, 69.5], "smooth": true } ] }

分类比对

颜色越亮代表越积极

{ "color": [ "rgb(254, 106, 106)", "rgb(252, 143, 143)", "rgb(65, 199, 199)", "rgb(101, 224, 224)", "rgb(206, 205, 204)" ], "legend": { "data": [ "继续使用", "不再使用", "有兴趣", "没有兴趣", "没听过" ] }, "tooltip": {}, "xAxis": { "data": [ "Redux", "Apollo", "GraphQL", "Relay", "MobX" ] }, "yAxis": { "axisLabel": { "formatter": "{value} %" }}, "series": [ { "name": "继续使用", "type": "bar", "stack": "one", "data": [47.7, 24.9, 38.7, 2.2, 8.3] }, { "name": "不再使用", "type": "bar", "stack": "one", "data":[19.8, 2.8, 2.1, 1.9, 3.6] }, { "name": "有兴趣", "type": "bar", "stack": "one", "data":[18.5, 36.1, 50.6, 22.5, 23.2] }, { "name": "没有兴趣", "type": "bar", "stack": "one", "data": [11.4, 9.7, 5.9, 21.1, 26.5] }, { "name": "没听过", "type": "bar", "stack": "one", "data":[2.6, 26.5, 2.7, 52.3, 38.3] } ] }

使用经验年限

<1 1~2 2~5 5~10 10~20 >20
Redux 1.7% 10.3% 35% 32.2% 17.5% 3.2%
Apollo 0.7% 8.2% 35.3% 33.1% 18.9% 3.8%
GraphQL 0.9% 9% 33.7% 33.3% 19.2% 4%
Relay 0.5% 2.8% 31.6% 33.5% 29% 2.6%
MobX 0.7% 6.2% 32.6% 36.1% 20.2% 4.2%

使用者薪酬范围

$ 0 0~10k 10~30k 30~50k 50~100k 100~200k >200k
Redux 3.2% 6.1% 15.6% 20.1% 31.5% 21.2% 2.4%
Apollo 2.9% 5.6% 12.5% 18.5% 32.5% 24.8% 3.2%
GraphQL 3.4% 5.6% 12.9% 18.1% 32.5% 24% 3.5%
Relay 4.3% 4.8% 8.7% 17.8% 26.7% 26.4% 11.3%
MobX 2.8% 4.6% 16.2% 18.4% 31.4% 23.2% 3.4%

使用者公司规模

雇佣人数 1 1~5 5~10 10~20 20~50 50~100 100~1000 1000+
Redux 6.2% 6.4% 6.7% 9.5% 13.6% 11.8% 24.9% 21%
Apollo 7.2% 8.1% 7.6% 10.2% 13.8% 11.1% 23% 18.8%
GraphQL 7.7% 7.9% 7.7% 10.3% 13.7% 11.2% 22.4% 19.2%
Relay 5.2% 6.6% 5.9% 9.2% 12.7% 11.8% 20% 28.7%
MobX 5.7% 7.5% 7.9% 10.2% 13.9% 12.7% 23.9% 18.2%

满意程度

2016 2017 2018 2019
3.4 3.5 3.8 3.6

其他数据层

后端框架

概览

{ "tooltip": { "trigger": "axis" }, "legend": { "data":["Express","Next.js","Koa","Meteor","Sails","Feathers","Nuxt","Gatsby"] }, "xAxis": { "data": [ "2016", "2017", "2018", "2019" ] }, "yAxis": { "type": "value", "axisLabel": { "formatter": "{value} %" } }, "color": [ "rgb(103, 139, 255)", "rgb(255, 104, 239)", "rgb(255, 151, 151)", "rgb(171, 120, 255)", "rgb(255, 201, 73)", "rgb(127, 226, 80)", "rgb(43, 229, 255)", "rgb(255, 255, 109)" ], "series": [ { "name": "Express", "type": "line", "data": [null, 92.5, 94.3, 92.6], "smooth": true }, { "name": "Next.js", "type": "line", "data": [null, null, 88.3, 90.5], "smooth": true }, { "name": "Koa", "type": "line", "data":[null, 83.3, 84.8, 80.2], "smooth": true }, { "name": "Meteor", "type": "line", "data":[59.8, 45.3, 37.6, 27.6], "smooth": true }, { "name": "Sails", "type": "line", "data":[null, 36.4, 28.1, 26.1], "smooth": true }, { "name": "Feathers", "type": "line", "data":[60.8, 71.5, 68.5, 52.8], "smooth": true } , { "name": "Nuxt", "type": "line", "data":[null, null, null, 88.5], "smooth": true }, { "name": "Gatsby", "type": "line", "data":[null, null, null, 88.4], "smooth": true } ] }

分类比对

颜色越亮代表越积极

{ "color": [ "rgb(254, 106, 106)", "rgb(252, 143, 143)", "rgb(65, 199, 199)", "rgb(101, 224, 224)", "rgb(206, 205, 204)" ], "legend": { "data": [ "继续使用", "不再使用", "有兴趣", "没有兴趣", "没听过" ] }, "tooltip": {}, "xAxis": { "data": ["Express","Next.js","Koa","Meteor","Sails","Feathers","Nuxt","Gatsby"] }, "yAxis": { "axisLabel": { "formatter": "{value} %" }}, "series": [ { "name": "继续使用", "type": "bar", "stack": "one", "data": [71.6, 24.7, 11.3, 3.6, 2.1, 1.9, 11.3, 22] }, { "name": "不再使用", "type": "bar", "stack": "one", "data": [5.8, 2.6, 2.8, 9.5, 5.9, 1.7, 1.5, 2.9] }, { "name": "有兴趣", "type": "bar", "stack": "one", "data":[12, 43.1, 18.3, 16.8, 9.1, 9.1, 26.7, 35] }, { "name": "没有兴趣", "type": "bar", "stack": "one", "data": [6.2, 15.7, 23.1, 46.5, 29.5, 21.2, 24.4, 17.9] }, { "name": "没听过", "type": "bar", "stack": "one", "data":[4.4, 14, 44.4, 23.5, 53.5, 66.1, 36.1, 22.3] } ] }

使用经验年限

<1 1~2 2~5 5~10 10~20 >20
Express 1.8% 10% 34% 32.1% 18.3% 3.8%
Next.js 1.3% 8.6% 36% 33.9% 17.3% 3%
Koa 0.7% 5.6% 30.3% 35.3% 24.6% 3.5%
Meteor 1.1% 4.7% 28.8% 36.6% 23.4% 5.4%
Sails 1% 4.4% 25.3% 38.3% 26.3% 4.7%
Feathers 0.5% 3.5% 31.5% 35.6% 24.5% 4.3%
Nuxt 1% 8.6% 37.7% 33.2% 16.1% 3.4%
Gatsby 1.2% 10.4% 36.1% 32.7% 16.9% 2.7%

使用者薪酬范围

$ 0 0~10k 10~30k 30~50k 50~100k 100~200k >200k
Express 4.5% 6.6% 14.8% 19.2% 31.5% 21% 2.4%
Next.js 3.8% 5.8% 14.3% 19.5% 32.4% 21.4% 2.8%
Koa 4.2% 5% 14% 17.9% 30.9% 24.6% 3.5%
Meteor 4.9% 4.9% 13.1% 19.1% 31.7% 24.6% 1.6%
Sails 2.8% 5.6% 18% 19.3% 25.1% 24.9% 4.3%
Feathers 4.7% 9.4% 16.6% 18.2% 27.1% 20.4% 3.6%
Nuxt 4.1% 8.4% 19.1% 21.9% 30.2% 14.9% 1.5%
Gatsby 3.7% 5.5% 13% 18.1% 34.7% 22.4% 2.7%

使用者公司规模

雇佣人数 1 1~5 5~10 10~20 20~50 50~100 100~1000 1000+
Express 8.3% 7.6% 7.3% 9.7% 13% 11.5% 22.6% 20%
Next.js 8.1% 7.2% 7.9% 9.5% 13.8% 10.9% 23.3% 19.2%
Koa 7.1% 6.9% 6.7% 9.4% 13.5% 11.6% 23% 21.7%
Meteor 9.6% 8.8% 7.8% 12.8% 14.6% 11.3% 16.7% 18.4%
Sails 5.9% 8.9% 9.1% 10.6% 12.1% 15.1% 19.5% 18.8%
Feathers 12.2% 11.9% 8.1% 9.2% 16.5% 11.1% 16.8% 14.3%
Nuxt 9.5% 10.3% 9.3% 11.6% 14.6% 12.2% 19.3% 13.3%
Gatsby 9.3% 7.9% 8.3% 10.2% 13.9% 10.8% 21.9% 17.8%

满意程度

3.6

其他后端框架

测试

概览

{ "tooltip": { "trigger": "axis" }, "legend": { "data":["Jest","Mocha","Storybook","Cypress","Enzyme","AVA","Jasmine","Puppeteer"] }, "xAxis": { "data": [ "2016", "2017", "2018", "2019" ] }, "yAxis": { "type": "value", "axisLabel": { "formatter": "{value} %" } }, "color": [ "rgb(103, 139, 255)", "rgb(255, 104, 239)", "rgb(255, 151, 151)", "rgb(171, 120, 255)", "rgb(255, 201, 73)", "rgb(127, 226, 80)", "rgb(43, 229, 255)", "rgb(255, 255, 109)" ], "series": [ { "name": "Jest", "type": "line", "data": [58.8, 93.7, 96.5, 96.4], "smooth": true }, { "name": "Mocha", "type": "line", "data": [93.8, 87.3, 82.3, 77.7], "smooth": true }, { "name": "Storybook", "type": "line", "data":[null, null, 89.1, 91.9], "smooth": true }, { "name": "Cypress", "type": "line", "data":[null, null, null, 93.2], "smooth": true }, { "name": "Enzyme", "type": "line", "data":[94.9, 94.4, 88.4, 71.3], "smooth": true }, { "name": "AVA", "type": "line", "data":[85.4, 75, 71.6, 63.4], "smooth": true } , { "name": "Jasmine", "type": "line", "data":[83.3, 79.6, 74.8, 66.9], "smooth": true }, { "name": "Puppeteer", "type": "line", "data":[null, null, null, 89.1], "smooth": true } ] }

分类比对

颜色越亮代表越积极

{ "color": [ "rgb(254, 106, 106)", "rgb(252, 143, 143)", "rgb(65, 199, 199)", "rgb(101, 224, 224)", "rgb(206, 205, 204)" ], "legend": { "data": [ "继续使用", "不再使用", "有兴趣", "没有兴趣", "没听过" ] }, "tooltip": {}, "xAxis": { "data": ["Jest","Mocha","Storybook","Cypress","Enzyme","AVA","Jasmine","Puppeteer"] }, "yAxis": { "axisLabel": { "formatter": "{value} %" }}, "series": [ { "name": "继续使用", "type": "bar", "stack": "one", "data": [61.2, 42, 32.2, 23.8, 23.6, 5.1, 28.6, 24.3] }, { "name": "不再使用", "type": "bar", "stack": "one", "data": [2.3, 12, 2.8, 1.7, 9.5, 2.9, 14.1, 3] }, { "name": "有兴趣", "type": "bar", "stack": "one", "data":[22.8, 22.1, 26, 28.4, 15.7, 8.7, 16.7, 27.2] }, { "name": "没有兴趣", "type": "bar", "stack": "one", "data": [5.1, 15.7, 7.6, 9.1, 12.5, 14, 20.7, 12.5] }, { "name": "没听过", "type": "bar", "stack": "one", "data": [8.5, 8.1, 31.3, 36.9, 38.7, 69.4, 19.8, 33] } ] }

使用经验年限

<1 1~2 2~5 5~10 10~20 >20
Jest 1.1% 8.5% 33.3% 33.7% 19.7% 3.7%
Mocha 0.8% 6.9% 30.5% 34.9% 22% 5%
Storybook 0.6% 6.2% 32.4% 36.1% 21.3% 3.5%
Cypress 0.6% 6.2% 30.5% 36.6% 21.8% 4.2%
Enzyme 0.9% 8.4% 32.6% 34.8% 19.8% 3.5%
AVA 0.3% 3.3% 22.6% 42.8% 26.8% 4.3%
Jasmine 0.5% 5.4% 28.7% 36.1% 24.1% 5.2%
Puppeteer 0.5% 5.6% 30.4% 36.4% 23.1% 4%

使用者薪酬范围

$ 0 0~10k 10~30k 30~50k 50~100k 100~200k >200k
Jest 2.8% 4.7% 13.9% 19.1% 33.2% 23.4% 2.9%
Mocha 3% 4.2% 13% 18% 33.4% 25.5% 3%
Storybook 1.9% 3.2% 12.4% 18.8% 34.5% 26% 3.2%
Cypress 2.1% 3% 11.6% 18.4% 36.2% 25.8% 2.8%
Enzyme 2.1% 3.5% 13.1% 17.9% 33.7% 26.5% 3.1%
AVA 4.8% 5.2% 10.1% 15.1% 33% 27.1% 4.7%
Jasmine 2.4% 3.2% 12.4% 17.8% 34.1% 27% 3.1%
Puppeteer 3.2% 4.3% 13.2% 19.8% 32.7% 23.2% 3.7%

使用者公司规模

雇佣人数 1 1~5 5~10 10~20 20~50 50~100 100~1000 1000+
Jest 5.9% 6.2% 6.5% 9% 13.3% 11.8% 25.2% 22.2%
Mocha 6% 6.7% 6.9% 9.3% 13.1% 11.4% 24.2% 22.3%
Storybook 4.5% 5.1% 5.9% 8.8% 13.6% 12.7% 26.9% 22.5%
Cypress 4.9% 6.1% 6.4% 9.5% 14.2% 12.6% 25.4% 21%
Enzyme 4.5% 4.5% 5.2% 7.8% 12.3% 11.8% 27.7% 26.2%
AVA 8.4% 7.1% 7.9% 9.1% 16.9% 9.4% 21.8% 19.4%
Jasmine 5.1% 5.4% 5.8% 8.6% 13.1% 11.6% 25.5% 24.9%
Puppeteer 7.1% 7.2% 6.9% 9.9% 13.1% 11.1% 22.4% 22.3%

满意程度

2016 2017 2018 2019
3.2 3.2 3.8 3.6

其他测试

移动端和桌面

概览

{ "tooltip": { "trigger": "axis" }, "legend": { "data":["Electron","React Native","Native Apps","Cordova","Ionic","NW.js","Expo"] }, "xAxis": { "data": [ "2016", "2017", "2018", "2019" ] }, "yAxis": { "type": "value", "axisLabel": { "formatter": "{value} %" } }, "color": [ "rgb(103, 139, 255)", "rgb(255, 104, 239)", "rgb(255, 151, 151)", "rgb(171, 120, 255)", "rgb(255, 201, 73)", "rgb(127, 226, 80)", "rgb(43, 229, 255)", "rgb(255, 255, 109)" ], "series": [ { "name": "Electron", "type": "line", "data": [null, 92.8, 87.1, 85.7], "smooth": true }, { "name": "React Native", "type": "line", "data": [91.4, 92.9, 83.8, 82.1], "smooth": true }, { "name": "Native Apps", "type": "line", "data":[84.6, 85.8, 78.9, 77.4], "smooth": true }, { "name": "Cordova", "type": "line", "data":[58.3, 41.9, 34.3, 28], "smooth": true }, { "name": "Ionic", "type": "line", "data":[null, 51, 51.5, 40.6], "smooth": true }, { "name": "NW.js", "type": "line", "data":[null, null, null, 32.6], "smooth": true } , { "name": "Expo", "type": "line", "data":[null, null, null, 73.8], "smooth": true } ] }

分类比对

颜色越亮代表越积极

{ "color": [ "rgb(254, 106, 106)", "rgb(252, 143, 143)", "rgb(65, 199, 199)", "rgb(101, 224, 224)", "rgb(206, 205, 204)" ], "legend": { "data": [ "继续使用", "不再使用", "有兴趣", "没有兴趣", "没听过" ] }, "tooltip": {}, "xAxis": { "data": ["Electron","React Native","Native Apps","Cordova","Ionic","NW.js","Expo"] }, "yAxis": { "axisLabel": { "formatter": "{value} %" }}, "series": [ { "name": "继续使用", "type": "bar", "stack": "one", "data":[25.6, 27.2, 14.2, 8.7, 9.5, 1.5, 14.7] }, { "name": "不再使用", "type": "bar", "stack": "one", "data": [4.3, 5.9, 4.1, 22.3, 13.9, 3.1, 5.2] }, { "name": "有兴趣", "type": "bar", "stack": "one", "data":[45.8, 44.3, 36.7, 10.4, 19, 4.5, 8.2] }, { "name": "没有兴趣", "type": "bar", "stack": "one", "data": [16.8, 21.1, 25.2, 40, 38.6, 15.1, 10.5] }, { "name": "没听过", "type": "bar", "stack": "one", "data": [7.4, 1.5, 19.8, 18.6, 19.1, 75.7, 61.4] } ] }

使用经验年限

<1 1~2 2~5 5~10 10~20 >20
Electron 0.6% 5.9% 30.5% 35.9% 22.3% 4.7%
React Native 1.4% 9.8% 35.2% 32.6% 17.7% 3.3%
Native Apps 0.9% 6.4% 28.9% 34.1% 23.1% 6.5%
Cordova 0.9% 5.6% 25.2% 35.8% 24.2% 8.3%
Ionic 0.8% 6.2% 32% 36.1% 20% 4.9%
NW.js 0% 2.4% 16.7% 41% 35.8% 4.1%
Expo 1.2% 10.3% 38.1% 31.1% 16.9% 2.3%

使用者薪酬范围

$ 0 0~10k 10~30k 30~50k 50~100k 100~200k >200k
Electron 4.8% 5.4% 12.9% 19% 31.7% 22.7% 3.5%
React Native 3.5% 7.3% 15.2% 18.3% 30.5% 22.2% 3.1%
Native Apps 4.3% 5.3% 12% 18.1% 30.4% 25.4% 4.6%
Cordova 3.4% 7.8% 14.1% 20.7% 29.3% 21.6% 3.1%
Ionic 3.2% 8.3% 16.3% 21.7% 28% 19.5% 3%
NW.js 7.1% 6.4% 13.2% 20% 31.1% 20.4% 1.8%
Expo 3.8% 8.2% 13.8% 19.8% 31% 21% 2.5%

使用者公司规模

雇佣人数 1 1~5 5~10 10~20 20~50 50~100 100~1000 1000+
Electron 8.6% 8.6% 8.2% 10.2% 13.8% 10.4% 20.3% 19.9%
React Native 7.4% 8.3% 8.7% 10.5% 14% 11.7% 21.3% 18.1%
Native Apps 7.5% 9% 7.9% 9.4% 13% 11.7% 20.6% 20.8%
Cordova 9% 10.5% 8.9% 11.6% 13.1% 10.5% 18.6% 17.8%
Ionic 7.5% 8.7% 7% 10.5% 12.6% 12.7% 20.5% 20.5%
NW.js 12.7% 9.6% 12% 7.6% 10.7% 14.1% 14.4% 18.9%
Expo 8.2% 8.9% 9.1% 11.3% 13.7% 12% 20.5% 16.3%

满意程度

2016 2017 2018 2019
3.1 3.3 3.6 3.3

其他

其他工具

工具

文本编辑器

浏览器

构建工具

资源

博客和杂志

站点和课程

其他

奖章

最实用的特性

  1. 箭头函数
  2. Promises
  3. 扩展运算符

使用最多的技术

  1. React
  2. Express
  3. Redux

最满意的

  1. Jest
  2. GraphQL
  3. Cypress

最有趣的

  1. GraphQL
  2. Jest
  3. Apollo

最有用的资源

  1. Stack Overflow
  2. MDN
  3. CSS Tricks

预测奖

  1. Svelte
  2. Nest.js
  3. Stencil

往年数据分析

2018 VS 2017 前端使用数据对比
2017 VS 2016 前端使用数据对比
2016 VS 2015 前端大杂烩使用数据对比
2015 前端生态发展回顾

感谢 https://2019.stateofjs.com/ 提供的数据

欢迎注册黑客派社区，开启你的博客之旅。让学习和分享成为一种习惯！

本文由 Vanessa 于 2019-12-22 发布，当前已被围观  592 次，评论 14 次
并被添加 「」「」「」 标签
上一篇
下一篇
推荐阅读
14 评论
ferried • 2019-12-22
回复 删除

V姐牛皮

ferried • 2019-12-22
回复 删除

整体来看 Google的 Angular 呈下降趋势.这是令我很失望的一点......

Vanessa • 2019-12-22
回复 删除

可以放弃了

Eddie • 2019-12-22
回复 删除

angular比较难入门。。一开始的时候有很多概念比较超前。

ferried • 2019-12-22
回复 删除

放弃了就等于承认了自己给公司选型选失败了那包括 cli和package里的东西,转react/vue的话又要重新去搞一下
但相对团队(6)人一组为一个团队吧,可能用Angular相对于React更容易让别人能接手一些

hjljy • 2019-12-23
回复 删除

菜鸡后端，只会jquery

Vanessa • 2019-12-23
回复 删除

黑客派也只用了 jQuery 😄

lizhongyue248 • 2019-12-23
回复 删除

感谢V姐，不过还有个特别想知道的 flutter 没有。。。。

最近在做毕业设计的技术选型，前端都不知道选啥 T T

2501224066 • 2019-12-23
回复 删除

我PHP呢

Vanessa • 2019-12-23
回复 删除

前端使用其他语言排序如下：
Python
C#
.NET
Ruby
PHP
C/C++
Rust
Swift
Java
Dart
Haskell
Scala
Objective-C
OCaml
Go

JssDream • 2019-12-24
回复 删除

看的我热心沸腾的，想转前端了😂

iTanken • 2019-12-24
回复 删除

TS 无敌了

Rabbitzzc • 2019-12-26
回复 删除

V姐，我可以拿来团队分享么huaji

zhou-yg • 2020-01-02
回复 删除

Svelte
非常惊艳的一个框架，没想到可以这么简洁优雅