Search

624: Blogging, In App Browsers are Bad, and Teaching CSS from Scratch

Download MP3

On this epsiode we're talking about the current state of blogging and social media, the polyfill hack, whether in app browsers should be banned, web components and the difficulty of front end web dev, and how we would go about teaching CSS from scratch in 2024.

Tags:

Guests

Chris Coyier and Dave Rupert in silly sunglasses and a sign that says Shawp Tawlkk Shough DOT COM

Chris Coyier and Dave Rupert

This episode is with just Chris & Dave, ShopTalk Show's hosts. Chris is the co-founder of CodePen and creator of CSS-Tricks, and Dave is lead developer at Paravel.

Time Jump Links

  • 00:31 Is it a vacation or a familiy trip?
  • 03:07 The state of blogging and social media
  • 08:09 Polyfill hack
  • 14:00 In app browsers should be stopped
  • 16:19 Off the Main Thread on web components
  • 18:42 The difficulty of front end web dev
  • 30:29 State of JS survey
  • 37:39 How would you teach CSS from scratch in 2024?
  • 41:19 Just pop up!

Episode Sponsors 🧡

Transcript

[Banjo music]

MANTRA: Just Build Websites!

Dave Rupert: Hey there, Shop-o-maniacs. You're listening to another episode of the ShopTalk Show, a podcast all about front-end Web design and development. I'm Dave Rupert and with me is Chris Coyier. Hey, Chris. How are you doing?

Chris Coyier: Hey, good. If my audio is a little weird, I'm doing the old didn't even bring a mic on this family trip we happen to be on.

Dave: I love it. The vacation edition of ShopTalk probably should happen more often, to be honest.

Chris: Yeah.

Dave: And we should just do the laptop mic and that is just fine. [Laughter]

Chris: Yeah. I would think, with modern technology and stuff, that the recording will be decent, and it's not our plan all along but maybe it gives it a little special ambiance here, too.

I will correct your words a little bit. I remember reading this post long ago. God, who was it by? I think I could probably dig up a URL if I tried hard enough. But they said when you're in a family mode like this, don't call it a vacation because it isn't.

Dave: Oh...

Chris: [Laughter]

Dave: That's actually...

Chris: Call it a trip.

Dave: Yeah.

Chris: Call it a trip.

Dave: That's true.

Chris: Yeah.

Dave: A family trip and vacation are two different things. I would agree. I would agree. Yeah.

Chris: Yeah, I like the specificness about the word because I'm like, man, when I come back from this I'm going to be flippin' exhausted. It's all good and worth doing, and I'm sure we'll do it next year and many years to come, but the "let's see everybody we know in the world on one trip," I'm very happy to be tucked away in a small room of a house talking to you, Dave.

Dave: Doing a podcast.

Chris: Yeah, it's tremendous.

Dave: Hey, I mean how many times have I been sitting in that room with a giant elk behind me?

Chris: Seen it. Yep.

Dave: That's my hideaway. [Laughter] It's also my father-in-law's hideaway where he goes to get away from family.

Chris: Yeah.

Dave: But you know it's good. It's good.

Chris: I'm trying to work when I can a little bit. When you're on a trip like this, you don't want to be the guy just staring at your phone either. I've got to segment that away.

Dave: When you're a business owner, you know. It's harder, though, for you. I kind of sort of have jettison from that role, so this will be my first one that's kind of--

Chris: You have been. Yeah, I've noticed in some of your vibe checks that you can't... You can't eat a blog post. You can't just immediately ship code. You're at too big of an organization for that to be possible anymore. Not that that doesn't mean there are lots of expectations. But it just feels different, I'm sure.

Dave: Yeah, I've gone from a very high autonomy, high throughput, just a very, like, "I want code to go out. I make code go out." I have to talk to two people, and that's it. Then it goes out.

Chris: Mm-hmm.

Dave: Now it's a whole rigamarole. There are probably ten people between me and something publishing (for good reason) because it's a good--

Chris: Yeah.

Dave: [Laughter] It's....

Chris: I'm sure that could go wrong plenty of times.

Dave: Oh, yeah. I think there are historical Bill Gates kind of writings about why that's a bad thing. But anyway, it's been different and I've noticed my own blogging has gone down and stuff like that. I kind of wondered if it's connected or if, man, I lost my edge. I don't know.

00:03:35

Chris: Oh, God. I haven't published a blog post in a month, I bet.

Dave: It's been that. Yeah, yeah.

Chris: But it could just be summer, too. It all comes around, I think.

Dave: That's what I'm attributing it to is summer. Onboarding a new job is a little bit of mental overhead.

Chris: I'll say!

Dave: You know what I mean?

Chris: Yeah.

Dave: Kind of applying all my brain cells towards that and then--

Chris: You know it always comes around it seems like.

Dave: Mm-hmm.

Chris: You can't blog for 15 years - or whatever - and then just think this is the end because one little thing changed. Nah, it'll come around.

Dave: Yeah, isn't that weird? You're like, "I didn't publish much this month. I guess I don't blog." You know?

Chris: It is funny to have the backdrop, though, of, like, "I'm just writing this to feed an LLM, aren't I?" Not that that's really necessarily true. It just kind of feels like that a little bit, and social media is such a mess. It's not like you can publish and then watch your likes or anything. Those days are kind of over.

