您当前的位置:首页 > 电脑百科 > 程序开发 > 语言 > javascript

2020 全球 JavaScript 调查报告新鲜出炉

时间:2021-01-14 10:22:09  来源:  作者:

千呼万唤的全球2020的JS报告终于出来了。

2020 全球 JavaScript 调查报告新鲜出炉

 

我们来看看这一个糟糕却又不平凡的一年,JS发生了什么样的变化。

2020 全球 JavaScript 调查报告新鲜出炉

 

尽管2020年很糟糕,但 JAVAScript 作为一个整体仍然设法向前发展。随着语言本身的不断改进,得益于诸如可选链操作符空值合并操作符并等新特性,TypeScript静态类型的普及更是将JS带到了一个全新的高度。

框架方面,就在我们认为一切都已解决的时候,Svelte 横空出世以全新方式给前端注入新的血液。 在多年的webpack统治下,甚至构建工具也显示出新活动的迹象。

但是这次的区别是,相对而言,“老”后卫什么都没走。 Svelte和Snowpack很棒,但是React和webpack也很棒。 可以肯定的是,它们最终也会成为JavaScript大流氓的牺牲品,但是不会持续很多年。

所以,让我们享受我们所拥有的: 一个不断变得更好的伟大的生态系统!

访问对象统计

采样对象一共为 20744 位开发者。

2020 全球 JavaScript 调查报告新鲜出炉

 

特性

虽然大多数受访者都知道调查中提到的大多数JavaScript特性,但很多人还没有真正使用它们。

这图表显示了按类别分组的所有特性的不同采用率。外圈的大小对应于了解某项功能的用户总数,而内圈则代表实际使用过该功能的用户。

2020 全球 JavaScript 调查报告新鲜出炉

 

技术现状

2016年 - 2020年 趋势图

每条线从2016年到2020年(粗部为2020)。纵轴越高,表示一项技术被更多的人使用,横轴越大,表示有更多的用户想要学习,或者曾经使用过,还会再次使用。

2020 全球 JavaScript 调查报告新鲜出炉

 

可以看出随着年限的的增长。webpack、Express、TypeScript、Jest、React 可以说是非常强势了。

风味(Flavors)

2020 全球 JavaScript 调查报告新鲜出炉

 

可以看出 TypeScript 依旧独领风骚,其次就是 Elm ,但是 PureScript 也是一个值得关注的增强类型语言。

2020 全球 JavaScript 调查报告新鲜出炉

 

对 TypeScript 的熟悉度一片叫好。

其他工具

2020 全球 JavaScript 调查报告新鲜出炉

 

前端框架

2020 全球 JavaScript 调查报告新鲜出炉

 

正如开头所说,svelte 的出现真的是对前端行业的冲击,原以为三大框架(React、Vue.js、Angular)包揽所有的时候,它出现了,一度成为了第四名(使用量),但是从兴趣度和满意度来看,它未来的潜力不可估量。

兴趣度

2020 全球 JavaScript 调查报告新鲜出炉

 

满意度

2020 全球 JavaScript 调查报告新鲜出炉

 

数据层

2020 全球 JavaScript 调查报告新鲜出炉

 

使用排名比较高的状态管理依旧是Redux、Vuex、Mobx。 数据管理为 GraphQL 和 Apollo,并且 XState 横空出世。

其他工具

2020 全球 JavaScript 调查报告新鲜出炉

 

后端框架

2020 全球 JavaScript 调查报告新鲜出炉

 

Express 依旧是统治地位,而 Next 和 Nuxt 这些服务端渲染的框架也逐渐成为大家的所选的框架。

其他工具

2020 全球 JavaScript 调查报告新鲜出炉

 

测试框架

2020 全球 JavaScript 调查报告新鲜出炉

 

Jest和 Mocha 在使用量上依旧是统治地位,但是新增了 Testing Libray 很强劲。

以下是满意度排行。

2020 全球 JavaScript 调查报告新鲜出炉

 

什么是 Testing Library ?用于 DOM 和 UI 组件测试的一系列工具,主要 API 包含 DOM 查询,更可以和其他测试工具(jest、cypress)配合,用于更多场景(react、vue、svelte)。而它是 React 的官方推荐。

