@levinzhang
2020-04-04T08:05:16.000000Z
字数 11692
阅读 812
by
对我们来讲,Web开发始终是一个令人感兴趣的领域,几乎每天都会有新的JavaScript启动。要决定关注哪些项目,忽视哪些项目是非常有挑战性的。即便目前在日常开发工作中可能暂时用不到它们,开发人员也可以从有趣的方法中学习和收集灵感。
在InfoQ,我们会定期更新主题图,以便于展示按照我们的理解不同的主题在技术采用曲线中的位置。在做这件事情的时候,我们会考虑实践的状态,以及我们在网络、聚会、会议、分析师活动中看到的新想法和新事物。我们还考虑了站点的流量模式以及QCon和其他会议上各个演讲的参会人数。
如果某个主题位于图表的右侧,那么你可能会发现在InfoQ上已经有很多相关的内容了,在它们还是新技术的时候,我们对其进行了介绍,创新者和早期采用者所学习到的经验可以帮助指导个人、团队和组织以便于采用这些想法和实践。
曲线左侧的主题是我们认为新兴的技术,正在被创新者和早期采用者所使用,在我们的报告和内容中,主要的关注点在于吸引读者的注意,这样他们就能够自己决定现在是否要对其进行探索,或者是暂时等待并观察它如何进一步发展。
该报告总结了InfoQ的编辑团队目前是如何看待JavaScript/Web开发领域的技术采用情况和新兴趋势的。这是由广泛的内部讨论所形成的一篇带有观点性的文章,讨论的参与者是我们的编辑,他们同时也是活跃的软件工程师,并且参考了内部或私有的调查和分析结果,同时查看了浏览器对核心技术的支持程度,如Web component。
这个月我们将讨论JavaScript和Web开发,因为这个快速变更的行业每年需要不止一次的更新。这是我们在2018年第四季度最后一次回顾时的图表。
2018 Q4的Web开发图表
鉴于JavaScript和Web生态系统已经发生了如此多的变化,将所有的领域放到一张图上已经不现实了。因此,我们将它们细分成了11个主要的领域。
我们对Web开发领域始终是充满兴趣的,几乎每天都有新的JavaScript项目启动。要决定关注哪些项目,忽视哪些项目是非常有挑战性的。即便目前在日常开发工作中可能暂时用不到它们,开发人员也可以从有趣的方法中学习和收集灵感。
2020 Q1的语言/标准/模式
一年一度的ECMAScript发布版本,即ES2020,将会提供自ES2015以来数量最多的新语言特性,包括可选链、BigInt、globalThis、空值合并(nullish coalescing)和动态导入。这些特性都被认为是稳定的,至少有两个现有的浏览器已实现。
PureScript为TypeScript提供了一个替代语言。尽管在最近的JavaScript 2019状态调查中,它的得分很高,但是否能在不久的将来超越创新者的状态,依然还存在争议。
关于早期采用者,我们继续在跟踪Flow(一个面向JavaScript的静态类型检查器)、Elm和Reason(均是JavaScript的替代语言,可以生成基于JavaScript的Web应用)。随着TypeScript的兴起,Flow的吸引力和开发似乎有所减弱,但是我们依然在跟踪它的变化。
从我们上一份报告发布到现在,WebAssembly恐怕是在网上被谈论最多的趋势。WebAssembly应用已经借助WASI将适用范围超越了浏览器端,WebAssembly在2019年底已经达到了稳定的1.0 W3C推荐标准。因此,我们将WebAssembly提升至早期采用者的状态。
除了传统的W3C流程,Web Incubator CG(WICG)不断提出涉及范围广泛的新特性和潜在标准。Web Audio也持续得到了很多的关注,它致力于让Web平台适用于各种音频应用。
在如何最高效地构建JavaScript应用方面,函数式和反应式编程依然是讨论的重点。Vue.js的创始人尤雨溪说到,即便项目要切换至TypeScript,但是”具有讽刺意味的是,我认为TypeScript对我最大的帮助是避免创建类,而不是使用类。Vue 3是一个100%的TS代码库,却没有用到任何类。“
Web component已经从早期采用者转变为早期大众状态。Web components已经达到了主流成熟的程度,现在Chrome、Firefox、Safari以及其他基于这些引擎的浏览器(如Edge和Brave)都对Web component提供了原生支持。许多框架和库也对web component提供了原生支持,包括Angular、Dojo、Ionic、Stencil、Svelte和Vue.js。
我们将两个条目直接加入到了早期大众状态:ES2019和AMP。
在”#smoosh“门争议、Object.fromEntries
以及对字符串和可选catch绑定的一些小改善之后,ES2019为数组添加了flat
和flatMap
方法。这个相对比较小的特性集目前正在被早期大众的JavaScript开发人员所使用。
AMP是一个致力于让Web更加快速的替代方案,它已经加入了OpenJS基金会。尽管到目前为止InfoQ一直拒绝采用它,而是更加倾向于使用现有的开放Web标准,但是有些人在持续采用AMP,它主要适用于媒体和新闻Web站点。
随着JavaScript生态系统的成熟,有一些处于后期大众状态的基础技术并没有表现出被替代的迹象,而且几乎每个JavaScript开发人员都在使用它们。
HTML5和ES6/2015 - ES2018均处于后期大众状态,因为现在几乎每个Web应用都将这些特性作为基础。
TypeScript也进入了后期大众状态。到目前为止,TypeScript是应用最广泛的JavaScript变体,在过去的几年中,它取得了长足的进步,现在大多数的JavaScript框架都利用了它的工具和基础设施。根据最近的GitHub Octoverse报告,TypeScript位列十大语言之一,JS状态调查将TypeScript列为目前使用最广泛的JavaScript变种,超过50%的受访者说他们在使用TypeScript,并对JavaScript的超集持积极态度。
我们用落伍者结束这一部分的报告,虽然它们依然用在了很多的应用中,但是新的开发工作对它们并没有太大的兴趣。尽管ES5和HTML4所包含的底层特性依然能够在最新版本的JavaScript和HTML中找到,但是更新的版本已经取代了ES5和HTML4。
JavaScript客户端框架和库领域在不断变化,虽然最近几年React、Vue和Angular占据了主导地位,但是新一波的精简框架和应用编译器可能会在未来几年内改变现状。
2020 Q1的客户端框架/库
在本报告发布的时候,Vue.js尚未发布,但它是使用TypeScript重写的Vue,非常值得期待。
Dojo在其确定的道路上继续发展,那就是交付精益的、TypeScript优先的框架,目前它的版本是6,不久将会发布版本7。在构建反应式Web应用方面,Dojo提供了一个非常现代高效的方式,并对TypeScript和开发人员工程学提供了特别好的支持。Dojo目前是OpenJS基金会的一部分。
Ember最近发布了Ember Octane,提供了一个新的组件模型和反应式系统。
LitElement是Polymer的继承者,提供了创建轻量级web component的JavaScript库。
Aurelia依然有一批忠实的追随者,继续致力于创建一个用来构建基于组件的应用环境。
Marko是另外一个OpenJS基金会项目,最初起源于eBay,主要关注点在于创建反应式UI组件。
腾讯的Omi是一个跨框架的组件创建库,支持将web component、JSX和其他组件方式集成到一个统一的库中。
有三个项目首次进入早期大众类别中。
Ionic的Stencil已经成为最流行的web component创建框架,与Omi类似,它是一个用来跨多个框架创建组件的框架。
Svelte已经成为一个流行的React替代方案,这样归功于它保持了与HTML的一致性,它的使用方式使其成为一个让人感受不到其存在的框架。
Preact是一个很小的React替代方案(压缩后小于4KB),其API与React库是一致的。
Angular已经到了后期大众状态,在本报告撰写的时候,Angular 9处于发布候选版本,该版本最终会发布备受期待的Ivy渲染引擎更新。
Vue.js 2也到了后期大众状态,如今它已经成为最广泛使用的JavaScript框架。
React依然是最流行的JavaScript渲染库,并且在我们上次的报告之后进行 hooks等方面的更新。
RxJS依旧是一个流行的反应式扩展库,在Angular生态系统中得到了广泛应用。
Moment也是OpenJS基金会的一部分,在管理日期和时间等问题时,它依然是应用最广泛的库。
虽然对Lodash(OpenJS基金会)这种库的需求在减少,但是在与JavaScript协作时,它依然是应用很广泛的库。在与现代JavaScript协作时,Core-js也是一个广泛使用的库。
Dojo 1.x和Angular 1.x虽然还在广泛部署,但是它们已经处于维护模式。jQuery虽然得到了一些改进,但基本上已经被新的HTML和JavaScript特性或更成熟的框架所取代。
最近,JavaScript的服务器生态系统引起了人们很大的兴趣。一项重要的创新就是向服务器端渲染、静态预渲染和构建时渲染转变,以减少JavaScript在客户端的工作负载,在这个过程中不需要改变如今应用所使用的反应式编程模型。
服务器端、API和客户端之间的界限变得越来越模糊,所以这个类别还包含了静态生成、数据、状态管理和API等方法,这些方法通常是在客户端和服务器端所共享的。
2020 Q1的服务器端/框架/数据/API
Deno已经接近1.0发布版本。它是由Node.js最初的作者Ryan Dahl创建的,Deno致力于创建一个TypeScript版的Node.js替代方案。
Dojo添加了一个构建时渲染方式,这样的话,它就可以在应用构建的时候利用Node.js的特性,从而为静态站点的生成提供一系列的功能。与其他方案相比,Dojo的方法运行在组件级别,为关键模式和特性代码块提供了高度可重用的方式。除此之外,Dojo stores提供了一个可预测的、一致的状态容器,内置了对常见状态管理模式的支持。
Hasura是创建GraphQL服务器的开源方案之一。按照JS 2019新星状态报告,在2019年,人们对Hasura兴趣得到了显著增长。
最初创建Express的团队开发了一个名为Koa的Node.js框架,该框架持续吸引着人们的关注。
Nuxt是一个Vue框架,它提供了服务器端渲染、静态站点生成和单页应用功能。
Strapi和Storyblok是两个开源的headless内容管理系统。如今随着组织努力使用反应式和基于组件的架构提供现代化的内容管理方案,这一领域引起了极大的兴趣。
Apollo仍然是GraphQL方面的流行方案,它最初来源于Meteor框架。
Nest.js是一个使用TypeScript编写的Node.js框架,因为其支持全栈TypeScript开发的各种选项和特性,它的受欢迎程度在不断上升。
Next.js是一个面向React应用的服务器端框架,它支持服务器端渲染、静态站点生成等功能。
Gatsby能够利用GraphQL从各种源获取数据,并为基于React的应用提供了高效的渲染方案。
Fastify是一个OpenJS基金会项目,作为一个高性能的Node.js Web框架,目前它是替代Express的新兴方案。
MobX是除Redux之外的另外一个状态管理方案,它正被越来越多的人所采用。
到目前为止,Node.js依然是在服务器端运行JavaScript的最流行方案,也是像Electron这种环境的基础,借助该环境,我们可以使用Web技术创建桌面应用。Node.js是OpenJS基金会的项目。
Express依然是使用最广泛的Node.js Web框架,它也是OpenJS基金会的项目。
尽管REST依然是创建API的最流行方式,但是GraphQL也得到了相当广泛的采用,它是一种基于查询的方案,能够取代将所有的API端点预先定义好的方式。对于组织来讲,在API中同时使用REST和GraphQL也是很常见的。
Redux依然是JavaScript应用中进行状态管理的最流行方式,不过在小型或简单的应用中,它使用得比较少。
现在有很多方案可以帮助Web工程师创建和部署基于云的应用。
云
Architect是一个OpenJS基金会项目,支持创建serverless的JavaScript、Python和Ruby应用。
AWS Amplify提供了一个使用AWS构建移动和Web应用的开发平台。
在快速部署Web应用方面,Netlify是最流行的可选方案之一。
Azure的JavaScript SDK越来越受欢迎,这很大程度上是因为其灵活的IoT和认知服务(Cognitive Services)API。
AWS Lambda在运行serverless JavaScript函数方面越来越受欢迎。
Zeit Now凭借其静态和JAMstack部署、Serverless函数和全球CDN,现在已经成为部署Web应用的流行方式。
Google Cloud Functions为Google云提供了运行serverless JavaScript函数的方法。
Firebase是Google提供的另外一个方案,提供基于云的移动和Web基础设施。
在JavaScript和Web开发中,打包(Bundling)、包管理以及应用的整体优化依然是重要的话题。
2020 Q1的包管理/打包/优化
pika致力于为JavaScript提供一个工具,将其构建和部署到ES模块支持的环境中。
Entropic是一个npm的替代方案,目前还处于早期阶段,它采用了一种更为分布式的方式来实现包注册,而不是使用单个联合注册器。
Parcel是一个越来越流行的web应用打包器。在撰写本报告的时候,Parcel 2已经准备好发布了。
webhint是一个OpenJS基金会项目,它是linting工具的补充,可以提高可访问性、速度和跨浏览器兼容性。
Prettier是一个带有偏好的代码格式化器,它终结了JavaScript开发中关于代码格式化的大部分争论。
ESLint是另一个OpenJS基金会项目,它提供了一种丰富的方式来查找JavaScript应用程序中的错误和反模式。TSLint作为一个独立的产品已经被弃用,现在它是ESLint之上的一个扩展。
Esprima是一个广泛使用的ECMAScript解析器,用来帮助处理抽象语法树,它也是OpenJS基金会的一部分。
Yarn是一个替代npm的包管理器,它利用了npm的包注册表。
Rollup是由Svelte团队的一些成员创建的ES模块打包器。Rollup更广泛地用于库和模块,而webpack更广泛地用于应用。
NPM是JavaScript领域事实上的包管理和注册表标准。npm在2019年遇到了很广泛的争议,在不久的将来,生态系统可能会寻找替代方案。
webpack是JavaScript生态系统中使用最广泛的打包器和代码优化器。
Babel提供了一个JavaScript转换器(transpiler),允许开发人员在开发的过程中使用更新的特性,但是在生产环境可以使用更陈旧的变种形式。Babel最近添加了TypeScript转换的功能,不过它还没有提供类型检查,因此用处有限。
Lighthouse是由Google创建的一个广泛使用的自动化工具,用来提升代码质量和性能。
在JavaScript中有许多用于编写和运行测试的可选方案。为了简单起见,在这里我们排除了对Chai、Sinon、Jasmine、QUnit、Cucumber和其他类似库的分析,这些库提供了非常有用和流行的测试功能,但是我们会继续跟踪这些库和许多其他测试解决方案的进展。
2020 Q1的测试和自动化
Playwright是一个新发布的Puppeteer替代方案,用于浏览器自动化和测试。但是与Puppeteer不同的是,Playwright面向所有现代浏览器渲染环境。
基于机器学习的测试是自动化测试生成的新兴领域。试图解决该问题的公司并不鲜见,包括Applitools、SauceLabs、Testim、Sealights、Test.AI、Mabl、ReTest、ReportPortal等等。该领域目前还没有明确的正确答案,但是我们期待在不久的将来会有所改变。视觉人工智能测试(Visual AI testing)也是代替传统可视化回归测试的新兴方向。
Appium是一个适用于原生、混合和移动Web应用的自动化测试框架,它使用了起源于Selenium的W3C WebDriver协议。Appium是一个OpenJS基金会的项目。
Intern是一个使用TypeScript编写的OpenJS基金会项目,适用于单元测试、功能测试(通过WebDriver或其他像Puppeteer、Playright这样的环境来实现)、集成测试、性能测试和其他类型的测试。
Ava是一个适用于Node.js应用的流行测试运行器。
WebdriverIO是一个OpenJS基金会项目,它基于WebDriver协议提供了一个功能性和集成测试环境。
Cypress是一个运行在基于Chromium的浏览器的端到端测试运行器,迅速得到了广泛的欢迎,它最近添加了对Firefox和Edge的支持。
Storybook是一个测试框架,也是一个设计系统,还是用来创建、测试和共享UI组件的开发环境。
Jest是一个由React生态系统推广的测试框架,可能是如今使用最广泛的测试断言库。
Mocha是一个OpenJS基金会项目,提供了简单易用的单元测试库。
对于Angular应用的测试来讲,Karma和Protractor依然是最流行的方式。
WebDriver是起源于Selenium项目的协议,它依然是实现完整测试自动化的最常见方式。
Puppeteer是一个只支持Chromium浏览器的自动化方案,在很多方面它都比Selenium更易用,但是它的功能和支持的浏览器都比较受限。
利用Web技术来构建移动和桌面应用在流行程度和可选方案方面都在不断增长。
2020 Q1的移动/桌面环境和框架
Ionic Capacitor是Cordova的替代方案,在使用Web和原生技术创建混合应用时,它能够提供更细粒度的控制。
NativeScript为使用Web技术的Angular和Vue.js应用提供了原生应用编译功能。
Ionic 4+提供了一个构建应用的框架和组件库。最初它是一个Angular框架,但是现在Ionic是框架中立的,支持React和其他框架。
React Native允许开发人员利用React应用程序中的Web技术和模式创建原生应用程序。React Native和其他类似的解决方案到目前为止褒贬不一,因为它们在有些场景中工作良好,但在使用上仍然具有挑战性。
Electron是一个OpenJS基金会项目,它通过嵌入Chromium和Node.js的方式允许使用Web技术来创建桌面应用。我们所使用的很多应用程序都用到了Electron,比如Slack。
在创建混合移动应用方面,Cordova依然是广泛使用的环境,但是在不久的将来,它有沦为落后者的风险。
在IoT、区块链和机器学习等新兴领域,Web技术的可选方案在不断增加。
2020 Q1的IoT、区块链和机器学习
ml.js为JavaScript开发人员提供了用途广泛的机器学习工具。brain.js提供了JavaScript上的GPU加速神经网络支持。对于JavaScript开发者来说,尽管TensorFlow.js依然是使用最广泛的机器学习基础方案,但是这两个库提供了很有前景的替代方案。
Neurosity有一个开发者预览阶段的Notion方案,这是一个现代的思维计算和脑波测量设备。Neurosity与其他替代方案的不同之处在于它的JavaScript API。
Moddable 和JerryScript是IoT项目的轻量级ECMAScript引擎。JerryScript是一个OpenJS基金会项目。
Node-Red也是OpenJS基金会的一部分,它为IoT领域常见的事件驱动应用提供了低层级的编码支持。
johnny-five是由Bocoup推出的一个很受欢迎的JavaScript机器人和IoT平台。
interledger.js是Interledger协议的JavaScript实现,该协议是一个适用于账本、区块链和加密货币的标准集,独立于具体实现。本项目是OpenJS基金会的一部分。
TensorFlow.js是由Google推出的,目前是应用最广泛的JavaScript机器学习包。
在JavaScript中,增强现实、虚拟现实和混合现实(mixed reality)正变得越来越受欢迎。
除了d3和Three.js之外,在众多项目中,数据可视化、图表以及其他方式的可视化和渲染是高度分散的。
2020 Q1的可视化/XR
React 360以类似React的方式为开发人员提供了混合现实体验。
WebXR 1.0推荐标准终于快定稿了,剩余的工作是定义增强现实标准。
BablyonJS为JavaScript和TypeScript开发人员提供了3D可视化和API来创建沉浸式游戏。
Three.js是一个WebGL之上的低层级API,用来在浏览器中绘制3D图形。
A-Frame最近发布了其1.0版本,初步支持了WebXR推荐标准。A-Frame提供了基于DOM的方式来包装Three.js和原生WebXR功能。
pixi.js是另外一个WebGL抽象框架,为游戏开发提供了基本元素。
如今,d3是应用最广泛的数据可视化库。
CSS和设计领域在过去的几年里有了很广泛的创新,在很大程度上来讲,与5-10年前编写的CSS已经完全不同了。
2020 Q1的CSS
算法CSS(Algorithmic CSS)是一种借助内置的CSS算法构建可组合布局的新兴方式。
CSS Houdini是一种新兴起的方式,它能够通过CSS对象模型(CSS Object Model,CSSOM)挂钩到浏览器的渲染引擎中,从而可以访问CSS引擎以便于扩展CSS。
Typed CSS是Dojo和其他一些方案所采取的方式,它能够为TypeScript安全地提供CSS模块,从而在组件开发中实现高效且精准的样式。
Ant Design是现代组件使用和开发中几个流行的设计系统之一。
TailwindCSS借助PostCSS提供了一个低层级的CSS框架。
对于组织和项目来说,设计系统(Design Systems)正在成为一种流行的方式来统一设计标准和组件库,进而能够保持一致性并鼓励重用。
在Web站点和应用中,CSS Grids正在成为管理网格布局的广泛采用的CSS特性。
PostCSS是CSS预处理的替代方案,它与Babel的作用比较类似,会将新的CSS语法转换成生产环境所支持的语法。
CSS-in-JS主要是在React生态系统中流行的一种模式,用于在组件中编写内联CSS。更好的CSS-in-JS实现会将内联CSS转换成单独的CSS文件,以便于在生产环境实现更快的渲染。
Material Design是第一个大型的开源设计规范和系统,在很多框架和项目中都非常流行。
Linaria是在CSS-in-JS中广泛采用的一种方式。
响应式设计的诞生来源于在手机、平板电脑和台式电脑上扩展应用程序的需要,一直以来都是设计应用程序的主流方法。响应式设计鼓励采用更加矢量驱动的方式,在过去的十年里,世界上绝大多数公司都更新了他们的Logo和设计标准,以支持响应式原则,该原则不仅适用于软件应用,而且也适用于物理世界。
CSS Flexbox是一个广泛用于应用程序布局的模型。
SASS仍然是最流行和广泛使用的CSS预处理器。
JavaScript和Web开发所需的IDE和代码编辑器在灵活性和特性方面在持续得到改善。基于Web的IDE在传统特性和协作能力方面变得越来越强大。
2020 Q1的代码编辑器和IDE
StackBlitz是一个云托管的在浏览器中使用的IDE,它提供了很多的特性,在几年前这些特性还只能在桌面端IDE中才能实现。
CodeSandbox是使用最广泛的云托管IDE,通常被描述为浏览器中的VS Code。
VS Code项目在一开始因为起源于微软而被忽视,但是在短短几年内就成为了JavaScript和TypeScript生态系统中使用最广泛的IDE。
WebStorm依然是创建Web应用时使用最广泛的商用桌面IDE。WebStorm和IntelliJ来自同一个项目家族,从Java进入JavaScript领域的工程师经常会使用IntelliJ。
vim和emacs仍然是流行的代码编辑器,不过它们都可以通过一系列的扩展和工具转换成IDE。大多数vim和emacs的铁粉已经在熟悉程度和效率方面积累了多年,他们不太可能转向其他编辑器。
随着微软对GitHub的收购,一些人期望Atom能够被合并到VS Code中,但目前它们仍然是独立的项目。Atom和VS Code的桌面环境都使用了Electron。
Sublime Text仍然是很多人在使用的编辑器,不过随着最初的Atom以及最近的VS Code的出现,Sublime Text的受欢迎程度在持续下降。
JavaScript和Web生态系统正在蓬勃发展,尽管跟上变化的速度可能很具有挑战性,但我们相信这个领域中的许多基础部分已经变得比较稳定,这也在其他的领域为创新者提供了机会。InfoQ的团队将持续为您提供JavaScript和web领域的专家报道,我们欢迎您的反馈、评论并贡献外部的文章。
查看英文原文:JavaScript and Web Development InfoQ Trends Report 2020