Then you're like, "Who even subscribes anymore?" I know you think about your RSS subscribers more than most. But it just feels a little less motivation to do it when you're like, "I don't even know who is out there anymore."

Dave: It is weird. I don't know. What I don't understand is how... We ejected. A lot us, I should say, ejected from Twitter's machine, engagement machine, just attention economy.

Chris: Yeah.

Dave: For calmer waters and other social networks. I know people who love Threads, which is weird to me, but they've found their niche there.

Chris: What do you think it is? The fun of it, in a way? I'll tell you I'm looking around a little bit. Nothing I'm going to change much, but I really have been in these moments where I'm using social media less and I pop into Mastodon, I'm like, "This is a whining fest!"

Dave: Yeah!

Chris: It is very negative and just like, "You know what's wrong with the world? This."

Dave: This.

Chris: That's what happens on Mastodon, and it's bumming me out a little bit. Not that I really plan on changing, but I'm finding it a very negative place.

Dave: It's that thing. Share what you like. You know what I mean?

Chris: Right.

Dave: Talk about stuff you like and find those people. Then you all can have in-jokes about, like, "Oh, yeah. That Gundam is weird." [Laughter]

Chris: Mm-hmm.

Dave: You can have in-jokes about that. But just this constant, like, "Man, this is stupid. That's stupid. Tech is stupid." There are stupid things about it.

Chris: It feeds itself, too, because if you publish that, you will get the likes.

Dave: That's...

Chris: I found myself... The few things I posted that are really critical and negative tend to get the stuff. I'm like, "Ooh... I've got to watch myself on that. That's not really the core me."

Dave: Yeah. Yeah, so I don't know. I just would encourage people to share stuff they like.

Chris: Mm-hmm.

Dave: Share books, share movies, share TV. Share things you like and enjoy because we can be the positivity in the world. It doesn't have to be just takedowns of software and companies all the time. Man, you know. Whatever.

Chris: Yeah. We're not closing our eyes to it. We see it.

Dave: No, no. I want to... There are a time and place, but I also think your criticism is more sharp when you are not just a squeaking wheel all the time.

I heard this guy talk about Texas politics. He's like, "I'm sick of Texas saying your vote doesn't count." I'm sure I've said that, too, because I am in kind of a gerrymander district in Texas and stuff like that. But the guy's delivery was just stupid. Just so, like, "Here's why no one is listening to you." He's like, "I already mentioned this in this other TikTok." It's like, "Here's why no one is listening. Because you're abrasive and it just sucks." [Laughter]

We need people. You need... I don't know. It's kind of like the old, "You catch more flies with honey than you do with vinegar," or whatever.

Chris: [Laughter] Yeah.

Dave: Which I don't even know if it's true, but anyway. [Laughter] I feel like there could be a lot more people just sharing stuff they like, sharing things they read and liked, and doing that in public. Lifting up the public sphere a little bit more.

00:08:10

Chris: I caught some news the other day, despite not reading tons of it, just because it's relevant to CodePen, so I saw it through there because I think Cloudflare notified us because they detected it as a problem. There used to be this service called polyfill.io. Do you remember that?

What was neat is you could link up that script and it was so clever that it just figured out what polyfills you need and then kind of lazy loaded those polyfills. Very clever idea, I thought.

A lot of people used it over time, particularly in an environment like CodePen. Why not just load it up and then just use modern browser features?

I don't know why things like that go in and out of favor. I didn't see a lot of people using it anymore. I think it probably had a peak usage earlier than now.

Dave: I'm sure there was some compat in 2018 or something. I remember somebody proposing we roll that out on a large pizza company website. I just was like, "I don't think that's a good idea."

[Laughter]

Chris: Yeah.

Dave: I think there might be a problem there. You know?

Chris: Right. It's one of those things. CDNs are out of favor a little bit anyway, especially for production usage. For one thing, one of the things that happened (rightfully so) was that the idea that, "Hey, that resource might already be cached. I'm using the font Monserrate from Google Fonts. It's so popular. Maybe there is zero download time because my browser already has it."

Those days are over. Browsers don't share cache between websites like that anymore, so no advantages to that. And the risk of linking to a third-party site that you don't control, I think people grew up a little bit and be like, "The risk is too high." Well, here is an example of the risk being too high.

Whoever owned this domain name sold it. Idiot move. Sorry, whoever you are. You're an idiot. That's not cool to do that to. What'd they pay you?

00:10:07

Dave: The project maintainer and the domain name owner were different people.

Chris: Okay, well...

Dave: So, yeah.

Chris: Whichever one sold it is the idiot.

Dave: Yeah.

Chris: And they sold it to... I don't know if it matters that it's Chinese. I always feel like there are little subtle racism that gets slipped into stuff like that. But whoever they sold it to put malware on it.

Dave: Potential nation-state actor is sort of the--

Chris: Sure.

Dave: Just pulling it out of the specific racist bucket.

Chris: Yeah.

Dave: A potential hostile nation-state actor.

Chris: Sure, but it could have been somebody in Alabama that sucks, too, and put malware on it.

Dave: Also, yes. Yeah.

Chris: In this case, it was a Chinese company, I guess. Not only did they just sell it (because that happens, too). Again, I noticed some app called Bartender - or something - for Mac sold, too, and didn't disclose that they were selling it. There was hubbub over that. But that is just a new owner; not provably malicious.

