00:00:00
00:00:01
The slow adoption of new CSS features
761 Plays4 months ago
My experience talking at CSS Day 2024: https://www.kevinpowell.co/article/my-experience-talking-at-css-day-2024/
My experience attending CSS Day 2024: https://www.kevinpowell.co/article/my-experience-attending-css-day-2024/
Miriam's article I mention near the end: https://www.oddbird.net/2024/06/13/css-layout/
In this episode, I talk about the slow adoption of new CSS features within the front-end and web development communities. I talk about why new CSS features, like container queries, despite initial excitement, seem to be taking so much time to be widely adopted.
Transcript
00:00:00
Speaker
Hello, my front-end friends. My name is Kevin and welcome to my podcast, General Musings, where I talk about whatever is front of mind for me in any given week, usually in some way that's front-end related and often something CSS related. And we'll be talking about but some CSS stuff today, but just before I get into it, I do want to apologize if there's any weird edits or my voice sounds different because I just got back from traveling. or I didn't just get back actually. It's been a little while now I got back from traveling, but when I got home from traveling, I went to CSS today. That was really cool. When I got back, I picked up something during my travels and it's lingering and it's not bad. I feel fine. I just i have a cough now that doesn't want to go away. um So I might sound a little different and and I might have to edit out some random coughs in the middle of sentences. So if there's an odd edit here or there, I do apologize. And I'm not going to talk too much about CSS day. I want to talk about something else today, but I just want to say I got to go to CSS day and talk in the stage at CSS day, which is just absolutely amazing.
00:00:52
Speaker
I was going to talk more about that in this podcast episode actually, but I felt like I was just rehashing exactly what I'd written. I did two blog posts. One was my experience talking at CSS day and the other one is my experience attending CSS day. ah So if you want to know more about that, I'll put the links to those in the show notes. Instead today what I want to talk about a bit is something that came up during discussions at CSS day and I've seen a lot on social media since then as well about the rate of adoption of things in CSS. This started before CSS day too. It's not this brand new thing but it seems to be this like rising
00:01:29
Speaker
discussion point within the community of like we we had you know, let's say container queries is the one that's being cited the most right now where it's like Everybody wants container queries and then we have them awesome Yeah, lots of hype but we can't really use them yet because browser supports not good enough And then time passes right and goes on for a while and now we're hitting good browser support and it's like why aren't using container queries and people are like container what now and And there just doesn't seem to be this quick adoption of using these things now that we have them, even though it seemed like it's something that everybody wanted. And so Andy Bell's been ah bringing it up on Piccadilly. I've seen other people talking about it. Miriam Susan's been talking about it now as well. And it's interesting the way, like the discussion around it and why this has happened.
00:02:20
Speaker
And Miriam's brought up a good point of like does it really matter and in a way? No, it doesn't that you need to probably slowly pick up over time, but it is curious how This happens and a little bit of like why it happens But in talking with people that aren't in the CSS space I think we're actually that's where why just really fast is I think part of the problem is what? We think more people want it, some of these things, and more people are excited about these things when we live more within our bubbles, right? So if you're in the CSS bubble, like I am, and I'm very entrenched in it, I follow a lot, like all the CSS blogs because I want to learn more stuff and I like sharing what other people are up to. So in following all of these things, when a new feature comes, a lot of those talk about that new thing because they're excited about it too. So it feels like everybody's talking about it. but it's our little bubble that's talking about it, right? And that leads to like, I think some, the first part is this misrepresentation in our own minds of the awareness of features as well as the excitement around the features and how much maybe people really want them.
00:03:29
Speaker
The people who do want them are very vocal, so you hear about it. The people that are excited about it are very vocal, so you see them talking about it and getting excited about it. But most people aren't even aware. So I think that plays into it to a certain extent. And then the other thing is most people don't write CSS as their primary part of their job. you see it in all like the state of surveys where they'll ask what's the breakdown of like the HTML and CSS you write to the amount of JavaScript you write in a given day and the JavaScript gripped always is more like a bigger part of it. I think the average is like 60 or probably 70 percent. I don't remember exactly where it lies but it's substantially over 50 percent of the day is in JavaScript.
00:04:12
Speaker
And that means like most people that are writing CSS, that's not what they want to be doing necessarily. It's what they have to do. And it's not the biggest part of their job. And they just need to be able to get something done, especially when you're working. I get to play with stuff. Like my day job is to play around and create stuff and learn how things work and share that with people. That's not what most people are doing. Most people are like, Oh, I need to do this. I already know a way that I can get that to work. That's good enough. So I'm going to do it. You see this with Flexbox and Grid. People will learn one of them. A lot of the older school people learn Flexbox first, because it was all we had, and then they're happy with that. They can do everything they need to be able to do with it, so they're like, I don't need to bother a learning Grid, and there's and all that extra stuff going into Grid, so what's the point? I can get by. And they're doing things harder than they have to, because Grid is much better at certain things than Flexbox is, just like Flexbox is better at other things than Grid is, and having two of them is a good thing. but but
00:05:05
Speaker
That means you have to learn the other thing. And so if you're able to be fine in using a media query, and it works good enough, and that's the pattern that you've always had, you're not necessarily going to learn how this new thing works. And the quirks that come with it, because there's quirks that come with container queries and you need to learn those, and figure them out and then see how it's gonna work with your new thing. And then the difference is it's not meant to replace media queries, it's meant to be used in different ways and in different situations. And so you're having to change how you work and you might be able to do more things with it than you were ever able to do before, but your mindset isn't there, right? You're just trying to get stuff done. And for me, as an educator,
00:05:51
Speaker
I talked about this actually a little bit as part of my my talk at CSS day, though I didn't at the time realize that it was sort of fitting into this larger narrative ah in a way anyway. But it's about like, how do we raise awareness within the front end or web development field in general for all of these new things that are coming to CSS? Because what's happening is these new things are here now. A lot of them actually have pretty good browser support. And they enable us to do things we couldn't do before. They fix problems or enable things. There are pain points that people have long had with CSS. And they're things that if they learned how it would work, they'd probably be happy and they probably would see adoption go up. But like, how do you raise awareness of it? And obviously my platform's gotten to quite a substantial size, but that's still like a drop in the bucket when you look at how many developers are actually out there. So like, what is
00:06:49
Speaker
the way to raise awareness for like the general people of like these are new things that are here that you can use now in production that are going to make your lives easier and i don't know what the solution is i do know that there's been that talk around let's have a css4 and a css5 and part of that would i think help Because it creates like a little talking point that you can raise awareness around like we saw with CSS3 So I think that could be part of it. Maybe it's just slowly but surely these things become more normal as we just keep talking about them and if I talk about it and
00:07:22
Speaker
Andy Bell talks about it on his Piccadilly blog and then other people are talking about it on social media and then eventually just Slowly the adoption goes up and maybe that's how it works adoption doesn't necessarily need to be overnight, right? There's no harm in that and just because something could be cool and we could do these new things some people will start doing them and then most people won't and and it will just sort of trickle in over time. And maybe that's just how that's partially going to work. Maybe that's how it's always been. We're just seeing it more now, we're feeling it right now, because there's so much new stuff. Whereas before it'd be like, here's this one new thing, we have grid now. We didn't have grid, now we have grid. Or even before that, like we didn't have layout tools, and now we have flexbox. It was very exciting when we could do border radius, because that was really tedious to make something with a rounded corner, and then you get border radius, and it's like, yes, finally, our gradients, right? those were
00:08:12
Speaker
huge pain points that now had an easy solution to them. Whereas like the new things like a container query, it's fixing a pain point or it's a potential solution to some pain points, but it's not as obvious. and clear cut how you might use it within a more complex layout or like the has selector they can do these really awesome things that you couldn't really do before but somebody's already solving that with javascript and they don't want to learn how the new thing works so they just keep doing it that way and it's not that big of a deal so they don't change right
00:08:43
Speaker
Anyway, I think maybe we should lower our expectations, is part of it, in terms of how fast these things will get adopted. But I'm sure over time, it will slowly sort of become more normal. At least that's the hope. mean mi Miriam Susan put out a post not too long ago saying, learn grid now, container queries can wait. Take your time with new CSS, but don't sleep on the essentials. And yeah, maybe that's that's the right take. let's Let's make sure people are on the ah stuff that's been around for a while and has basically perfect support or as close as we're ever going to get basically and then still wait for those other things to just sort of slowly leak in over time. I guess I sort of got myself to a conclusion I'm happy with there at the end of this though I might change my mind ah on it a few more times in the future we'll see but talking your way through things can sometimes help you get to certain conclusions in better ways, I guess. But yeah, I hope you enjoyed this. Again, the two articles I wrote are linked in the show notes. If you'd be curious about my experience at CSS Day, I also put a link to that article I just mentioned, Emiriums. And thank you very much for listening. And of course, until next time, don't forget to make your corner of the internet just a little bit more awesome.