EPeak Daily

The State of CSS 2019

0 7

We surveyed over 11,000 CSS builders. Right here’s what we realized.

📊➡️ View the Survey Outcomes

The Story

It began three years in the past once I was confronted with a tricky selection: deciding which JavaScript library to study subsequent. Choosing the fallacious choice may probably imply investing lots of of hours right into a doomed know-how, so I believed I would ask round earlier than committing to a brand new framework.

Asking round become launching a small developer survey, which in flip obtained a stunning quantity of curiosity from the neighborhood. Quick-forward three years and we’re now onto our third State of JavaScript survey, with a attain of over 20,000 builders!

However because the survey has grown in depth and size, we have additionally realized simply how advanced the online ecosystem actually is. And that whereas JavaScript is a giant a part of it, it is not at all the one one.

Which is why it solely made sense to increase horizontally into new territories, the primary of which is CSS, a.okay.a. JavaScript’s arch-nemesis and/or finest pal relying on who you ask.

And after a couple of months of knowledge processing and visualizing, I am joyful to lastly be capable to share with you the primary ever State of CSS survey outcomes!

I positively encourage you to take a look at the total outcomes, however within the meantime listed here are a couple of traits we seen trying on the information.

Flexbox is “Profitable”… However for How Lengthy?

Format Options Overview

Whereas Flexbox and CSS Grid each have near-total consciousness (in different phrases, all people is aware of what they’re), it is fascinating to see that solely about 55% of builders have really used Grid.

There are a couple of most likely causes for this. Flexbox has been round for longer, and got here round at a time the place we desperately wanted an alternative choice to floats for format. Additionally, Grid is admittedly a little bit bit extra advanced (but additionally far more highly effective!).

The reality is that each Grid and Flexbox have their professionals and cons, and they need to each be a part of a developer’s toolbox. So it would not shock us if these two circles develop into far more comparable over the following couple years!

Utility-First CSS is on the Rise; Bootstrap is in a Droop

Rating CSS frameworks for consciousness, curiosity, and satisfaction

For years Bootstrap was the uncontested king of UI frameworks. This reveals up clearly in our information, with a whopping 99% of respondents being conscious of it. No different competitor comes shut by way of consciousness, with second-best Basis coming in at “simply” 79%.

It should not be stunning that this excessive consciousness corresponds with a low curiosity ratio, since builders who have not but used Bootstrap for no matter purpose are most likely not that eager to start out now. Extra worrying is the comparatively low satisfaction ratio, at simply 52%.

Distinction this with Tailwind, which boasts a 81% satisfaction ratio! It may need a low consciousness rating (solely 34% of respondents knew about it), nevertheless it’s making its customers very joyful and on the finish of the day that is an important issue. And proper behind it with 74% is Bulma, which shares lots of the identical “utility-first” ideas as Tailwind.

Are we shifting away from large, monolithic frameworks like Bootstrap in the direction of extra nimble, pick-what-you-want libraries like Tailwind? In any case, it’s going to positively be fascinating to control this pattern over the following few years.

There’s Nonetheless lots of Uncertainty in CSS Land

Plotting satisfaction percentages vs consumer counts

The above chart of CSS applied sciences is split into 4 quadrants, and as you’ll be able to see the “Assess” quadrant (comparable to up-and-coming applied sciences with low consumer counts however excessive satisfaction) is by far the busiest.

Actually there are solely three “established” applied sciences within the “Undertake” quadrant (excessive utilization, excessive satisfaction): BEM, Sass, and Bootstrap. And Bootstrap is getting dangerously near falling off…

This goes to point out that issues are nonetheless very a lot in flux within the CSS world, which might be stunning for an ecosystem that has been round for therefore lengthy. However that is the world of net growth in any case: as quickly as you suppose you have lastly figured it out, one thing new comes alongside and makes you query all the pieces you thought you knew!

One Extra Factor…

We’re attempting one thing new this yr: we’re popping out with an official State of CSS t-shirt!

Study CSS and look good within the course of!

The t-shirt options our CSS emblem, together with a few of the precise code used to make it. The place else are you able to get a shirt that appears cool whereas additionally instructing you (and whoever’s round!) in regards to the wonders of CSS?

You’ll be able to get the shirt proper now for $24 + delivery, which is able to assist us finance future efforts on this survey and others.

Catch Up on the State of JavaScript

Talking of different surveys, you need to try our 2018 State of JavaScript survey outcomes if you have not already. We promise you may study a factor or two!

The State of JavaScript 2018

The State of CSS on The Changelog

If you happen to’re a podcast listener, hold an eye fixed out for my look on The Changelog, the place I speak extra in regards to the information, deal with some controversies about our information assortment course of, and offer you a behind-the-scenes take a look at our tech stack.

Keep Tuned

Lastly, if you wish to be sure to do not miss an opportunity to participate in upcoming survey (or know once we publish further information), be certain to enroll in our (very rare) mailing checklist. After all of the extra respondents now we have, the extra helpful our information shall be!

Supply hyperlink

Leave A Reply

Hey there!

Sign in

Forgot password?

Processing files…