This was probably malicious. They started returning the URLs with some kind of malware. Didn't run an analysis myself. This is just what the news said. Bad news. Right? On a company like CodePen, we need to act fast. We rolled through the whole database and replaced all instances of people linking this up with an older, safer hosted version of it. Problem solved from there.

Any ones that get through, thankfully, we run our traffic through Cloudflare. Questionable to some of you, but they're really good at some of this stuff. One of them is just making sure that no request to that resource will go through without being fixed. Thanks for that.

It made me think about a piece of the Web platform itself, Dave. Of course, now that I was just looking at it earlier and now I've forgotten the name of the attribute. There is an attribute on the script tag itself in HTML that prevents this from happening. Did you know that?

00:12:05

Dave: Oh, the integrity tag, integrity attribute?

Chris: Yes, that is what it is exactly. It is called--

Dave: Put a SHA in there.

Chris: It's literally just called integrity= and there's a SHA attribute. It takes the string, the very large string of whatever resource it's linking to, and it runs some algorithm - or whatever - that makes some big, long, gibberish thing. But it's a big, long, gibberish thing that's not nearly as long as the original content was and will be unique to whatever content was in there.

Dave: Yeah, it's kind of like an MD5 hash, if you've ever done that, or like a base64 encode - or something.

Chris: Yeah, I don't know. Why isn't it MD5? Maybe it's not secure enough.

Dave: I think MD5 is crackable.

Chris: Crackable?

Dave: So, I think it's a SHA256 hash.

Chris: Yeah. In this case, I think it support several of them. For example, if you go to cdnjs.com, again, a little out of favor but useful to me, especially for something like on CodePen. You just need to link up a resource. We've leaned on those things heavily over the years.

They provide that SHA hash when you copy the resource. So, should they ever get a nation-state actor buy them - or something - and change what the response of that is, the browser will not load and execute it.

Dave: Won't run it.

Chris: They won't do it. It'll say, "This content has changed."

Dave: This was also not... Pulling it out of the nation-state discussion, I think it was invented because [laughter] Internet providers were injecting their own thing. If you were on a plane, an airplane, they would just inject their own scripts into your page that you were loading.

Chris: Yep.

Dave: You're just like... Or modify the script over the wire.

Chris: It's almost like HTML should have an integrity attribute. [Laughter]

Dave: Yeah. I mean that's where code signing, that's different but that's sort of like--

Chris: Mm-hmm.

Dave: But yeah, I just wonder, too.

00:14:00

Chris: It happens to this day. This angers me so greatly. In-app browsers on iOS, which is supposed to be from the great Apple that is so secure, secure for days, right? This happens right now. Go to Instagram. Click a link from something. It opens in an in-app browser in Instagram. It is jacked in with crap, buddy, from Facebook, from Meta. They jack their own crap in there just like you're at some skeezy-ass hotel.

Unbelievable that that's allowed, and it's just been the case forever. There's a class action lawsuit against them. It doesn't seem like it's done anything. It's just crazy to me. Get your crap out of my HTML.

Dave: Yeah. Just because I clicked a link from your app, you don't get to snoop on me.

Chris: No.

Dave: I just think it's silly. Yeah. Or the audacity. The audacity! You know?

Chris: The audacity. Unbelievable. Yeah. Don't use in-app browsers. They just shouldn't exist, in my opinion.

Maybe there's more nuance to this. Somebody, convince me that in-app browsers are a good idea. Why don't you just open the browser that's already on the thing?

Dave: I could see for Flash content or recipes, let's say. I'm linking out to the NY Times article. Boom.

Chris: You don't want to switch apps is the point, right?

Dave: You don't necessarily want to switch apps just to get a detail view. However, there's this weird--

Chris: Why does it have to be so different? It's so different. Your extensions don't run. You can't see the URL. I don't know. There are all these things.

Dave: Well, and all the steps, like Instagram specifically does to not let you post multiple links. You can only have one link in your bio. You can't put links on photos and be like, "Check out my new album," or whatever. Right?

You have to go, "Link in bio," and then you go to a bio. Then your bio page is actually just a link tree. It spawned a whole industry of websites that's just links. Hmm... Anyway, no.

Chris: Right.

Dave: I'm complaining.

Chris: I know. That's not my favorite thing. Yeah. Tell me how much you love the Web again. I want to hear it.

00:16:19

Dave: I love the Web. I was thinking about the Web. I listened to... What is the Surma and Jake's new podcast? Off The Main Thread, that's their new version of HTTP 203.

Chris: Yeah. They're great. Good job, boys.

Dave: Good job.

Chris: Thanks for doing your show.

Dave: Yeah. They are just very - whatever - soothing individuals and smart.

Chris: I find it, yeah. They go so deep on stuff. Surma will be like, "I just looked into gaming engines."

Dave: WASM, yeah. Yeah, and then Jake has got toilet humor, but it's good. It's good. [Laughter] But they did one on Web components, and it's funny how they were... I found it funny how they were like, "It's great. I use this pinch zoom thing I made for Google, and I just import it into a Preact project. It'll still on NPM. It's a miracle it's maintained. It's been like seven years or something," blah-blah-blah.

