Quick Thanks
This survey would have been a whole lot harder to put together without the support of Just Eat (my employer) and Wes Bos, who has kindly affiliated with this years survey, which has enabled me to spend more time analysing the results. Wes is renowned for creating great learning materials for web developers. His courses are a great place to start if you’re looking to learn more about topics such as React and ES6.The Responses
This years survey has had over 4,700 responses. In comparison, when I released the first set of results in 2015, the survey had received just 648 responses which then rose to a final figure of 2,028 responses when the survey closed. So that’s almost 2 and a half times the number of responses in comparison to last years final numbers, or a 132% increase for people who like percentages. In terms of where the responses have come from, I posted the survey on Twitter, Reddit, HackerNews, DesignerNews, Echo.js, LinkedIn and Frontendfront. It was also featured by a number of newsletters such as Responsive Design Weekly, Sitepoint Weekly and FrontEnd Focus, among others. The reason I want to highlight these sources is to show that there has been a good spread of response across various channels; respondents haven’t all come from one social channel.The Results
Pre-amble disclaimer: These results represent a sample of front-end developers working in the industry – therefore, they shouldn’t be taken as gospel, simply as pointing towards a rough trend.
So, without further ado, let’s take a look at the results! Grab yourself a cup of tea/coffee and let’s take a look…Q1: General Front-end Experience
The first question I asked was to get an idea of the experience level of those responding; something that wasn’t recorded in last year’s survey. The question was Roughly how long have you been working with front-end technologies? Here are the results:Answer | Number of Votes | Percentage |
---|---|---|
0-1 Year | 232 | 4.92% |
1-2 Years | 589 | 12.49% |
2-5 Years | 1,508 | 31.98% |
5-10 Years | 1,323 | 28.06% |
10-15 Years | 673 | 14.27% |
Over 15 Years | 390 | 8.27% |
Q2: CSS Knowledge
The second question was a subjective look at how respondents rated their own knowledge of CSS. It goes without saying that this question is pretty relative, as this can be interpreted differently by each respondent as well as relying on a level of modesty when it comes to rating your own skill level – but it is none-the-less interesting to see the results! The question was How do you rate your own knowledge of CSS and its associated tools and methodologies? Here’s what the responses looked like:Level | Number of Votes | Percentage |
---|---|---|
Beginner | 78 | 1.65% |
Novice (between Beginner and Intermediate) | 424 | 8.99% |
Intermediate | 1,243 | 26.36% |
Advanced (between Intermediate and Expert) | 2,203 | 46.72% |
Expert | 767 | 16.27% |
Q3: CSS Processor Usage
The next question was the first technology specific question, asking What is your CSS Processing tool of choice? This question was asked on last years survey, with Sass being the choice for the majority of developers back in 2015. The possible answers included all of those available last year plus the addition of PostCSS and Rework, two more modular CSS Processors. The results below also show the percentage difference between this year’s and last year’s results where applicable.Preprocessor | Number of Votes | Percentage | % Diff (to 2015) |
---|---|---|---|
Sass | 2,989 | 63.39% | -0.56% |
Less | 478 | 10.14% | -5.05% |
Stylus | 137 | 2.91% | -0.84% |
PostCSS | 392 | 8.31% | N/A |
Rework | 3 | 0.06% | N/A |
No Preprocessor | 643 | 13.64% | -1.4% |
Other | 73 | 1.55% | -0.52% |
Q4: CSS Processor Experience
Following on from the last question, I wanted to find out more detail about knowledge levels across CSS processing tools with respondents asked to give their experience in each. Here is how people responded when asked – Please indicate your experience with the following CSS Processing tools:Never Heard of | Heard of/Read About | Used a little | Feel Comfortable Using | |
---|---|---|---|---|
Sass – Standard or SCSS syntax | 0.57% (27) | 11.11% (524) | 17.16% (809) | 71.16% (3,355) |
Less | 0.81% (38) | 30.86% (1,455) | 33.32% (1,571) | 35.02% (1,651) |
Stylus | 24.22% (1,142) | 57.26% (2,700) | 11.11% (524) | 7.40% (349) |
PostCSS | 21.76% (1,026) | 45.37% (2,139) | 18.73% (883) | 14.15% (667) |
Rework | 78.43% (3,698) | 20.17% (951) | 0.91% (43) | 0.49% (23) |
Q5: CSS Naming Schemes
The next question was an area of CSS that I have a lot of interest in – CSS Naming Schemes. Having used a naming scheme in my own work for a number of years now, I was interested to see if this was something that other front-end developers had adopted too. The question asked was – Do you use a naming scheme when writing CSS, such as BEM or SUIT?Answer | Number of Votes | Percentage |
---|---|---|
Yes | 2,170 | 46.02% |
No – I’ve heard of CSS naming schemes but don’t use one | 1,731 | 36.71% |
No – I’ve never heard of CSS naming schemes | 814 | 17.26% |
Q6: CSS Linting
Next up was CSS Linting – is this a tool that a lot of developers use in their workflows? I asked Do you use a tool to lint your CSS? The results were as follows:Answer | Number of Votes | Percentage |
---|---|---|
Yes | 2,232 | 47.34% |
No – I don’t lint my CSS | 2,483 | 52.66% |
Q7: CSS Tool Experience
The next three questions in the survey covered the knowledge levels and usage across a number of CSS tools and methodologies. Firstly question 7 asked respondents to Please indicate your experience with the following CSS tools. Let’s look at the results:Never Heard of | Heard of/Read About | Used a little | Feel Comfortable Using | |
---|---|---|---|---|
Autoprefixer | 18.28% (862) | 17.18% (810) | 15.93% (751) | 48.61% (2,292) |
Susy | 55.02% (2,594) | 29.78% (1,404) | 9.69% (457) | 5.51% (260) |
Modernizr | 6.64% (313) | 22.93% (1,081) | 37.96% (1,790) | 32.47% (1,531) |
Stylelint | 54.68% (2,578) | 24.35% (1,148) | 10.39% (490) | 10.58% (499) |
Q8: CSS Methodologies and Naming Scheme Experience
This next question followed on from the last by asking respondents to Please indicate your experience with the following CSS methodologies. The results looked like this:Never Heard of | Heard of/Read About | Used a little | Feel Comfortable Using | |
---|---|---|---|---|
SMACSS | 40.57% (1,913) | 33.91% (1,599) | 14.74% (695) | 10.77% (508) |
Object Oriented CSS (OOCSS) | 28.27% (1,333) | 41.80% (1,971) | 17.77% (838) | 12.15% (573) |
Atomic Design | 41.53% (1,958) | 33.74% (1,591) | 14.34% (676) | 10.39% (490) |
ITCSS | 68.34% (3,222) | 22.38% (1,055) | 4.50% (212) | 4.79% (226) |
CSS Modules | 27.42% (1,293) | 44.77% (2,111) | 15.95% (752) | 11.86% (559) |
BEM | 24.90% (1,174) | 23.52% (1,109) | 18.49% (872) | 33.09% (1,560) |
SUIT CSS | 69.42% (3,273) | 24.14% (1,138) | 3.90% (184) | 2.55% (120) |
Q9: CSS Tool Usage
Rounding off the survey’s questions on CSS, I asked respondents Which of these CSS methodologies or tools do you currently use on your projects? Here are the results:Tool/Methodology | Number of Votes | Percentage |
---|---|---|
SMACSS | 613 | 13.00% |
Object Oriented CSS (OOCSS) | 696 | 14.76% |
Atomic Design | 680 | 14.42% |
ITCSS | 248 | 5.26% |
CSS Modules | 740 | 15.69% |
BEM | 1905 | 40.40% |
SUIT CSS | 111 | 2.35% |
Autoprefixer | 2,414 | 51.20% |
Susy | 237 | 5.03% |
Modernizr | 1,828 | 38.77% |
Stylelint | 682 | 14.46% |
I don’t use any of these approaches or tools | 1,095 | 23.22% |
Q10: JavaScript Knowledge
The second half of the survey focussed on JavaScript and it’s ecosystem of tools. First up, I asked respondents How do you rate your own knowledge of JavaScript and its associated tools and methodologies? These were the results:Knowledge | Number of Votes | Percentage |
---|---|---|
Beginner | 197 | 4.18% |
Novice (between Beginner and Intermediate) | 553 | 11.73% |
Intermediate | 1555 | 32.98% |
Advanced (between Intermediate and Expert) | 1684 | 35.72% |
Expert | 726 | 15.40% |
Q11: Task Runners
Task runners have become a very important part of many front-end developers’ workflows. But has this area changed much over the last 12 months, or has usage stayed consistent across tools and approaches? The question that respondents were asked was What task runner do you prefer using in your typical project workflow? Let’s take a look at the results – where possible I’ve included the percentage change from last years survey:Task Runner | Number of Votes | Percentage | % Diff (to 2015) |
---|---|---|---|
Gulp | 2,060 | 43.69% | -0.1% |
NPM Scripts | 1,223 | 25.94% | +22.78% |
Grunt | 554 | 11.75% | -15.81% |
Make | 54 | 1.15% | N/A |
GUI Application (i.e. Codekit) | 93 | 1.97% | N/A |
Other (please specify) | 214 | 4.54% | -0.34% |
I don’t use a task runner | 517 | 10.97% | -8.56% |
Q12: Knowledge of JavaScript Libraries and Frameworks
This was one of the questions I was most looking forward to seeing the responses to. How have knowledge levels across the most popular JavaScript libraries and frameworks changed in the last year? At the time of the 2015 survey, React was a relative newcomer still gaining ground on Angular. Since then, the Angular team has released version 2 of the framework, but have developers started to migrate over? Here’s what the results show:Never Heard of | Heard of/Read About | Used a little | Feel Comfortable Using | |
---|---|---|---|---|
jQuery | 0.11% (5) | 0.85% (40) | 12.17% (574) | 86.87% (4,096) |
Underscore | 10.22% (482) | 28.12% (1,326) | 24.41% (1,151) | 37.24% (1,756) |
Lodash | 15.89% (749) | 26.70% (1,259) | 19.75% (931) | 37.67% (1,776) |
Backbone | 4.31% (203) | 58.13% (2,741) | 23.01% (1,085) | 14.55% (686) |
Angular 1 | 0.66% (31) | 40.21% (1,896) | 30.43% (1,435) | 28.70% (1,353) |
Angular 2 | 0.89% (42) | 73.59% (3,470) | 20.19% (952) | 5.32% (251) |
Ember | 3.75% (177) | 78.41% (3,697) | 11.71% (552) | 6.13% (289) |
React | 0.76% (36) | 42.29% (1,994) | 28.04% (1,322) | 28.91% (1,363) |
Polymer | 13.55% (639) | 72.68% (3,427) | 11.75% (554) | 2.01% (95) |
Aurelia | 43.71% (2,061) | 50.03% (2,359) | 3.20% (151) | 3.05% (144) |
Vue.js | 14.68% (692) | 66.55% (3,138) | 13.11% (618) | 5.66% (267) |
MeteorJS | 9.59% (452) | 75.91% (3,579) | 11.69% (551) | 2.82% (133) |
Knockout | 16.14% (761) | 66.62% (3,141) | 11.33% (534) | 5.92% (279) |
Q13: Which JavaScript libraries and/or frameworks do you currently use most frequently on projects?
The next question referred to actual usage of the libraries and frameworks listed in the previous question. The question was, Which JavaScript libraries and/or frameworks do you currently use most frequently on projects? with respondents invited to select all that applied. Here are the results:Number of Votes | Percentage | |
---|---|---|
jQuery | 3284 | 69.65% |
Underscore | 714 | 15.14% |
Lodash | 1527 | 32.39% |
Backbone | 301 | 6.38% |
Angular 1 | 1180 | 25.03% |
Angular 2 | 387 | 8.21% |
Ember | 280 | 5.94% |
React | 1776 | 37.67% |
Polymer | 87 | 1.85% |
Aurelia | 154 | 3.27% |
Vue.js | 456 | 9.67% |
MeteorJS | 115 | 2.44% |
Knockout | 156 | 3.31% |
I don’t use any of these approaches or tools | 132 | 2.80% |
Q14: Which JavaScript library or framework would you regard as essential to you on the majority of your projects?
Question 14 looked at what JavaScript library or framework respondents considered to be their most essential tool, with the question being Which JavaScript library or framework would you regard as essential to you on the majority of your projects? Let’s take a look at the results:Number of Votes | Percentage | |
---|---|---|
None of them are essential – I feel comfortable using native JavaScript on my projects | 985 | 20.89% |
jQuery | 1468 | 31.13% |
Underscore | 38 | 0.81% |
Lodash | 262 | 5.56% |
Backbone | 38 | 0.81% |
Angular 1 | 386 | 8.19% |
Angular 2 | 129 | 2.74% |
Ember | 178 | 3.78% |
React | 857 | 18.18% |
Polymer | 16 | 0.34% |
Aurelia | 113 | 2.40% |
Vue.js | 148 | 3.14% |
MeteorJS | 8 | 0.17% |
Knockout | 17 | 0.36% |
Other (please specify) | 72 | 1.53% |
Q15: JavaScript Module Bundlers
Looking at the results of last years survey, JavaScript module bundlers were still a tool used by a minority of front-end developers, with just 46.1% of respondents saying that they used one in their own workflow. Will this have changed just over 12 months on? The question asked was Do you use a JavaScript module bundler in your workflow? Let’s take a look at the results:Module Bundler | Number of Votes | Percentage | % Diff (to 2015) |
---|---|---|---|
I don’t use a module bundler | 1516 | 32.15% | -21.75% |
RequireJS | 359 | 7.61% | -5.85% |
Browserify | 510 | 10.82% | -5.65% |
Webpack | 1962 | 41.61% | +31.11% |
Rollup | 79 | 1.68% | N/A |
JSPM | 108 | 2.29% | +0.07% |
Other (please specify) | 181 | 3.84% | +0.39% |
Q16: JavaScript Transpilers
The next question in the survey is a subject that has been talked about a lot over the last 12-18 months. The use of a JS transpiler, such as Babel, enables developers to transpile their JavaScript from ES6 (ES2015) back to ES5 so that they can use the latest JS features while still providing support for older browsers. The question I asked was Are you using a tool to transpile your JavaScript from ES6 to ES5? (i.e. Babel) Here are the results:Answer | Number of Votes | Percentage |
---|---|---|
Yes | 2,942 | 62.40% |
No – I’ve heard of these tools, but haven’t used one | 1,443 | 30.60% |
No – I’ve never heard of a JavaScript transpiler | 330 | 7.00% |
Q17: JavaScript Linting
JavaScript Linting, once a polarizing topic, is now firmly embedded in many developers workflows. But just how many people use one and is there a clear leader among tools that front-end developers use? The question I asked was Which tool do you use to lint your JavaScript? (if any) Here are the results:Tool | Number of Votes | Percentage |
---|---|---|
I don’t use a JavaScript linter | 1,076 | 22.82% |
JSLint | 894 | 18.96% |
JSHint | 657 | 13.93% |
ESLint | 1,927 | 40.87% |
xo | 24 | 0.51% |
Other (please specify) | 137 | 2.91% |
Q18: JavaScript Testing
The next subject provided some of the most interesting results in last years survey. Last year the majority of respondents – 59.66% – said that they weren’t using a tool to help test their JavaScript. Are more developers using JS testing tools a year on? The question I asked was Which tool do you use to test your JavaScript? (if any) Let’s take a look at the results:Tool | Number of Votes | Percentage | % Diff (to 2015) |
---|---|---|---|
I don’t use a tool to test my JS | 2,241 | 47.53% | -12.13% |
Jasmine | 802 | 17.01% | +0.64 |
Mocha | 1,061 | 22.50% | +7.46% |
Tape | 69 | 1.46% | -0.02% |
Ava | 84 | 1.78% | N/A |
QUnit | 199 | 4.22% | +0.37% |
Jest | 164 | 3.48% | +2.69% |
Other (please specify) | 95 | 2.01% | +0.33% |
Q19: Miscellaneous Tools
The final question of the survey was to find out more information on tools that don’t quite fit into the questions that have been asked so far. The list this year consisted of package management tools – Bower, NPM and Yarn – as well as Babel, a popular JS transpilation tool, Yeoman and TypeScript. Respondents were asked to Please indicate your experience with the following front-end tools. Here is how people responded:Never Heard of | Heard of/Read About | Used a little | Feel Comfortable Using | |
---|---|---|---|---|
Bower | 2.52% (119) | 21.34% (1,006) | 33.96% (1,601) | 42.18% (1,989) |
NPM | 1.76% (83) | 4.01% (189) | 14.15% (667) | 80.08% (3,776) |
Yarn | 21.40% (1,009) | 50.56% (2,384) | 14.32% (675) | 13.72% (647) |
Babel | 7.15% (337) | 29.20% (1,377) | 24.16% (1,139) | 39.49% (1,862) |
Yeoman | 11.56% (545) | 41.53% (1,958) | 33.47% (1,578) | 13.45% (634) |
TypeScript | 6.68% (315) | 60.87% (2,870) | 19.53% (921) | 12.92% (609) |
Summary
So that’s it – you made it through! But what conclusions can we make from the survey overall? As with last years results, the adoption rate of front-end tools shows no signs of letting up, with tools such as Webpack and JavaScript transpilers becoming ever more essential in our workflows. Although there has been a lot of talk about front-end developers moving away from using jQuery, the results show that usage and knowledge levels are still unrivalled in comparison with any other JavaScript tool of it’s kind. The great news is that more people seem to be using a JavaScript testing tool than not, showing that more front-end developers are embracing the value that these tools provide. Looking specifically at CSS, the adoption of methodologies, linting and naming schemes seems to be a bit slower. This is most noticeable when comparing the number of respondents linting their CSS compared to those doing the same with their JavaScript. Whether this is down to developers seeing less value in investing their time in learning these tools is unclear. I’d encourage anyone reading this to put the time into learning some of the more popular CSS methodologies and tools such as SMACSS, OOCSS, CSS Modules and BEM. They really do help broaden your knowledge of CSS in terms of learning ways to structure and maintain your CSS, so that you can then choose the approach that best works for you. If anyone has any questions about any of the results, or would like me to look at other cross sections of the responses, message me on Twitter and I’ll do my best to help! Originally published here, republished with the writer’s permission.Ashley Nolan
Ashley specialises in architecting large front-end projects and is passionate about emerging front-end technologies. He is the co-author of the Kickoff front-end framework, blogs over at ashleynolan.co.uk and can be found tweeting about whatever pops into his head as @AshNolan_.
Read Next
3 Essential Design Trends, November 2024
Touchable texture, distinct grids, and two-column designs are some of the most trending website design elements of…
20 Best New Websites, October 2024
Something we’re seeing more and more of is the ‘customizable’ site. Most often, this means a button to swap between…
Exciting New Tools for Designers, October 2024
We’ve got goodies for designers, developers, SEO-ers, content managers, and those of you who wear multiple hats. And,…
15 Best New Fonts, September 2024
Welcome to our roundup of the best new fonts we’ve found on the web in the previous four weeks. In this month’s edition…
By Simon Sterne
3 Essential Design Trends, October 2024
This article is brought to you by Constantino, a renowned company offering premium and affordable website design
You…
A Beginner’s Guide to Using BlueSky for Business Success
In today’s fast-paced digital world, businesses are always on the lookout for new ways to connect with their audience.…
By Louise North
The Importance of Title Tags: Tips and Tricks to Optimize for SEO
When it comes to on-page SEO, there’s one element that plays a pivotal role in both search engine rankings and user…
By Simon Sterne
20 Best New Websites, September 2024
We have a mixed bag for you with both minimalist and maximalist designs, and single pagers alongside much bigger, but…
Exciting New Tools for Designers, September 2024
This time around we are aiming to simplify life, with some light and fast analytics, an all-in-one productivity…
3 Essential Design Trends, September 2024
September's web design trends have a fun, fall feeling ... and we love it. See what's trending in website design this…
Crafting Personalized Experiences with AI
Picture this: You open Netflix, and it’s like the platform just knows what you’re in the mood for. Or maybe you’re…
By Simon Sterne
15 Best New Fonts, August 2024
Welcome to August’s roundup of the best fonts we’ve found over the last few weeks. 2024’s trend for flowing curves and…
By Ben Moss