Transcript
Speaker: Hello my friend and friends and welcome to my podcast General Musings. My name is Kevin and today I want to talk about when do you feel comfortable using a feature based on its browser support. What browser support level does something have to reach before you're like, yep, ship it, we're good to go.
Speaker: And the reason I asked this and the reason it's front of mind is I recently came across a website that was using cascade layers and it wasn't some little niche website somewhere. It was front end masters and I was actually looking at how they did something else. And as I was looking, I'm like, wait, there's a layer there.
Speaker: And I started poking around and they're just all in on layers on their site. And I was like, oh, interesting. Because layers have support across the board now. It's been available across all major browsers since 2022.
Speaker: But it's still at 94 to it's 94 .4 % global support right now. I'm on can I use as I'm recording this and it shipped with Safari 15 .4 and so like there's a chance that people are going to visit front end masters and the CSS won't work, which is crazy to me.
Speaker: Which I'm super interested in and I actually I want to talk to Matt about making that decision just because for a site of their size and they might have the analytics to say well for us it's 99 .6 % right and they're a tech forward website so most of people visiting there are going to be on up -to -date browsers.
Speaker: so it could be a decision they make and they're fine with it. And then I found out, since then I posted about that on Twitter saying, I found this out in the wild, and then it turns out Syntax FM is also on there, like West Boss and Scott, they made their website using it as well. And I'm just like, oh, this is cool, we're seeing it out in the wild. And I had a feeling it was going to start being something we were gonna start seeing a bit more of. I talked about this a little while ago, I don't remember where, if it was on a YouTube video or one of these.
Speaker: Somewhere, but I was like you know what layers are probably going to be that thing this year that become something Just because the browser support was getting to that point. It's been two years now. It's baseline That's usually when you start hitting the okay. We can use it, and that's because with layers
Speaker: It either works or it doesn't, right? It's not a progressive enhancement. If you include some CSS in a layer and the browser doesn't understand what a layer is, it just doesn't work. And I mean, that's the same for any CSS the browser doesn't understand, but you can use a lot of other things as progressive enhancements.
Speaker: I can use scroll based animations with animation timeline right now and easily make that a progressive enhancement where the website works perfectly fine, but if they have that, then they get that cool extra little animation going on. I can use multi -page view transitions right now.
Speaker: which are basically no support. I think it's still only behind a flag in Chrome. I could use that today and it's not going to change anything except add to the experience for people who have it enabled. That's progressive enhancement. Nothing breaks. We're just adding on top. Whereas things like nesting and things like layers, those are more for the dev experience. They're not something that the user actually is impacted by.
Speaker: And it's things that will, you know, if you go in on layers, you're probably not gonna have a fallback because then why bother going with the layers? You're just doing double the work at that point. So when you decide to go and use that, you're going all in with it. And yeah, it just, I guess I was expecting, I guess I'm surprised to start seeing it even though I predicted that it would happen. And I'm excited to start seeing it happen, but it really does make me wonder
Speaker: When people feel like they can make the jump and part of it is probably, you know, looking at front end masters and, and Wes and Scott, they probably know what their user base is and their analytics and stuff. So they might earn the, not they might, they are probably making a very informed decision on that.
Speaker: And so it just yeah, it's interesting and exciting to see The future CSS stuff actually coming into production because that's always the frustrating thing is Like here's this really new cool thing. You can start using that in two to three years from now It like that always sucks a little bit But in a way there's that extra excitement that comes with it because we had this cool exciting thing We got kind of like oh, that's gonna be really neat
Speaker: And then it sort of fades off a little bit because you're not thinking about it. And then it's like, oh, wait, now I can actually use that thing that I was excited about a while ago. So it reinvigorates a little bit. And it's made me wonder if I should start using layers on a couple of my projects that I'm about to get off the ground. And I'm thinking about it and I'm going to think about it a little bit more, but it might be something that I do. And it's one of those things that people actually ask me how I think I would use layers and
Speaker: I don't know yet and I think it's something that we're going now that people are using it in production we're going to start seeing how people use it because there's sort of a I think a standard idea of just like I'm gonna use it similar to like the project structure I have in terms of like I can do a base and a components and the utilities and a layout one and all of that that's
Speaker: often how I organize my project so that makes a lot of sense but maybe there's a better way and we can also have sub layers and there's other stuff and I'm really excited to see what other people do with it and I'm also excited that means we're probably going to start seeing other things like container queries out in the wild and other stuff and part of the problem too is as these start getting into the wild
Speaker: We often don't even know about it, right? Like, you could be on a site that you're visiting all the time. Nothing really looks different, but they might be using container queries on something and you don't know because it's just working and everything's fine because you probably don't go and click the CSS very often. I just sort of randomly came across that other thing, like I said, because I was like, oh, what's this little thing here? And I wanted to just double check how they did it because I'm a CSS nerd. And whenever I see, I don't even remember what it was actually that I was looking at, but these little things sometimes I'm just like,
Speaker: Yeah, there's like six different ways you could do that and I'm curious how this team did this. So I like looking at that and sometimes it inspires ideas for content and other stuff where it just goes, oh yeah, I think, you know, I would do that that way or maybe I wouldn't do that that way or whatever it is. I don't even know if I figured out what it was once I realized they were using layers, I went off on a sidetrack there.
Speaker: But yeah, that's it, a short episode for this one. Just because I was excited about that, I wanted to talk about that a little bit. And I have a longer episode coming out in a few days, which is going to be my interview with Travis Nielsen. I'm just putting the finishing touches on editing it today. But yeah.
Speaker: layers and other new modern css stuff coming now i guess if you have any opinions or ideas on when you would be comfortable shipping stuff like let me know on social media whether i have mastered on twitter i'll link them both down below you can either dm me or just you know at me or whatever it is and let me know what you think because
Speaker: they're something that I'm really curious about people's approaches there because I think some people play it really safe and other people are more willing to like be like oh some people are just going to get a broken sight I want to know how like
Speaker: what it is that makes you decide that that it's okay if somebody just is on a site that doesn't work or not because that sort of harks back to the old days at one point like you might have if you're old enough you'd remember like this site works better in netscape navigator if you were on another browser there would be a big thing telling you like don't come here if you're using internet explorer or vice versa
Speaker: And we're starting good. We got away from that. But now, like, literally this stuff breaks stuff. So that's really interesting. Anyway, I could just ramble on and on. I won't do that. I'll let you go. So 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.