Then they're like, "Ah... But I don't know if Web components are fully there yet." I'm like, "Dudes! You just fulfilled the promise of Web components. Maintenance-free, nightmare-free, bundling-free thing." Anyway, they were so close. Anyway, they did a good job. It's a good episode on Web components though.

Chris: Yeah. Yeah, it's funny. It's very easy to get to the point where you're like, "This needs to get better, this aspect of it." Then talk yourself out of it, missing the forest for the trees - or whatever.

Dave: Yeah, yeah.

Chris: There's a lot of good stuff there.

Dave: There are issues. There are valid concerns. I think that's what I always try to see, the forest through the trees. But it made me appreciate the Web. It was like, "I like the Web." I like building for the Web. I like making websites.

Honestly, Chris, I wonder if I was born to make websites. I know that sounds stupid, but I was born at a specific time in this universe--

Chris: Right.

Dave: --where I was coming of age in the Internet for websites, and I just wonder if it just was... I just think I was technically minded and I want to make websites. I'm very passionate about everyone should be able to have access to things. It shouldn't just live in a walled garden.

Chris: Right. You have some artistic tendencies, too, that help you there.

Dave: Yeah. Zines and information should be free and stuff like that. There are very fundamental pillars that the Web sort of hits and aligns for me. Anyway, I just wondered.

I think I was reading Baldur Bjarnason. I'm sorry, Baldur, for... [Laughter]

Chris: Yeah, I like him. We worked together on some small projects. I'm very jealous of his Icelandic life.

00:19:05

Dave: Bjarnason. Sorry. I'm going to get it one day. Anyway, it was a bit of a rant-y post, and I've kind of been anti-rant these days. But Baldur tends to take the more extreme opinion of what I think. [Laughter] You know?

Chris: Yeah. Fair enough.

Dave: Just the two steps closer to the strongly disagree or strongly agree. It's about new Web development or why Copilots and chatbots are particularly bad for modern Web dev.

He quotes Marco. What's Marco's last name? I'm blanking.

Chris: I just remember the JavaScript library.

Dave: Marco Rogers.

Chris: Oh, yeah. Yeah.

Dave: He quotes Marco Rogers, and Marco Rogers, on Mastodon, was saying -- and I'll read this -- "The front-end ecosystem is kind of broken right now, and it's frustrating me for a few different reasons. New developers are having an extremely hard time learning enough skills to be gainfully employed. They are drowning in this complex garbage and feeling really disheartened. As a result," and I should say - pause - Marco is an engineering manager, so he's kind of in this, right?

"As a result, companies are finding it more difficult to do basic hiring. The bar is just so high to get a regular dev job and everybody loses. What's worse is that I believe a lot of this energy is wasted. People that are learning the current tech ecosystem are absolutely not learning Web fundamentals. They are too abstracted away. And when the stack changes again, these folks are going to be at a serious disadvantage when they have to adapt away from what they learned. It's a deep disservice to people's professional careers and it's going to cause a lot of heartache later."

That's Marco's sort of take. It comes from a big, long Mastodon thread, but it was just basically like--

Chris: Yeah, he's been saying that for years, too. It's not like a brand-new thing.

Dave: Yeah, and it's pretty easy to be like, "Web development is complex." You know? [Laughter] But I think, as an engineering manager, I think he's been in positions where his managers are like, "Why is this not done?" and he has to be like, "Well, it's super-complex."

I think that he's in the pinch zone of the engineers are like, "We're building this to make us faster." [Laughter] Then management is like, "Why is it not done faster?" He's in that squeeze zone. But it's just--

Chris: So fun to think about.

Dave: But it just makes me think, like, new developers are probably... If you're jumping into the career now, you've got a lot to learn. You have to learn frameworks. You have to learn everything.

Chris: Yeah, and it's easy to picture that, isn't it? You're trained up on this really narrow set of skills and that you finally get there. You're finally contributing and being useful to this company. But the way that you're doing it is so narrowly specific to a stack that could go out of fashion and that, when it does, you're left behind. Now I can imagine it but I don't see it every day like maybe Marco does.

It's very easy to be like, "Well, you know what's going to save you from that is the fundamentals." And that's also easy to say and imagine. You're like, "I understand how these core technologies work and I can adapt them to frameworks because now I understand that." But I feel like that's also something that is easy to say and imagine that I don't see.

Then to combine them both, you could say, "Well, the right answer then is to deeply understand the fundamentals and frameworks." [Laughter] Then that's where you get to this level. Well, it's just too complicated.

Dave: Well, yeah. I mean I'll throw myself under the bus. Dave Rupert, a Web developer. Very good fundamentals. I'll just go out and I'll just pat myself on the back right here. [Laughter]

Chris: Sure.

Dave: Obama giving myself a medal. I like Web components. Literally did a course on them. Very good at CSS. It's just 3,000 key-value properties that you just have to memorize. It's pretty easy. And it grows every year by, like, 200. [Laughter]

Chris: And everything affects everything else, and it's unbelievable.

Dave: Yeah, and everything affects everything else, and some browsers just ignore stuff. Whatever. Right? Easy.

If you're like Dave Rupert, pick up a Next project today. I've got nothing, Chris. I am like juggling spaghetti.

Chris: Do you really think that or could you--? How long until you're useful in it?

Dave: It would be like juggling spaghetti. I'm just doing nothing. [Laughter] It's actually... I think I understand the basic principle of a React component and an effect, barely. And so, I feel like I could probably get by.