我们推荐使用 React Testing Library,它使得针对组件编写测试用例就像终端用户在使用它一样方便。

----摘自 React 官网(https://zh-hans.reactjs.org/docs/test-utils.html)

打包工具

2020 全球 JavaScript 调查报告新鲜出炉

 

虽然短时间内 webpack 使用量还处于霸主地位,这一年打包工具的发生了巨大的变化。

以下为满意度

2020 全球 JavaScript 调查报告新鲜出炉

 

可以说这里发生了天翻地覆的变化。从 Parcel 到 Snowpack ,再到后来的 esbuild ,每一个都是打包的好手,至于 Vite 为什么没有在其中,我猜想,Vite 最开始只是为了解决 Vue 单个框架的方向,受众面不够广泛(现在它已经支持了多种框架的打包了)。

放张图来看看这些 bundleless 工具的速度吧。

2020 全球 JavaScript 调查报告新鲜出炉

 

其他工具

2020 全球 JavaScript 调查报告新鲜出炉

 

移动和桌面端

2020 全球 JavaScript 调查报告新鲜出炉

 

Electron 依旧是桌面端的第一选择, Cordova 和 React Native 也是移动跨端的热门选择。但是新出的 Capacitor 值得关注。

其他工具

常用的工具函数库有?

2020 全球 JavaScript 调查报告新鲜出炉

 

其他工具函数库

2020 全球 JavaScript 调查报告新鲜出炉

 

JavaScript 运行时选择

2020 全球 JavaScript 调查报告新鲜出炉

 

经常使用那(些)文字編輯器?

2020 全球 JavaScript 调查报告新鲜出炉

 

常用用于开发的浏览器有哪些?

2020 全球 JavaScript 调查报告新鲜出炉

 

资料

常用的 blog 和杂志?

2020 全球 JavaScript 调查报告新鲜出炉

 

关注了哪些网站和课程?

2020 全球 JavaScript 调查报告新鲜出炉

 



Tags:JavaScript   点击:()  评论:()
声明:本站部分内容及图片来自互联网,转载是出于传递更多信息之目的,内容观点仅代表作者本人,如有任何标注错误或版权侵犯请与我们联系(Email:2595517585@qq.com),我们将及时更正、删除,谢谢。
▌相关推荐
1、通过条件判断给变量赋值布尔值的正确姿势// badif (a === 'a') { b = true} else { b = false}// goodb = a === 'a'2、在if中判断数组长度不为零...【详细内容】
2021-12-24  Tags: JavaScript  点击:(5)  评论:(0)  加入收藏
给新手朋友分享我收藏的前端必备javascript已经写好的封装好的方法函数,直接可用。方法函数总计:41个;以下给大家介绍有35个,需要整体文档的朋友私信我,1、输入一个值,将其返回数...【详细内容】
2021-12-15  Tags: JavaScript  点击:(19)  评论:(0)  加入收藏
作者:一川来源:前端万有引力 1 写在前面Javascript中的apply、call、bind方法是前端代码开发中相当重要的概念,并且与this的指向密切相关。本篇文章我们将深入探讨这个关键词的...【详细内容】
2021-12-06  Tags: JavaScript  点击:(18)  评论:(0)  加入收藏
概述DOM全称Document Object Model,即文档对象模型。是HTML和XML文档的编程接口,DOM将文档(HTML或XML)描绘成一个多节点构成的结构。使用JavaScript可以改变文档的结构、样式和...【详细内容】
2021-11-16  Tags: JavaScript  点击:(34)  评论:(0)  加入收藏
一、判断是否IE浏览器(支持判断IE11与edge)function IEVersion() {var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串var isIE = userAgent.indexOf("comp...【详细内容】
2021-11-02  Tags: JavaScript  点击:(39)  评论:(0)  加入收藏
Null、Undefined、空检查普通写法: if (username1 !== null || username1 !== undefined || username1 !== '') { let username = username1; }优化后...【详细内容】
2021-10-28  Tags: JavaScript  点击:(50)  评论:(0)  加入收藏
1、前言async函数,也就是我们常说的async/await,是在ES2017(ES8)引入的新特性,主要目的是为了简化使用基于Promise的API时所需的语法。async和await关键字让我们可以用一种更简...【详细内容】
2021-09-17  Tags: JavaScript  点击:(61)  评论:(0)  加入收藏
为什么要使用 debugger这篇文章将介绍如何使用断点来进行 JavaScript 调试。在读这篇文章之前,需要问一个问题:为什么要使用断点来进行调试?我们首先需要认可使用断点的是必要...【详细内容】
2021-08-26  Tags: JavaScript  点击:(65)  评论:(0)  加入收藏
JavaScript 可以做很多好玩的事, 从复杂的框架到处理API,有太多的东西需要学习。但是,它也能让我们只用一行就能做一些了不起的事情。1. 获得一个随机的布尔值(true/false)该函数...【详细内容】
2021-08-19  Tags: JavaScript  点击:(76)  评论:(0)  加入收藏
JavaScript 提供了大量不同的处理数组的方法,这里花几分钟时间介绍 8 个项目中可以用到的数组方法。1. Array.map()使用.map() 方法,可以创建一个基于原始数组的修订版数组。....【详细内容】
2021-08-19  Tags: JavaScript  点击:(95)  评论:(0)  加入收藏
▌简易百科推荐
1、通过条件判断给变量赋值布尔值的正确姿势// badif (a === 'a') { b = true} else { b = false}// goodb = a === 'a'2、在if中判断数组长度不为零...【详细内容】
2021-12-24  Mason程    Tags:JavaScript   点击:(5)  评论:(0)  加入收藏
给新手朋友分享我收藏的前端必备javascript已经写好的封装好的方法函数,直接可用。方法函数总计:41个;以下给大家介绍有35个,需要整体文档的朋友私信我,1、输入一个值,将其返回数...【详细内容】
2021-12-15  未来讲IT    Tags:JavaScript   点击:(19)  评论:(0)  加入收藏
1. 检测一个对象是不是纯对象,检测数据类型// 检测数据类型的方法封装(function () { var getProto = Object.getPrototypeOf; // 获取实列的原型对象。 var class2type =...【详细内容】
2021-12-08  前端明明    Tags:js   点击:(23)  评论:(0)  加入收藏
作者:一川来源:前端万有引力 1 写在前面Javascript中的apply、call、bind方法是前端代码开发中相当重要的概念,并且与this的指向密切相关。本篇文章我们将深入探讨这个关键词的...【详细内容】
2021-12-06  Nodejs开发    Tags:Javascript   点击:(18)  评论:(0)  加入收藏
概述DOM全称Document Object Model,即文档对象模型。是HTML和XML文档的编程接口,DOM将文档(HTML或XML)描绘成一个多节点构成的结构。使用JavaScript可以改变文档的结构、样式和...【详细内容】
2021-11-16  海人为记    Tags:DOM模型   点击:(34)  评论:(0)  加入收藏
入口函数 /*js加载完成事件*/ window.onload=function(){ console.log("页面和资源完全加载完毕"); } /*jQuery的ready函数*/ $(document).ready(function(){ co...【详细内容】
2021-11-12  codercyh的开发日记    Tags:jQuery   点击:(35)  评论:(0)  加入收藏
一、判断是否IE浏览器(支持判断IE11与edge)function IEVersion() {var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串var isIE = userAgent.indexOf("comp...【详细内容】
2021-11-02  V面包V    Tags:Javascript   点击:(39)  评论:(0)  加入收藏
Null、Undefined、空检查普通写法: if (username1 !== null || username1 !== undefined || username1 !== '') { let username = username1; }优化后...【详细内容】
2021-10-28  前端掘金    Tags:JavaScript   点击:(50)  评论:(0)  加入收藏
今天我们将尝试下花 1 分钟的时间简单地了解下什么是 JS 代理对象(proxies)?我们可以这样理解,JS 代理就相当于在对象的外层加了一层拦截,在拦截方法里我们可以自定义一些个性化...【详细内容】
2021-10-18  前端达人    Tags:JS   点击:(51)  评论:(0)  加入收藏
带有多个条件的 if 语句把多个值放在一个数组中,然后调用数组的 includes 方法。// bad if (x === "abc" || x === "def" || x === "ghi" || x === "jkl") { //logic } // be...【详细内容】
2021-09-27  羲和时代    Tags:JS   点击:(58)  评论:(0)  加入收藏
最新更新
栏目热门
栏目头条