登录 注册

2016 - 2019 前端现状对比统计

本贴最后更新于 1791 天前，其中的信息可能已经时异事殊

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/ 提供的数据

  • JavaScript

    JavaScript 一种动态类型、弱类型、基于原型的直译式脚本语言，内置支持类型。它的解释器被称为 JavaScript 引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在 HTML 网页上使用，用来给 HTML 网页增加动态功能。

    729 引用 • 1327 回帖
  • 2019
    60 引用 • 464 回帖
  • 数据统计
    4 引用 • 37 回帖
1 引用
酸甜苦辣的 2019 • Vanessa
1 操作
Vanessa 在 2019-12-27 11:35:24 更新了该帖
北京 位置
2 感谢
2 关注
4 收藏
3 赞同
1 引用
1 操作
16 回帖
3
3
3.7k 218 813 643 509 114 2 267 1.1k

相关帖子

16 回帖
2016 - 2019 前端现状对比统计

欢迎来到这里！

我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。

注册 关于
请输入回帖内容 ...
  • someone27889 •
    捐赠者

    V 姐牛皮

  • someone27889 • • 1 评论
    捐赠者

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

    1 回复
    而且据说今年的 NgChina 干货很少...
    someone27889 •
  • Vanessa •
    订阅者 付费者 作者

    可以放弃了

    1 回复
  • Eddie •
    捐赠者

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

  • someone27889 • • 3 评论
    捐赠者

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

    公司都用大家比较熟悉的就好
    Vanessa •
    @Vanessa 大家都喜欢用 Vue....
    someone27889 •
    @ferried so easy
    Vanessa •
  • hjljy •

    菜鸡后端，只会 jquery

    1 回复
  • Vanessa •
    订阅者 付费者 作者

    黑客派也只用了 jQuery 😄

  • lizhongyue248 • • 1 评论
    订阅者

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

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

    Flutter 在其他里面，没有具体的数据统计。什么熟悉就选什么，Flutter 做页面可能还是不太适合
    Vanessa •
  • 2501224066 •

    我 PHP 呢

    1 回复
  • Vanessa •
    订阅者 付费者 作者

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

  • JssDream • • 1 评论
    捐赠者

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

    可以呀
    Vanessa •
  • iTanken • • 1 评论
    捐赠者

    TS 无敌了

    ✌️
    Vanessa •
  • Rabbitzzc • • 2 评论
    捐赠者

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

    拿去花
    Vanessa • • 1
    @Vanessa 完美
    Rabbitzzc •
  • someone1764 • • 1 • 1 评论

    doge express 不是基于 nodejs 吗，怎么把 nodejs 压下去了

    描述有点不正确，已修正
    Vanessa •
  • zhou-yg •

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

  • ghostsf •
    付费者 捐赠者

    🎉 好全面详细啊 👍

请输入回帖内容 ...
Vanessa
我们终此一生，就是要摆脱他人的期待，找到真正的自己。 北京
回帖
8929
 帖子
756
 积分
140708