Chris: Yeah. See, that's the thing. And especially because you're so smart, it would take you a week and you'd be cooking in there. There'd be little rough edges that you'd hit every single week for a year.

Dave: Mm-hmm.

Chris: Then at the end of it, you'd be really good at it. But you'd probably be useful right away, and you'd probably see things from a fresh perspective that would be appreciated on that team. Be like, "Why are you doing this?" You know? With this complicated click detector that you don't need because there's some modern JavaScript way to do it. I think your expertise would be useful immediately.

Dave: Um... Yeah. Nah, I mean it does... I think it does, though... That's like I have years of experience building up to that, so I do wonder what somebody new, experience like that. I wonder if you can just say, like, "Learn the fundamentals," and it's fine.

I do wonder that. I don't know if fundamentals get you paid. [Laughter]

Chris: No. Yeah, that's not good enough because let's say that's your job. You've rolled in now, Dave, but you're not you. You're greener - or whatever.

Dave: Yeah.

00:25:00

Chris: This is just some kid, and they say, "Well, you need to have a confirmation dialogue for this delete button." That's what you're tasked with - or something. You're like, "Yeah, fine. We can roll that out."

But you know some fundamentals. You're like, "I'm just going to use the dialogue element here. I'm going to apply some styling to it. I'm going to use the backdrop because that's nice. This is a modal situation. I'm going to use a couple of button elements inside to confirm the deletion or remove it - or whatever."

You've done it, and it looks fine. Then your PR is just ripped to shreds because that is not how it is done at this particular company. We don't use the dialogue element here yet. It's not territory we've crossed and we're not going to do it just for this little one-off. That confuses our codebase. Instead, all the modals are kept in root, packages, components, components to packages, and modals.

[Laughter]

Chris: If you're going to do a modal, you have to put the modal in there to begin with. Now you have to invent a constant for it and export it from our constants package because all modals have a constant that refer to what they are. Then you're going to pull it up.

You can't just use any button component. You have to use the modal button component because that's how we roll here. There are special that are sized just like everything else here. Then you have to attach a handler to it. That OK button that's able to communicate back to the component that called it, so you have to use this special prop pattern we have. We actually have a TypeScript type that is that way to communicate back and forth.

You just wouldn't know any of that stuff. So, you can be taught. Your PR gets ripped to shreds. You're not using the fundamentals here. You're not... They are so far away from fundamentals it's nuts.

Dave: Yeah.

Chris: It's fundamentals in that maybe there's a JavaScript constant in there somewhere. But for the rest of it, it's just--

Dave: It's convention and... Yeah.

Chris: Frameworks and just a company's conventions on how they do things. But that's day-to-day work. You have to learn that, and it's not... They're not dumb for doing it.

One week one, you might feel like they're idiots because you're like, "Why have you complicated this so far? Why have you gotten so crazy complicated in this?" You might be a little bit right, and you might be a little bit wrong because the reason that those fences were put up (as one of the metaphors) is because things got out of hand doing it willy-nilly before. And so, now we do it this way and things are much more understandable.

But fundamentals has nothing to do with this conversation... [laughter] almost. You know?

Dave: Yeah. Yeah because it's all convention, right? I remember interviewing and somebody... I submitted code and somebody's kind of grilling it and maybe kind of dinging me because they were like, "It looks like you're using a mix of elements and IDs and classes, so why did you do that?" I was like, "Ah, yeah. I could probably do better, but in a Web component it matters way less." You know how all my elements are scoped to the Web component.

Chris: Hmm...

Dave: But I was just like, "Oh, it matters way less. I could clean that up." Then I was just like, "But to be honest, I would probably just abide by whatever convention is set in place by the organization," because that's how a lot of code works is mostly just what's the convention. Are we doing elements? Are we doing classes? Are we doing--? You know?

Chris: Yeah. Yeah, what do you got going on here? I'll figure it out.

Dave: Yeah. Yeah.

Chris: Fortunately, in this modal thing, you'd probably copy and paste an existing one, and you'd figure it out. You wouldn't be totally ignorant of the conventions because there's other code in place to use and stuff.

Dave: Yeah.

Chris: Anyway, that's my point.

Dave: Yeah.

Chris: I feel like sometimes a Mastodon thread has to talk in such generalities in order to be generally applicable to anyone reading it that it's too broad. Then I'm like, "I don't know what to make of all this."

I also don't hire and fire a ton, so I don't know how hard is it to find somebody useful to your organization. Apparently very. I don't know.

00:29:10

Dave: Yeah. Yeah. Well, I mean that was somebody in that Baldur post. I'll put a link in the show notes. I had it open, but I have lost it. The link in the show notes there.

Had kind of a tag-on thing where this post about this guy was hiring and trying to... Yeah, pivoting from native React to native DOM APIs. It was on the new stack. It was just sort of somebody, a kind of hiring manager or tech lead or somebody, lamenting, like, "We are having a hard time hiring people who know vanilla JavaScript," which is probably... maybe... I don't know. You attract a certain... [Laughter] Your job attracts certain people.

He added that finding developers who know vanilla JavaScript and not just frameworks was an unexpected difficulty. I think there is this tension of, like, we've taught frameworks for so long; people only see it through that lens and haven't had the opportunity to go deeper than that.

