Choosing a development tool based on its popularity isn’t a bad idea. Popular tools are usually more stable, and they often have more resources and community support than less popular tools. Developer satisfaction is another key indicator of a good tool, and for the JavaScript ecosystem, I'm going to show you some significant research on both of these criteria.
The list that follows contains all of the main tooling categories for a modern JavaScript developer. It includes the most popular tools for each category according to developer popularity and user satisfaction.
Each section reveals the most popular tool for that category and a runner-up, along with some context and citations from a few major JavaScript community surveys to prove each's popularity. You should have plenty of community support if you choose to use any of these tools and technologies.
Language flavor
Most popular: ES5-based JavaScript
Runner-up: ES6 (ECMAScript 2015)
Recent versions of Safari, Edge, Firefox, and Chrome all have above 90% support for ES6, the new JavaScript standard. Although there are still more developers that use ES5-based JavaScript, that’s to be expected. Organizations are often slow to move to new language standards.
But ES6 will take over the top spot in 2017 as the annual releases of ECMAScript keep coming, and developers are more motivated to keep up. The State of JavaScript 2016 survey shows that nearly all of the developers who haven’t used ES6 are interested in learning it soon.
Front-end frameworks
Most popular: React
Runner-up: AngularJS 1.x
The JavaScript community is fickle, and has been surprisingly quick to abandon relatively new tools in order to gather around even newer tools that have stronger technical merits.
Five years ago, Backbone.js was the most popular framework for front-end JavaScript development. One year later, Google’s AngularJS took the crown. Then React, the brainchild of Facebook, surpassed AngularJS. That happened around the same time that Google introduced changes in AngularJS 2 that made it no longer backward compatible with version 1.
While React has the lead among JavaScript-focused developers, AngularJS maintains a strong lead among Java developers and among .NET developers. Interestingly, .NET developers tend to stick to their ecosystem’s vendors—they’re more likely to use TypeScript (a Microsoft creation) and NativeScript (a JS flavor from Telerik, a company that got its start as a .NET tooling vendor).
The State of JavaScript 2016 survey has a heatmap that confirms this Angular/TypeScript group, as well as an ES6/React stack group, and a plain JS/Backbone.js, or no framework group.
I did not include jQuery in this section, since it’s more of a library for unobtrusive JavaScript, and it doesn’t do the same things as React and AngularJS. jQuery is still widely used among existing web applications, but it’s less necessary for modern JavaScript front ends used in modern applications.
Task runners
Most popular: Gulp
Runner-up: Grunt
Task runners are the build tools for JavaScript applications. They automate tasks such as minification, unit testing, linting, compilation, starting servers, and other file modifications. For a while, Grunt was the most popular task runner as part of the Yeoman scaffolding, which made setting up various JS projects easy.
Now Gulp has passed Grunt in popularity, and Grunt is unlikely to recover. While many JavaScript developers have used Grunt, the State of JavaScript 2016 survey shows that most of the developers who have used Grunt don’t want to use it anymore. Among developers who haven’t used Grunt, most aren’t interested in learning it.
Module bundlers
Most popular: Webpack
Runner-up: Browserify
Webpack and Browserify also can preform the tasks of a task runner, but here they’re in a different section because they're primarily known as module bundlers. Module bundling is like a build process in which a group of modules and their dependencies get bundled into a file, or group of files. The demand for module bundlers is growing as JS developers break down more application functions into modules, creating a more resilient, loosely-coupled architecture.
In 2015, 46% of respondents in the State of Front-End Tooling used a module bundler in their workflow. In 2016, that number jumped to 68%. Most of that growth was due to Webpack, which was used by 41% of respondents, making it the clear leader over other module bundlers such as Browserify, which was used by 11% of respondents.
Package managers
Most popular: npm
Runner-up: Yarn
2016 was the year that Yarn emerged onto the scene as a new alternative client for the Node.js package registry. npm remains the default package manager for Node.js, but extreme growth is expected for Yarn. It seems to be on track to be the preferred client to the Node.js registry due to its performance, which is several times better than that of npm.
For now though, npm remains the de facto package manager for JavaScript, although it’s not the only game in town. Ryan Lewis, a Node.js committer, recently presented on the future of Node.js at the All Things Open conference. During the event, several developers asked whether the Node.js Foundation might make Yarn the new standard interface for the Node.js package registry.
His answer: "Probably no,” since the foundation doesn’t want to do anything that might fragment the ecosystem. So while Yarn was talked down in a recent foundation meeting, the members did express interest in its performance gains. Lewis says a more likely outcome is that npm will begin incorporating Yarn’s features and remain the default path to the Node.js package registry.
Testing frameworks
Most popular: Mocha
Runner-up: Jasmine
Almost half of developers don’t use testing in JavaScript, according to the State of Front-End Tooling 2016 survey. The State of JavaScript 2016 survey has similar conclusions, showing that many developers aren’t satisfied with the state of JavaScript testing. However, interest and satisfaction with Mocha and Jasmine are growing, and Mocha only has a slight edge on Jasmine. Also, new JS testing frameworks such as Enzyme and Tape show promise for helping to build a more vibrant JS testing ecosystem.
Mobile frameworks
Most popular: Native apps
Runner-up: Apache Cordova
While native apps still provide the most performant experience on mobile devices, some members of the JavaScript community believe that the emergence of Progressive Web Applications (PWAs) spells doom for native apps and the frameworks like Cordova that enable web-native mobile apps.
Maximiliano Firtman, author of High Performance Mobile Web, says PWAs will mean “the beginning of the end for most WebView-based apps, such as Apache Cordova and PhoneGap apps.”
So while these are the frontrunners for JS mobile frameworks for the moment, expect React and AngularJS to be here next year, when they will likely be the tools of choice for PWAs.
Linting tools
Most popular: ESLint
Runner-up: JSLint
Linting is a form of static code analysis that involves using an opinionated tool to prevent errors or usage of the “bad” parts of a language. Linting became popular in JavaScript when Douglas Crockford’s watershed book, JavaScript: The Good Parts, was published. JSLint is a linting tool based on the advice in that book.
While ESLint now takes the top spot because of recent upgrades to ECMAScript, JSLint still maintains a userbase. However, the second most popular answer for “What tool do you use to lint your JS?” was none. Almost one quarter of respondents don’t use a linting tool.
CSS preprocessors
Most popular: Sass/SCSS
Runner-up: LESS
While CSS preprocesors aren't technically JavaScript tools, few JS developers don’t have their hands in CSS and HTML once in a while. As with linting tools, the second place winner in The State of Front-end Tooling 2016 for CSS preprocessors was none of the above: 13% of respondents didn’t use one. The runaway favorite for those who do, however, was Sass/SCSS, cited by 63% of respondents.
Editor
Most popular: Sublime Text
Runner-up: Atom
JavaScript developers don’t usually prefer a sophisticated IDE, as most Java and .NET developers do; lightweight text editors with a plugin system and syntax highlighting are all that most JS developers want. These are essentially the main features that Sublime Text and Atom have.
Watch this space
For more on these trends, be sure to read The State of JavaScript 2016, The State of Front-End Tooling 2016, and the Trending tech section of the Stack Overflow Developer Survey 2016.
But remember, the JS ecosystem moves fast, so keep an eye on this list as it’s updated. Another framework or library could come out of nowhere, and suddenly everyone will be using it and tossing aside their old tools. Alternately, some of the best features of these tools and frameworks may be assimilated into JavaScript itself. Just look at all of the functions from jQuery that are now part of ES5, or the module importing and exporting from Require.js that’s now included in ES6.
Is there any other recent JavaScript tooling research you’d like to add? Post your suggestions and opinions on the current tooling trends for JavaScript, and to keep up, be sure to follow TechBeacon's top 41 JavaScript experts on Twitter.
Image credit: Flickr
Keep learning
Take a deep dive into the state of quality with TechBeacon's Guide. Plus: Download the free World Quality Report 2022-23.
Put performance engineering into practice with these top 10 performance engineering techniques that work.
Find to tools you need with TechBeacon's Buyer's Guide for Selecting Software Test Automation Tools.
Discover best practices for reducing software defects with TechBeacon's Guide.
- Take your testing career to the next level. TechBeacon's Careers Topic Center provides expert advice to prepare you for your next move.