Then State of JS came out. Did you see that? Did you thumb through that?

Chris: I haven't thumbed through the results yet. I saw that it was out. It just happened so quickly after State of HTML. I'm like, "Oh, God. They're cooking along with these surveys."

I do generally enjoy the surveys. But then I saw another company's JavaScript results came out. I get a little survey fatigue in that I don't know how much I actually care about this stuff sometimes. [Laughter]

Dave: Yeah. It's hard. It's hard to parse all this data. It's so much data. You know what I mean? How do I parse all this stuff, and how is it relevant to my life? It's cool to see charts, and especially--

Chris: Were you surprised? That's the thing that I'm most interested in. Is there something that I just totally haven't heard of that is skyrocketing in popularity? In my mind, I'm like, "I don't know. React and Next are popular. People still like Tailwind. TypeScript is way more popular than you'd ever think it was. And that's about it." You know? [Laughter]

Dave: Well, I was going to link you to this thing, but then the JavaScript messes up and fucks up the chart.

[Laughter]

Dave: Exhibit A of why people... Oh, my gosh! I was trying to get it to you. It's the 2023 libraries page.

Chris: Yeah, I'm looking at that pretty much.

Dave: Okay. You're at that?

Chris: Are you starting at the top?

Dave: Yeah, yeah, so you go down to the changes over time.

Chris: Sure.

Dave: I have literally messed up this whole thing.

Chris: Yeah, it looks like a kidney.

[Laughter]

Dave: Yeah. Yeah, it's like a bunch of arrows going zipity-zapity. Right?

Chris: Mm-hmm.

Dave: Yeah, but it's basically the negative opinions. All of these, if you have an X-Y axis and negative and positive are on the X-axis.

Chris: Right.

Dave: Negative one is negative--

Chris: Gatsby.

Dave: Yeah.

Chris: Nobody likes it.

Dave: Stuff is--

Chris: Positive, Vite. Everybody loves it.

Dave: Yeah, and then use and have not used. And so, everything is kind of going... A lot of the JavaScript frameworks like React and Vue are kind of moving left, so the opinion over time is getting more negative, and Docusaurus and stuff like that. So, there are a lot of opinions... Angular, although it's kind of twisting the other way now, I think.

But it's like the sentiment for meta frameworks and front-end frameworks is kind of moving negative, and so that I found very interesting. Of all the things that are happening in this JavaScript ecosystem, you'd think people who write JavaScript for a living would be like, "Yeah, but maybe it's again we're just complainers and we like to complain about our tools," which I do have a point on that.

But it's interesting to see tools moving a different direction over this rapid adoption. I think Theo brought up the point, like, there's a big difference between somebody who uses a tool because they want to and uses a tool because they have to. That's a big difference.

Chris: Sure.

Dave: Then my thing was... I think it was the HTML survey, actually. It asked about Web components. You know I've got opinions. I'm pretty harsh. [Laughter] I like Web components, but I also am a critic. There are places they are letting people down. Browsers need to kind of step up and fill in the gaps and shim it. You know?

Chris: Yeah, so what's the hottest thing on this list? I guess it's Vite.

Dave: I don't know. Yeah, Vite is hot. Vite is pretty... They have an S-tier, a tier list, so Vite, Vitest, Playwright, PNPM, ESbuild. Astro actually performed very well, so good job, Astro, who can sponsor this podcast if they want.

Chris: I could have guessed all this, probably.

Dave: Yeah, and then Svelte Kit, but then stuff in the bottom tier is sometimes kind of surprising, or even in the B tier.

Chris: Yeah, a little surprised to see parcel down there. I thought people liked that. Maybe not.

00:34:52

Dave: I did use Lightening CSS the other day and it's fricken' great, so anyway.

Chris: Yeah. Yeah, I've been using it.

Dave: [Laughter]

Chris: Yeah, it's kind of cool. But I rough edges, baby. You know?

Dave: Oh, really? There's a few?

Chris: A little bit because when you use really modern stuff (of which there is a lot in CSS), like, "Oh, surprise." Now there are - I don't know - anchors.

Dave: If statements. Yeah. [Laughter] Yeah.

Chris: Yeah. But imagine anchors. There's anchor name and anchor - other stuff. Sometimes there's shorthand for those things, too. Well, that can get... I don't know if this was exactly. I'm trying to remember. I think it was container queries that poked me on this one. Or there's a back row. What is it? Let me think of it real quick. Transition behavior allow discrete, we've talked about that one before.

Dave: Yes. Yes. That's the allow display to transition.

Chris: Yeah.

Dave: A.k.a. allow display transition.

Chris: You see a lot of examples of that in CSS where you set up your transition and then after it you put "transition behavior allow discrete." They might even mention in the post, "Hey, put this afterwards," because you're using the transition property, which is shorthand. So, it has that behavior of overwriting every other non-shorthand property of it.

If you set the background property, you're also setting background repeat-repeat. You didn't know that but you are. It's the same with this, and so it had this negative behavior of, when it was squishing it all together for efficiency because part of what Lightening CSS does is like a minifier, too. It did it wrong, and it can be really bad. It can do it wrong to the point of it just not working at all.

When your tool that you use does something like that, you're hosed.

Dave: Well, and you... You know. I'm going to see if I have allow discrete in here. Uh-oh, I might. Yep. That's too bad. [Laughter]

Chris: I think it's fixed that particular one.

Dave: Okay, good. Okay. Phew! Because I was about to build a thing. [Laughter]

Yeah, it's the surprises, right? The tools, like, "I'm going to do my best job and only output valid CSS." But if valid CSS changes faster than you can use the tool, ugh! Tailwind has the same problem. CSS moves faster.

Chris: You think you could write the tool such that it's impervious to that kind of thing. No.

Dave: Yeah. Nope.

Chris: Not happening. It's too nuanced.

Dave: Too hard. But you know. I don't know. CSS, to its credit, has improved over the years. I'm thinking about that newcomers, like beginners. How do they get into it?

I've been thinking a lot about how would you teach CSS from scratch. I know Kevin Powell is probably way more appt. [Laughter]

Chris: All over it.

Dave: To cover this. Or Andy Bell or somebody like that. But I just think... I feel like there are a few big buckets, like colors. Like colors and theming.

Chris: Yeah.

Dave: Layout. Flex and grid. Colors and theming would be like color red, background red or pink - stuff like that. Then maybe you get into font sizes and say, "Here's some other stuff you can do. This sort of adjusts the presentational properties.

Chris: Yep.

Dave: Then you get into layout. That's Grid and Flex. Just teach those with Gap. Then maybe go into advanced repeats and things like that. That would be pretty easy.

00:38:46

Chris: I wonder if it would be easier. I think it would fun. I think that sounds really fun to me to grab a class of ten people that are really into it that have some ideas - or something - and teach them CSS from scratch. Oh, that would be great.

Dave: That would be cool. Then I think margin padding and translate and all that would be kind of like the whole next thing, like positioning.

Chris: Yeah.

Dave: I think you have to teach because that--

Chris: Does that work? Does it work to teach module at a time, like concept first, or can you not get away with that? Or does it need to be more like top to bottom of a real website, so you're just learning what you need to learn to pull off the visualness of this website? It's a totally different approach.

Dave: Yeah.

Chris: I wonder. Do you have enough time to do it both ways?

Dave: Well, yeah. Maybe you could do three or four - whatever - five modules. Just kind of really basics, and then it's like, "Cool. Then we're going to build a website." Then you add in that, like, "We're going to build a news site," or something "ahead of time," and be like... Or shopping cart, you know, e-commerce.

Chris: Yeah, do some students need that? Do they need to see the end in order to be engaged at the beginning?

Dave: I think you need a carrot and a stick, right?

Chris: Yeah.

Dave: I think you need, like, "Hey, we're going to build this at the end, so buckle up. That would be cool, like, "Here's where we're going. Let's get there."

Chris: Yeah. I think part of that, you could cheat. Put a couple of animations and transitions in there, too, because those are so attractive, I'm sure, to some students. They'd be like, "Ooh... What?!"

Dave: Yeah. That's like butter on a biscuit. Yeah, that's good.

Chris: Right, and that's part of it, too. Gosh, that'd be cool.

Dave: One day. One day, I'll author my opus on CSS.

Chris: Yeah, but it'd be fun to do it with low stakes. I would love to make a course or something, too. There are so many out there. Frontend Masters courses are great. It's not like we'd be doing this for the first time.

I'm saying I would like to do it because I think it would be fun for me, warts and all. I want to be able to screw up, too, and recover.

Dave: Yeah. Yeah, it's like I want to. I want a crack at it. It's like I want to hit the baseball.

Chris: Yeah, give me a crack. Put me in, coach.

Dave: Put me in, coach. I want to try this. Let me riff. [Laughter]

Chris: Yeah.

Dave: Then it's going to be like surfing where they're like, "All you gotta do is pop up." Then I go out there and I just fricken' can't pop up. That's what... That'll be my life.

00:41:29

Chris: [Laughter] You know what I tried the other day? We were visiting some friends on Lake Lanier, which is like 45 minutes north of Atlanta. There's a big lake that provides all the water for the region and stuff.

They dammed it up. It was a river. They put a dam on it and let the water spread - whatever - 100 years ago. The lake is very snaky and clay-bottomed and stuff. Man-made lake. I don't know if you call it that anymore, but there is still a big dam there and whatever. That's where we were.

The dude lives close enough to it that they have standup paddleboards and lots of lake fun. But he decided he does enough lake stuff that he's going to pull the trigger on this thing called the Flite Board, fliteboard.com. Check it out.

Dave: What?! What is it?

Chris: $7,000.

Dave: Okay.

Chris: Beware.

Dave: Hey...

Chris: It's got a big ass battery on it. It's one of these cool toys that's like, "Now that we have super-powerful batteries, what can we apply it to?"

Dave: Oh...

Chris: I don't know. It's like a boogie board size - or whatever. It's like half a surfboard, let's call it.

Dave: Yeah!

Chris: Then there's a thing that sticks down. And then the thing that sticks down, there's a big propeller on it in a cage.

Dave: It's a hydrofoil? [Laughter]

Chris: Yeah, it kind of hydrofoils up.

Dave: Whoa! Yeah.

Chris: I think you want that, ultimately. You don't have to be hydro-foiling all the time. It'll push you along the water as well. But once you're up, the thing behaves a little nicer. You can turn easier. It slices through the waves. Even in choppy water, it feels smooth to you.

Dave: Mm-hmm.

Chris: That was cool. It was very difficult for me. But yeah. Yeah, just pop up, Dave. Just pop up. It's easy.

Dave: Just pop up.

Chris: Yeah. It's not.

Dave: Just get up. Just do it. What's taking you so long? Yeah, just do it.

Chris: I had some troubles popping up, let's say.

Dave: How do you start on it? You just get towed first?

Chris: Well, you have a thing in your hand.

Dave: Yeah.

Chris: So, you're on your belly, and you have to tap the thing. It kind of has this blue-tooth connection. Then you're at a one. You're squeezing it, and you're going along. Then you use your thumb. Now you're at a two, three, four. By the time you're at six or seven, you've got enough speed that you can kind of scooch your belly forward and keep the nose of it down.

Then once your belly is far enough forward, you're kind of on your hands on either side of you, too. You can get up on your knees. Then once you're on your knees, then it's pretty natural from there. Natural, meaning I absolutely couldn't do it but I can see how someone with better physical abilities could do it.

Dave: Yeah. Yeah, yeah. I see the weight limit and I'm pushing the weight limit.

Chris: It makes you think, now that we have these big ass batteries, what else? Put a battery in everything. I don't know.

00:44:17

Dave: I was on the lake the other day and saw somebody flying a one-seater plane over the lake. It's basically this personal aircraft that is like a four-wheeler or a jet ski with wings, basically. And so, you take off in the water, go up in the air, and you fly. It looked angelic. He's just flying over this lake.

Chris: So cool.

Dave: I'm like, "Wow! That's so cool!" Then I see him just drop 20 feet.

Chris: Wow.

Dave: I was like, "Never doing that. Never."

[Laughter]

Chris: Yeah.

Dave: That's enough--

Chris: I like my bones.

Dave: Yeah. I like my bones. I generally don't like pooping my pants. [Laughter] And I'm just going to not do it. I'm not going to do it.

Chris: I'm not going to do it.

Dave: It was like, "Wow, that is super cool," but the aircraft only costs like $12,000 or $15,000 - or something.

Chris: Hmm...

Dave: Kind of like in the side-by-side territory. I was just like, "Wow! What a weird--" Maybe it's like $100,000. Let me back that up. I forget. It's probably $100,000.

Chris: I like this capitalism, finding these weird price points that didn't exist before. You know?

Dave: Yeah, but it's like what can you do with--?

Chris: Very expensive but not so crazy that--

Dave: Yeah, a battery or a gas tank and a small motor, and here's what you can do. I don't know. Danger! You can make danger happen.

[Laughter]

Chris: Yeah. You sure can.

Dave: For sure.

00:45:58

Chris: I was talking to a random guy on a ski lift this season. He was like, "Oh, during the summer months, I teach people how to do this." It's like big wings that normally you jump off the side of a cliff and catch a thing and go for it. What do you call that? I don't even remember at the moment.

Dave: Paragliding, or whatever?

Chris: Yeah, but... Yeah, there you go.

Dave: Or like hang-gliding? Yeah.

Chris: But this you can also do with a motor. So, it's cool because that's silent and it's cheaper and whatever.

Dave: Yeah, yeah.

Chris: There are places you can do that in central Oregon, but we're more known for and it's easier if you have a motor because, a motor, you can just start from the ground then. You just... you know, so that's a little safer and whatnot. But still--

And it requires no... There's no certification or requirements at all.

Dave: [Laughter]

Chris: If you'd like to do that, you just go ahead and do it.

Dave: Yeah. You put a fan on your go-cart and just do it.

Chris: But he's like, you know, "Or you could come to me. I teach you how to do it." I'm like, "Okay. I'm sure you have plenty of students," or whatever. But even that just seems wildly dangerous, like, "Here's some fabric. Now go into the sky."

Dave: Good luck, everybody. Have fun.

Chris: [Laughter]

Dave: Yeah. Isn't that weird? That's so weird.

Chris: Yeah.

Dave: That we allow that, yeah.

Chris: Yeah. Don't need a license for a website either, though.

Dave: Yeah, true. Technically.

Chris: I don't know what to tell you.

Dave: Probably more dangerous to be making a website.

Chris: [Laughter]

Dave: Oh, man. Wrong business. I should have gotten into the danger business. Oh, well, Hey.

Chris: Oh, well.

Dave: Ground school, Dirt Skis by Dave Rupert, LLC. [Laughter] It's a pair of skis you wear to ride around in a cornfield. I could have done that. [Laughter]

Chris: That sounds amazing.

Dave: All right. Well, on that wonderful idea--

Chris: All right. Well, it's summer. Enjoy your summer some more. There'll be news forever.

Dave: Yeah. Enjoy your summer. We'll be back in the saddle. Hopefully, we didn't drop an episode. We are... You know. We're planning. We're good at planning, so we did it, I think. Anyway--

Chris: We did it.

Dave: You may catch me on the old laptop mic next time. Anyway, thank you, dear listener, for downloading this in your podcatcher of choice. Be sure to star, heart, favorite it up. That's how people find out about the show.

Follow us on Mastodon because that's the cool one. Then join us over in the D-d-d-d-discord at patreon.com/shoptalkshow. Discord is cool.

All right. Chris, do you got anything else you'd like to say?

Chris: Nope. Thanks for listening, everybody. Take care. ShopTalkShow.com.