Transcript

[Banjo music]

MANTRA: Just Build Websites!

Dave Rupert: Hey there, Shop-o-maniacs. You're listening to a ShopTalk Show. A podcast with Chris and Dave. We're going to do some hip-hop. Yay! What's up, Chris?

Chris Coyier: [Laughter] Lots of nothing. All the stuff. Thanks for the good intro, though. Love it.

Dave: Hey.

Chris: Appreciate it.

Dave: You do 590-some episodes of a podcast, yeah. You iterate on the intro a bit.

Chris: Exactly. Switch it up. You get bored.

No, this isn't going to be boring, though. I have some stuff. This is a Web components therapy episode, just for the beginning here, because there are a lot of people writing about it.

Dave: Web component therapy.

Chris: [Laughter] One of them is that we had... We've talked about Web components forever, and I think it's pretty good. But Light DOM Web components are having a moment.

Dave: Having a moment.

00:01:13

Chris: People are deciding that they're kind of cool. Lots of people have started this up. You were part of the party because you reintroduced FitVids, you know, . Got to have a dash in custom elements, of course.

Dave: Mm-hmm. Yep, yep.

Chris: One of the requirements of them. Then you may or may not put stuff inside of a custom element, right? You could just have nothing inside of there if you want to, right? You don't have to put anything inside of a custom element. You could do nothing, and it could output the most elaborate DOM you've ever seen inside.

Dave: Mm-hmm. Yep.

Chris: If you want to. But whether that's Light DOM or Shadow DOM, that's up to you. You don't have to use one or the other.

Dave: Yeah.

Chris: If you want to use the Shadow DOM, you can. If you do, you get a couple of things. You get the fact that I can chuck some styles in there. I almost said wank again. My brain wants to say that and it's not a good vibe.

Dave: It's not approved here.

Chris: Just whack it in there. Whack it in there.

Dave: [Laughter]

Chris: Whatever HTML you want to put in there, and then you could drop some CSS in there, and it's not going to bleed outside of the Web component. I'm so unconvinced that I even care about that anymore. Of course, I like style scoping, but we have scope in CSS now. It's just not that hard of a problem to solve that I don't want to use the hammer of the Shadow DOM to do that. But also, I can use stuff like a button element inside of it and not worry that styles from the outside are going to affect that element, too. I kind of get that part of it.

Dave: Mm-hmm.

Chris: But I want to have a little more control.

Dave: Mm-hmm. Mm-hmm. Mm-hmm.

Chris: But even like a query selector. From the outside, will not accidentally find something inside of a Web component, so it's not like I hate the Shadow DOM. I actually kind of like that it's kind of a cool Web platform thing that can be done. You can optionally use it. So, no real hate.

But I feel like the fact that I can scaffold out a Web component using stuff that has been from inside the guts of the custom element (or not) or augment it.

Dave: Mm-hmm.

Chris: Wrap a button. I can do any of that stuff, and I can just use the Light DOM, it's almost eye-opening to me. I'm like, "Yeah, that's what I would prefer to do."

I didn't quite understand that you could do that. At some point, I thought if it's Light DOM, it means that it's just the stuff that's inside the custom element.

Dave: Mm-hmm.

Chris: It just gets put into the Web component, and that's my only opportunity for Light DOM. No, it is not. You can do anything else. You can do inner HTML, that whole thing.

00:03:54

Dave: Yeah. Yeah. I think that's something I'm even realizing, too. I think a big part of Web components is the Shadow DOM, and so you should use it. You should know about it. You should--

But yeah, not every Web component necessarily needs the encapsulation and stuff like that that Shadow DOM provides. I think you get 5,000 lines of DOM injection going; you probably should snap a Shadow DOM in there at some point.

Chris: Okay. Yeah. It's like it's too much. There are problems that will come up because it's not encapsulated.

Dave: Yeah, you've just added DOM elements rather than creating a tokenized template structure that the DOM or Shadow DOM can optimize.

Chris: Sure. That might happen if you're injecting a map or something that has all kinds of interactive controls and depth and stuff, or whatever.

Dave: Right. Right. Yeah, I think I'm coming around to realizing custom elements are also a delivery vehicle, which is maybe not the right term, but it's just this idea of, like, it's a bundle. I'm wrapping. I'm including these styles in this functionality. You just send me whatever, and I'm going to try to make sense of it. So, it's a delivery vehicle.

What's cool about FitVids, the component... This is a weird problem we had on the repo. If you inject Web component fit-vids and then iframe my thing, it auto-instantiates itself. It'll automatically go, "Oh, okay. I'll just figure myself out."

Chris: Right.

Dave: Whereas in FitVids, the jQuery version, if you injected a new video on the page, FitVids had already run and done its job, so you'd have to call FitVids again on that video. So, it's just kind of cool. I don't know. You get some bonus freebie events and stuff.

Chris: It is better. I know you're hesitant to even do it, but you're like, "It's actually a kind of good way to do it."

Dave: Yeah. Yeah, and it works for my website. It would work in Markdown.

Chris: Yeah.

Dave: I could just chuck it on my sites now. I have a pretty okay... I just do the aspect ratio thing. But if I got into weird-sized videos or whatever--

Chris: Right.

Dave: The best video format changes, I've got to rethink my situation, so FitVids kind of works there.

00:06:38

Chris: Yeah. Right. To me, it's interesting that there's maybe this React or Vue model where you're like, "I'm going to put an on-click right on that button," and that's where the JavaScript is going to be. it's going to be part of the component.

Dave: Mm-hmm.

Chris: The code that executes is right next to it. That's super tight next to each other.

Dave: Mm-hmm.

Chris: Then there was the jQuery model or even the vanilla JS model that's like, "Well, I'm going to have to query selector for that element. I'm going to have to add an event listener. Then I'm going to have to listen for that event listener and do it." That's very loose. It's very far away code.

Dave: Mm-hmm.

Chris: Whereas Web components is kind of the middle ground to me. It's like, "I can take this existing DOM element and wrap something around it and apply the functionality there." It seems like middle tightness.

Dave: Yeah, there's this other discussion going on, like Brian Leroux and Zach Leatherman, kind of talking about is progressive enhancement, does it need a rebrand? And Scott Jehl, I think, is involved.

I think that's an old discussion, but I think people are like maybe we need a new way to express this that doesn't have the emotional baggage of progressive enhancement as a term.

Chris: Yeah.

Dave: I kind of agree. I'm like, whatever moves the ball forward. [Laughter]

Chris: Yeah.

00:07:55

Dave: But one thing I think I've realized is the whole idea of sprinkle some JavaScript. We need to kill that. I say, "Sprinkle some JavaScript," I mean one thing. I mean a jQuery function here and there.

It does not explain the process. That's not an educational statement. That's like, "Fill in the blanks, dude." Like, "You figure it out."

I feel like, for proper methodology, there needs to be something like where I would say, "Wrap it in a Web component," is way more explicit than "Sprinkle some JavaScript."

Find a Web component that does the job and wrap your component in a Web component or use a Web component. That's way more expressive than "Sprinkle some JavaScript." You know?

Chris: I like that. Yeah.

Dave: That's me. I don't know what the final term is, but that's just the idea, to me. I think if I were to criticize progressive enhancement, it's like, "Hey, just make your site work without JavaScript." Then somebody who is looking at an entire client-side React App is like, "Probably not. Nope." [Laughter]

They're like, "That's just not in the cards right now," or they're looking at... I think, even ten years ago, you'd have 10,000 lines of mustache code somewhere, templates and stuff. You'd just be like, "Dude, I don't think it's going to work. I think it's easier if I just go all JavaScript."

Anyway, progressive enhancement, I don't know. It just sort of was like, "Go figure out how to make it work without JavaScript," rather than, "Do these things, then do this thing."

Chris: Mm-hmm.

Dave: Need more of a formula.

Chris: Well, that's on my mind a little bit, too. I got started talking about--

Dave: Light DOM.

00:09:51

Chris: You can put stuff within the custom element or not. Right?

Dave: Mm-hmm.

Chris: If your idea is, "I want to put as little in there as possible," which I think you could be in that headspace. You can be like, "The point of me making this component is abstraction. I don't want to have any responsibility for what goes inside there because that's what the JavaScript should be doing. I think that's a reasonable thought but maybe one that can't last because it's not progressive enhanced at all.

Dave: Mm-hmm.

Chris: If the JavaScript doesn't run, you get nothing at all then.

Dave: Right.

Chris: Which is kind of a problem, right? So, you need to probably get into the thought of, like, "Each Web component I use probably needs some stuff inside." And you could think of it as a fallback, but it might be better to think of it as, like, "I should just put everything in there." And if it's too complicated and I'm not getting the abstraction that I want, then I should ask for that from my framework.

And so, it does appeal to me, speaking of Brian Laroux and Zach Leatherman, that they both have different approaches with enhance and WebC that do that.

Dave: Yeah.

Chris: That part of the build process does produce HTML that has all the crap barfed out inside of it that then ships to the browser, which means you get this complete Web component on first wrote or SSR, as the kids call it.

Dave: Mm-hmm.

Chris: That's nice, I think. I mean you are, in a sense, adding a build step then, and that is a moment of pause because, man, too many god-dang build steps in the world today. And part of the beauty of Web components sometimes is, man, if you don't need one, ain't that awful nice? Can I declaratively do this?

Even the Lit HTML approach, while I think it has some SSR solution, you don't have to use that. It can kind of be this client-only no-build concern, and that's appealing. But I don't think it's going to happen. I think if you want the real abstraction from Web components and you want good SSR and good progressive enhancement, it's built-step territory.

00:12:00

Dave: Yeah. Yeah, there's some work going on to make it more declarative where maybe you don't need a big build step kind of thing, or always need JavaScript for everything. But that's probably years off, realistically.

Chris: But even then, every Chris card element on the whole page needs to bring its own, all of its HTML then.

Dave: Yeah.

Chris: You have to author that somehow.

Dave: Yeah, and I mean there are different levels of progressive enhancement, like Chris card can have the Light DOM you put inside can be H3 Pepperoni Pizza.

Chris: Right. Right. Right. Right.

Dave: A class button "Buy Now." You can send that MVP, and it can have an image, too.

Chris: That actually might be better.

Dave: It might be better. Yeah.

Chris: I think of the image comparison one. That's a classic example in Web component.

Dave: Mm-hmm.

Chris: What's inside is just two IMG tags. That's it. When it fails, you don't want a weird div with little arrows on it being rendered on the page. That's not doing anything because it has failed to load the JavaScript.

What you want to see is just the two images.

Dave: A stack-a-roo. Yeah. You want a stack.

Chris: Yeah.

Dave: And so, I think you could say, "Okay, well, we can use name slots to slot in the image, the title, and the buy button." Maybe a description, a rating, or whatever - all the crap you have.

Then we can slot that into the specific Web component functionality - whatever that is. Maybe your rating turns into a user rating thing where a user can actually set the rating or can sort by ratings or jump to ratings or whatever or click and open a modal about ratings. Whatever that functionality is, you can enhance that from just a little bit of Light DOM.

Chris: Mm-hmm.

Dave: There's a lot of potential.

Chris: I'm just catching up. I'm sure that's been on your mind for ages. But now that this... I was so hesitant the whole time just because I just am a little salty about Shadow DOM entirely. I hate the styling solution of Web components, so I just don't... I just am like, "Screw it. I'm out." You know?

Dave: Yeah.

Chris: But now that I'm like, "Ooh, I can just not use it?" I feel more into it. I'm like, "Hell, yeah. I'll just not use it."

00:14:28

Dave: Yeah. No, there was an issue on... the Web components community group, I guess. But it was about this idea of open styleable Web components, allowing you to jump in and add styles from the parent. This is useful for Tailwind situations. This is useful for Bootstrap classes, existing CSS.

If you're writing greenfield, you can do whatever you want. But if you have stuff already or are mixing stuff or don't author the components, you kind of want a way to style them. You want your buttons to all look the same.

Chris: It was like, use Shadow DOM still, though? What's the point of Shadow DOM?

Dave: I guess it would be in Shadow DOM but open styleable would be kind of like open-close components, like you have access from the outside or not. Maybe open styleable would let you go through it. I don't know what the specific idea there is, but I went through, and I collected all these blog posts, like Manuel's, Eric Meyer's, all these other ones, these blog posts, and just put a big, like, "Here are ten blog posts where people talk about how open styling Web components would make their lives better," or they're reaching for Light DOM only solutions because the Shadow DOM is a major foot gun.

I was just like, "This is a very talked about issue." Of course, some dude is like, "Well, I don't need it. Here's what I do." It's like, "Yeah, dude. That doesn't... What you do sucks," or doesn't matter.

It's cool you figured out a hack that works for you. But we need non-hacks.

Chris: Yeah.

Dave: Web components, I think there's a future there. I think it just needs... People need to blog about Light DOM only or open styling would change the game for me, or I would use Web components if I could style them easier. A blog post like that would - whatever - launch a thousand browser ships. You know what I mean?

Yeah, I think there's a bit of a renaissance here. Web components are more useful, and some of that is the underlying technologies are more useful, like declarative Shadow DOM and stuff like that is coming to Firefox, I think, pretty soon. But browsers are all now evergreen. They're all now modernizing regularly, and they all have Web component stuff in it. So, finally usable, in my mind, within the last three years or so.

00:17:04

Chris: I like the Markdown angle. You should play that one up as much as you can. That's really strong, I think.

Dave: The MDX in Web components?

Chris: Yeah.

Dave: Oh, I've got Part 2 of that one. I wrote a blog post about it. It's "Just Use Markdown."

Chris: [Laughter]

Dave: But I got a follow up here. Spoils. [Laughter]

Chris: Mm-hmm.

Dave: I'll do a spoiler here. Let me pull it up.

Chris: Yeah, it might be a few weeks before this drops. Ooh... Sorry, everybody. Don't mean to pull back the curtain there, but we were one week ahead here.

Dave: Oh, yeah, so my Part 2 is "Seriously, though." It's just, "Write some stuff. Put it in a Web component and write some stuff."

Chris: [Laughter]

Dave: It'll pretty much work. Anyway, that's Part 2 of my--

Chris: Oh, that's beautiful. Yeah, like a real emphasis on it. Maybe not everybody knows this, but Dave's point is that the Markdown syntax supports HTML.

Dave: Yeah.

Chris: Do you want to just abort and into some HTML? Go for it. It works great. Which is funny because it's a little bit like, "Why was MDX so complicated then?" It's Markdown, but it allows angle brackets. You're like, "So does Markdown, though." You know? But I get that it's a little more complicated, so it needs to get parsed into a React component - or whatever.

Dave: Right. Well, it allows your React or Vue inside of whatever you're using. Yeah.

Chris: I know, but that seems like 20 lines of code kind of thing, not this is a huge, technological project. That's just ignorance. I don't actually understand everything it's doing.

Dave: No, but Web components, it's like... get the curse bleeper out, Enns. But it's fucking free, so--

[Laughter]

Dave: Just use that. You know what I mean?

Chris: Yeah.

Dave: Given a choice of doing something that has a cost versus doing something that's free, do the free thing, please. Break out of a build step.

Chris: I know. I know. People like spending money. They're like, "Do your kids want to go hiking or do they want to go to the indoor trampoline park?" You know they want to go to the trampoline park.

Dave: Oh, they want to go to the indoor trampoline park.

[laughter]

Dave: But I bought a trampoline, so the joke is on... No, we still went to the trampoline park, but anyway--

[Laughter]

Dave: Oh, man. But my daughter can flip. Anyway, let's go.

Chris: Oh, really? A flip? Oh, that's impressive.

Dave: Dude, she's into cheer. Cheer is way different than gymnastics. If you say gymnastics, she's like full, like, middle fingers to you, like, "I don't do gymnastics. I do cheer." And you're like, "Okay, sorry. Sorry, man." [Laughter]

Chris: Yeah, that's a thing. Don't screw that up, fool.

Dave: Don't mess up your kid's thing. But anyway--

Chris: I saw this great Instagram of this old lady. She's like, "You want to see my backflip, my double backflip?"

Dave: Ooh...

Chris: She starts jumping up her legs, you know, and people get behind her to catch her maybe in case it screws up or whatever. They're all ready, and she's going up and down on her knees, and then she just pushes both her arms backwards and flips a bird.

Dave: [Laughter]

Chris: Double backflip.

Dave: Good move.

Chris: It was so good. She pulled it off with vigor. It was the perfect Instagram reel.

Dave: Oh, man.

00:20:01

Chris: All right. Here's one for you -- speaking of MDX and stuff -- Code Hike, codehike.org. Go there. Check it out. Have you seen this thing?

Dave: Uh-uh.

Chris: Okay. Brand new, fresh.

Dave: Oh, yeah. I have. Yeah, you're walking through code. You get little snippets and junk. Right?

Chris: Well, it does all kinds of stuff. But I think, at its very simplest, it's just like a JSX or MDX.

Dave: Mm-hmm.

Chris: You're using the triple fence tactic in Markdown.

Dave: Yep.

Chris: And just say, like, "Oh, this is some JavaScript code," and it syntax highlights it, and it puts it on the page, and it does a nice job of that. So, it's just a syntax highlighter.

But of course, their tagline is, "Not just a syntax highlighter," because it can do all kinds of other stuff. It can highlight a line. Well, you'd expect it to be able to do that, right? But it can highlight multiple lines. It looks like it has a nice syntax for that.

Then it has this function called Spotlight where, instead of highlighting a line by giving it extra styles, it un-styles everything else.

Dave: Hmm... Mm-hmm. Mm-hmm.

Chris: It kind of un-syntax highlights it and stuff. But it looks like there are some animations, too. So, you can say, "Here's another code block, and I want you to transition one code block from the other code block," so slide in some lines, highlight some different lines, et cetera. It also styles it where it can tell you what file it is, which is pretty common for documentation.

Dave: Yeah.

Chris: You can use that or not use that. Everything about it looks pretty nicely done. But what's confusing about this to me... I don't know the story, so I'm not trying to talk crap or anything. But you go, "Oh, show me the demos then." The demos look really cool.

You can see three demos, and all the rest of them have a lock icon on them. If you click on one with a lock icon, it takes you to some page where it's almost going to show you it but it doesn't. It says, "This is a locked demo. In order to see it, five people need to sponsor this demo for $19 per month."

Dave: Wow!

Chris: As soon as there are five people doing that, then you can see the demo. Part of me is like, "Oh, that's wild."

Dave: Yeah.

Chris: You have to subscribe to something you can't even use yet just to see the demo of it, which is a little more than you'd normally expect. But at the same time, it's like, "Yo, people got to get paid here." Right? Asking for money to do some coding work seems okay to me. I kind of want to... I feel both sides of this, like, "Wow, that's more than I've ever seen ever in a project like this."

Dave: Mm-hmm.

Chris: And, "Meh, don't hate it." So, who is giving them money? Well, there's a huge list now. There are dozens of people giving them money, including Vercel, Browser Stack, Meta.

Dave: Wow!

Chris: Now money is being made and they're still locked - the things.

Dave: Huh.

Chris: And there's been no commit since June or July.

Dave: The greatest heist ever made.

Chris: You've got all these sponsors paying monthly and no progress and no unlocked demos. That part feels bad to me. I don't know. I have no idea who the person is. I don't know if they're a man or a woman or anything. But it does seem a little bit weird.

Maybe they got sick. It's the kind of time where you should shut your mouth. You don't know what the implications are.

Dave: Mm-hmm.

Chris: But it does seem weird to me to have this open-source project that's strongly asking for money, getting money, with no output. You're like, "Okay, well--"

Dave: Yeah. Was it $19 for me to see the thing? [Laughter]

Chris: I don't think you even get to see it. There are some demos that have two slots left, so if both me and you paid $19 a month, one of the demos would be unlocked, which assumes that it's ready to be shown at all. Maybe it's not even coded yet. I don't know.

I will say, though, it looks pretty nice. I wish it was a Web component is why I brought it up. I don't want to use MDX to use this.

Dave: Right.

Chris: I don't want to use React to use this. I want to just use whatever. I'd rather use a Web component to use it. [Laughter] I probably won't give you $19 a month. It seems weird to pay monthly for an open-source project, but I'd probably contribute if the future of it was a Web component.

Now I've said it publicly, so I'll commit to that. I will spend $19 once to support the--

00:24:04

Dave: Well, here's what's funny, man. I went into the GitHub page. I'm going to... 43% towards this $1,200 a month goal, which that's what I would want for working on something full-time like this.

Chris: Yeah, that seems right because it's part-time money.

Dave: If I'm powering Vercel's documentation, I better F'n get $1,200 a month. You know what I mean? And Meta's documentation. They should pony up.

Chris: $1,200 seems low almost at that point.

Dave: Yeah.

Chris: Especially if it requires some maintenance and stuff, which it probably will.

Dave: What's interesting is there are 27 sponsors currently and 85 past sponsors. So, it seems like a lot of people--

Chris: Oh, they bailed.

Dave: Went in and then they were like, "Wait. Nothing is showing up. I'm out." Hopefully, everyone is okay.

Chris: Yeah, let's assume the best here. I just called it out, like, I've never seen anything like this in open-source, 4,000 stars on GitHub. The thing has got momentum, so there must be a story behind a total drop-off.

Dave: I do like the pricing here: $19 a month fan, $39 a month backer, $99 professional startup, $299 a month business agency, $999 a month enterprise. I do like that idea of, like, you're naming the price for this thing through GitHub sponsorship.

Chris: Yeah.

Dave: That seems like...

Chris: Is it open-source is not? It could be a way to just be like it's not. It's a thing that you buy.

Dave: It's kind of not. Yeah. Yeah, like, you don't get to file issues unless you pay for it. Yeah.

Chris: But it's not. Clearly, there's a public GitHub repo and stuff. It's trying to be open-source.

Dave: Yeah.

Chris: Make the choice. Maybe it's--

Dave: People have to got to get paid. But yeah, it is sort of like a weird... I have no idea.

Chris: People have got to get paid, and they're notably not getting paid through open-source.

Dave: Yeah. Yeah, yeah, so I think that's cool. Yeah, but it would be nice if you didn't have to do full React buy-in. That would be... I wish people would start thinking that way, but I guess there's so much code in React right now, that's where people start. I don't know.

Chris: It's weird that that would be a requirement. You'd think that you aren't alienating the React crowd by not having it be React first. If it's a Web component and it absolutely kicks ass (like it looks like this thing could be), React people will use it. Will they not?

Dave: Yeah.

Chris: Or does it have to have React stamped 20 times on the outside of it?

Dave: Yeah. I don't know.

Chris: I don't know.

Dave: Yeah. Yeah. You'd think there are enough WordPress sites that people would want to build stuff for WordPress. [Laughter] Hey... Who am I talking--? What am I talking about?

00:27:00

Chris: Oh... I was spicey on my blog yesterday as I was... I don't know what... There are a number of things in a row.

Dave: The SEO one? You're mad about SEO.

Chris: Yeah, I was mad about SEO. I was mad about SEO.

Dave: Tell me about it. Get it off your chest.

Chris: I kept thinking about all these things that are related to that three-letter acronym (search engine optimization) that are just annoying in my life. One of them is that it's just endless emails that you can't really block as spam because they're from who knows what and they just look like a text email. But there's some jerk, some piece of freaking garbage trying, however they can, to convince you that you should put links to them on their site. It's just an unbelievable amount of email content, so that's annoying, but that's just some slimeball, right? Not every SEO person is that. Let's put them in the slimeball bucket and move on. You know?

Dave: The idea that you stole my email address from LinkedIn or some list or something, and you emailed me, I don't operate like this. Why would I ever?

If you stole my email, why would I ever give you money? You could be the best company in the world. You could say, "It's a free $10,000," I would never email you.

I'm never going to reply back. I'm not going to hire you to - whatever - boost me. I'm not going to hire you or put your boss on my podcast. I'm not going to do that. You're just... It's just... It's just the scammiest behavior. It's the bottom of the human food chain, in my opinion, just people who find an email address online and decide they are entitled to email it. I don't get it, man. I don't get it.

Chris: Hell yeah. Just unbelievable. Entitlement is a good way to put it.

Dave: Yeah. Yeah. Why are you entitled to email me?

Chris: There's that and, like I said, let's put them in the slimeball bucket.

Dave: Yeah.

00:28:56

Chris: Here's somebody I wouldn't put in the slimeball bucket is all the nice people, for example, who work on Yoast SEO. It's got to be the number one WordPress plugin, right? I've met Yoast. We've talked. He's been nothing but nice to me over my career, so I'm not trying to crap on your entire business, but that plugin annoys me.

I've used it for a million years, and I'm over it. It updates every five minutes with thousands of changed files, and I don't even... Ugh. The stuff that it's starting to do, which is like, "You need to use more keywords and stuff and AI," and I don't know. It's hitting me over the head with this concept of SEO that I just don't like.

Dave: Right.

Chris: I'm just super over it, so I'm on this tear to tear all these SEO plugins--it's not only that one. I've used other ones--off of stuff because it's just such a hammer of stuff. It started to occur to me that the whole point of this is just trickery.

Dave: Mm-hmm.

Chris: To take my stuff and try to beat the other guy and put it on top of their stuff.

Dave: Yeah.

Chris: The whole point is I'm not writing this for human beings. I'm writing for machines because I want to beat an algorithm. I want to beat everybody else. I don't care how good your content is. Mine's the most important and I want to be above you. It's this little rat race thing, and it changes over time, too. Right?

The rat race just will continue forever with algorithmic changes and stuff. Nobody is thinking about people. They're not trying to help people. They're trying to beat algorithms, and that bothers me.

Dave: Well, and it's not... You don't hear a lot of, like, "Dude, we've got to be at the top of Bing. Dude, we've got to." Like, "What's our Bing strategy?" You know?

SEO is to appease one company which has so much power. No offense if you work at Google. But you just have a search monopoly.

Chris: Yeah.

Dave: And it's to appease one company that people are doing all this stuff. Yeah, because there's money in it. I think that's what it comes down to.

Chris: Right.

Dave: There's just massive amounts of money being on top. But this happens, too, in other things like people pay to get their... They pay people to buy their app in Malaysia - or whatever - so that they can be at the top of the app store because, if you're in that top ten of the Apple app store, that's like 2x million more downloads than zero, than one download.

Chris: Right. The incentives are so high.

Dave: So high.

Chris: Yeah, and they're making money, and so it doesn't matter what I think. If there's money, people are going to do it. There's that.

Dave: But could you imagine if we tooled? If this was 30 years ago and you were like, "We've got to make sure our business shows up at Sears, man. That's really important." [Laughter]

Chris: Yeah.

Dave: "We've got to show up at the top of Sears. Get our refrigerator on an endcap." I guess people used to do that.

Chris: Yeah, true. There's also stuff like what if you had a conference for front-end developers and you did the keywords, you searched for "front-end developer conference" and some conference three years ago showed up at the top. You'd be like, "Oh, man. Am I so bad for wanting to try to beat them out? My conference is coming up. Shouldn't I win in some way?" There are thoughts like that that don't seem so malicious to me. But at the same time, I'm like, "Man, I cannot play that game. It doesn't seem good to me."

Then there's this whole idea of, like, if I play that game and everybody else is playing that game, that means Google needs to fight against us. Now there are smart people over there that need to be like, "Okay, well, this is what these people are doing. We need to de-emphasize that because what we're trying to do is have the best content be at the top."

Assuming good intent here, which I do, Google wants to put the best stuff at the top. But they have to fight to constantly adjust algorithms better so that it's not slimeballs winning; it's the best content. They're up against the wall, probably, trying to get that to happen. And they have other incentives like showing lots of ads, like - I don't know - maybe we'll keep people on Google's website and we'll pluck crap off of the website and just put that information at the top so you never even have to click at all. Just stuff like that that seems like, "Ugh..."

Dave: Yeah.

00:33:08

Chris: That bothers me too, so I'm bothered by emails. I'm bothered by the software. I'm bothered by what's happening with Google. And I'm just like, "Man, I just don't want to even think about this and play this."

Then of course, I read this great Verge article from Amanda Chicago Lewis. She goes to one... There are a lot of people that are upset about the article. I'm not one of them. I thought it was hilarious.

She goes to an SEO conference in Miami or something, and she meets some very nice people, interesting people, and not so great.

Dave: And some douchebags, yeah.

Chris: Yeah, of course. But the industry does attract that kind of people. It just does. I hate to say it. But there are some people that push back against me for even mentioning that article, like, "Eh, just clickbait garbage." I'm like, "Whatever. Read it."

I have thoughts. This comes from my experience. It's not just like, "Whatever Amanda Chicago Lewis says is what I say too." I just think she wrote about it eloquently and pulled lots of sources from other people that are upset at what search engine results pages are like these days.

Dave: Right.

Chris: It's not just her thoughts alone. She interviewed people. It is a whole very interesting story.

Dave: I love the person who tells Chris Coyier, formerly of CSS-Tricks, like gives you advice about SEO like, "Hey, man. You don't know SEO." [Laughter] Yeah. Sure.

Chris: I was occasionally, like I used Yoast SEO. Then I used some other one, too, that I thought would get us all as a team kind of doing more, like, "Before we hit that publish button, can we make sure this page kind of checks all the boxes of what it should be doing?" I'm not hiring incoming link farmers or anything like that.

Dave: Mm-hmm.

Chris: But if the title is about this, let's make the title something that people would want to click. Let's alt text of all the images, of course, not only for accessibility but also because that's an SEO tactic as well. And use headers without the thing that use the keyword.

I didn't last very long doing that, but I did have moments where I was like, "Yeah, we should probably think about keywords and stuff." Now I regret it. I won't do that again. I'm done with that.

Dave: Well, it's hard. Yeah, I wish it was just like you said, I think, in your post. Can I just write stuff and it be good and then I get rewarded? [Laughter] Not play the game. Could I just not play the game?

Chris: Right. And you can, but it's a longer-term game. I say this is how it should be, and Google will eventually reward you for your hard work. It's true.

If I decided to really get into quilting and started quiltingtricks.com, and I wrote two, three times a day for ten years, I'll probably get pretty good quilting search result terms. But you've got to be honest, and you've got to do a good job. It's got to be good content that actual quilters want to reach eventually.

Dave: Yeah. Yeah.

Chris: That's real. You can do that. But nobody wants to work for ten years. I get it. I don't.

Dave: No one likes the ten-year answer. Yeah. Yeah.

Chris: Nah, they don't, and that's... Yeah, I don't necessarily blame them but that's the deal.

00:36:26

Dave: You mentioned ads. I recently went through all my subscription services and started canceling them, pew-pew-pew-pew-pew, like saving $70 a month on crap.

Chris: Sure.

Dave: But one of them--

Chris: Love it. Oh, it's so satisfying, isn't it?

Dave: It's so... Yeah, I feel like it should be a national holiday.

Chris: [Laughter]

Dave: Every equinox or something, you know? The autumnal and vernal equinox is just reset the subscription day because all my subscriptions went up in price. I assume it's because of the writers' strike, but did the cost of sending digital content go up? I doubt it. [Laughter] So, why did all these get more expensive?

But anyway, sort of as a consumer protection to be like, "Hey, well, if you're going to just raise prices and not provide more value, then I'm out."

Chris: Hmm...

Dave: But one thing I cut back was my YouTube Premium, which gets you no ads and stuff like that.

Chris: Oh, my God! How did you do that? You did it, really? Did you install some kind of ad blocker or something?

Dave: No. I'm just... [laughter] just experiencing the ads. What's interesting is it's like having the opposite effect. Well, it's maybe the intended effect. I want to watch less now.

It's like I used to watch 20 videos in a row. Now it's like two or three and I'm like, "Okay, that's enough of that."

Chris: Oh... It was a way to taper yourself off of it.

Dave: Yeah, it's sort of a self-control thing. Then we even, for some things, like we're going to the ad version of Disney, which is kind of risky.

Chris: Okay. Yeah.

Dave: We had ad Hulu, but ad version of Disney. It's like if we find ourselves, like, "God, this is a lot of ads," or annoyed, we'll pay to remove the annoyance. But kind of choosing the ad-supported thing. I know that's sort of stupid, like, "Why would you ever want to watch ads?" But I save more money if I just get through the ads every once in a while. I don't know. It doesn't ruin my life to watch a 40-second commercial.

It's funny to watch services dial ads up and down, too. They'll hit you one ad, or they'll hit you with five in a row just to kind of try to get more out of you. Instagram does this. Twitter does this. It's like end of the month, watch, because they start putting more ads, I think, to end of the month, end of the quarter.

Chris: Oh, really?!

Dave: The number of ads goes up, for sure, for sure.

Chris: Oh, my God.

Dave: Just watch it.

Chris: I don't love it.

Dave: Yeah. It's gross.

Chris: Oh, it's funny. I don't know. I do get a kick of how that stuff works. I'm a watcher of the occasional... I want to watch a Wisconsin Badgers football game.

Dave: mm-hmm. Mm-hmm.

Chris: I try to catch them on Saturdays when I can, unless some real-life stuff comes up. I'm not one of those dads that's like, "I'll be on the couch."

Dave: At the bar. Yeah, yeah.

Chris: "Don't bother me." But there's the occasional Saturday where it really kind of doesn't matter, and I'd rather just have it on or whatever. I remember not so many years ago where it was really hard to even get it. You've got to sign up for this weird Big 10 Network thing, and it's $80 a month - or something. And it may or may not work on your Apple TV where you want to watch it.

Now it's just weirdly easy. Sometimes you might be like, "Oh, I've got to download Fox Sports," or something, but that'll work.

I don't know. Maybe it's just been random happenstance, but I feel like it's gotten a lot better. People want your money, of course. But if you want to watch something, you can find a way to do it.

Dave: Well, yeah. Yeah. Sports is a hard one, though.

Chris: Yeah, it is.

Dave: It's like... I don't know.

00:40:17

Chris: Forever, I used the Apple TV just because I like the interface. Roku is cheaper, and I like some of the spirit there, but I really dislike the interface. Very sorry. Can't do Roku. We tried the Google one, Chromecast.

Dave: Yeah, Chromecast.

Chris: Also not my favorite. I want a decent remote and stuff, and I do like the Apple TV remote because the scrubbing is super nice. The scrubber is just excellent on that.

Dave: It's pretty fun, yeah.

Chris: Okay, but there are problems with it. Now I've got an Xbox, brand new.

Dave: Hmm... yeah, yeah.

Chris: I'm part of the Xbox club. I would like to have a little ShopTalk Show party on there if everyone wants to get out their headphones and play Animal Party or something.

Dave: We should. I wonder if I... I think I set up a ShopTalk Show group a long time ago. [Laughter]

Chris: Did you?

Dave: Maybe I deleted it, but we could get a gamer club, a ShopTalk gamer club on Xbox. It'd be fun.

Chris: Yeah, I don't know, once in a while. I got it because I wanted to play with another friend who was going through some stuff. It was like, "We're going to--" I wanted an excuse. Maybe this is a man thing, but I'll call him any time, but we'll talk for 10 minutes, or 15 or something, but not hours.

Dave: Yeah.

Chris: I don't know why. It's not because I'm like, "I'm a man. I can't talk," but I don't know. It feels like, "All right, brother. See you soon." It's just my style.

But I feel like if we were playing games it could be more bonding over whatever. Just an idea.

Dave: Not to unplug from gender stereotypes, but I have heard men, in particular, are way more objective based in their relationships.

Chris: Hmm...

Dave: But decouple that. You don't necessarily have to fit in this box, but if you're more like... Some people are more objective, like you work and you're friends with people at work, whereas some people are more natural relationship-makers, and so they build relationships wherever they go.

My wife and I happen to fit the gender stereotypes, I'm sure. But you know it's interesting.

Chris: Indeed. Yeah. I've had a Switch, too. It's still relatively new, but I have that. My smart TV's interface isn't totally awful.

Dave: Smart TV interfaces are not my favorite.

Chris: It occurred to me that for stuff like Hulu or Apple TV or something, I have four things attached to my TV that can watch, which feels a little weird.

Dave: It's a lot, huh?

Chris: It's a lot of stuff that can do the apps.

Dave: Yeah.

00:42:48

Chris: We've kind of got to choose. I was like, "I've never liked the TV one because I know that the TV is subsidized cost based on it, so it's probably reporting ungodly amounts of information through the Internet." So, on the TV, I go into settings, and I turn off any wi-fi anything.

Dave: Good. Yeah, yeah.

Chris: Like, "You're not allowed to connect to the Internet." I trust the Apple device more in that way. Not that I'm tinfoil hat-y, but I also don't want you using my bandwidth. That goes off, so that one is out.

Dave: Yep.

Chris: Apple TV is good. I like the remote. Then Switch, I feel like it's a little too weird. I don’t know why.

Dave: Underpowered, yeah.

Chris: Yeah.

Dave: Yeah.

Chris: But now that I have an Xbox, which I went with the fancy one, the X or whatever.

Dave: Ooh... The S. Yeah.

Chris: S? S?

Dave: X. X.

Chris: I forget what it is.

Dave: The block. The refrigerator.

Chris: Because my TV is relatively nice, so I went with the one that has the highest res output and stuff. It looks amazing.

Dave: Yeah.

Chris: I love the Xbox interface. I think it's so nice. It's just a classy interface. It's way nicer than the Switch's stupid one.

Dave: Yeah.

Chris: But it's also got all the apps in there, so I wouldn't blame a household, even one where not everybody is a gamer, that they just rocked the Xbox as the thing to watch TV.

Dave: The media center? Yeah.

Chris: The problem is, it doesn't have a volume on the game controllers, and I ran it past Miranda, and I just knew what she was going to say. She's like, "I am not using a video game controller to watch TV." I was like, "All right."

Dave: My wife shut it down a similar manner when we....

Chris: Yeah.

[Laughter]

Dave: It was like, "It's all there. Look."

Chris: Yeah.

Dave: She's like, "No, it's not."

Chris: Nope. [Laughter]

Dave: "Nope, it's not."

Chris: That's a big no.

Dave: We have one Apple TV and one Roku.

Chris: One Roku.

Dave: And so, Roku is on the playroom TV. I like Roku because it's pretty stupid. It's very, like, you know.

Chris: Yeah.

Dave: Apple TV is like, "I'm in an app. Nope, I'm in a directory. Nope, Apple TV's recommending stuff from my apps now."

Chris: Oh, yeah. The TV app was a confusing thing.

Dave: Confusing. Then on the Apple TV--

Chris: The search doesn't work with Netflix even though the movie you're looking for is almost definitely on Netflix.

Dave: Yeah, on Apple TV, I'm logged in as my son for some reason. Okay. Weird. That's cool. Let's figure that out. Yeah, but I like the Apple TV more, but Roku is very serviceable to me, so that's kind of my pick.

Chris: Yeah, because I have four - or something - because there's the bedroom one, the downstairs one, the office one, and the playroom one. A little too much. Probably could downsize on that. But we have it set up such that if you add an app or move an app or something, and it's positioned on the screen, it just moves them on all of them.

Dave: That's great. Yeah.

Chris: Which I do kind of like that.

Dave: I would consider another Apple TV. I think even... One of my concerns is, are my parents going to be able to operate the TV when they come? [Laughter] Apple TV has had the highest success rate for that.

00:45:43

Chris: Nice. I always wanted to do, like, if I was going to learn Swift or something, I would do... You know how on CodePen you can go to a collection?

Dave: Mm-hmm.

Chris: Any collection, there's a little button that says TV mode, and you can click that. All it does is a very full-screen output of the Pen. But then ten seconds later, it just moves to the next one.

Dave: Mm-hmm. Mm-hmm.

Chris: It's just kind of like a screensaver, except for a screensaver that probably--

Dave: Does Pens.

Chris: --absolutely sucks your battery life down because probably what you're doing it on is some extraordinary canvas explosion of stuff.

Dave: Yeah.

Chris: It's not the most efficient thing, let's say. Certainly, more than video. I thought it was funny the other day, too. In the Apple keynote, they're like, "This new Mac laptop is amazing. It'll do 28 hours of video or 8 hours of browsing the Web," or something. It wasn't that dramatic, but it was like, "Ooh... that is an indictment of Web browsing."

Dave: Yeah. Old Johnny Grube was picking on that, I think.

Chris: Yeah.

Dave: Yeah.

Chris: That was uncalled for, I thought. But anyway, to make a Swift app that would do the collections thing or just pick amazing Pens, so I could leave my Apple TV on and have it be showing amazing Pens on CodePen. That'd be sweet.

Dave: I have a friend I met in Germany in a conference named Marcel, but he is learning Swift. He's a designer, so he's making all these really cool Swift things, and all these amazing little apps and stuff like that. Anyway, it's really tempting.

I'm seeing him have fun in Swift, and I'm like, "Ooh... Wouldn't that be fun to do Swift?" Pretty self-contained. I like the Web. I'm a gluten for the Web.

Chris: Yeah.

Dave: I think it wins always.

Chris: But something new is fun.

Dave: Yeah. If I'm just - whatever - fetching data and doing a little blip-bloop and cards floating around on top of each other, that could be fun.

Chris: If you're syncing data, I know that there are APIs and stuff. I'm sure Google has them for Android too, and whatever, that are like, "Just put the data in their iCloud bucket and get it out," or something.

Dave: Yeah.

Chris: I'm sure some app like Bear or something, that's what it's doing. It's not using Bear's AWS servers, right?

Dave: Right.

Chris: Probably not.

Dave: Yeah, yeah, yeah.

Chris: It's not some PostgreSQL instance somewhere that has this data in it.

Dave: Yeah.

Chris: But it could, right? There's, I'm sure, plenty of apps like Facebook and whatever that just use their own infrastructure, and that's the Web because it needs URLs to do it, and URLs are websites... [laughter] kind of.

Dave: Yeah. Yeah.

Chris: That's always interesting to me that it's like, "Yeah, you can go all in on native app development. But if your app does stuff, underneath it somewhere is still Web action.

00:48:39

Dave: Yeah. Could you imagine the migrate out of core data? What would that entail? How would you just be like, "We're going to pull the plug on Apple's data source and go full Android as well." God, that would be a nightmare maybe.

Chris: Well, right, because it's not just the data storage, but it handles doing sync well. I've always wondered about that because offline comes into it, too. I'm offline and I do some crap in Bear, and then it comes back online. But in that meantime, I've written some notes on some other app and whatever. It has to do all that syncing and not lose data.

Dave: Yeah.

Chris: You'd be on that on your own, which is not an insurmountable problem but not great.

Dave: No, no. Yeah, I kind of don't want to do that, or I don't want to code that myself.

Chris: No. If you're going to do it, it should be the thing that makes you a million dollars. It should be clearly a very valuable thing that you're about to add to an app, and you're about to undertake that journey because of the very clear value that it's about to deliver your app. Not just because, like, "I guess this app should have that thing."

Dave: Yeah. Yeah, if I had a million-dollar pile to cry into, I would consider doing it myself.

[Laughter]

Chris: Amen.

Dave: That would be something. It's interesting. It would just be like, "Ooh... Swift. Would that be fun? I don't know." I don't know. Apparently, they have a pretty good iPad app that teaches you how to code - or something like that.

Chris: It would be.

Dave: Swift Playground.

Chris: What would be interesting to me is the UI stuff. Don't they have some UI library that you not only could put should use?

Dave: Yeah! Yeah.

Chris: For your buttons and your lists and all that.

Dave: It's like a design system built into the dang framework or basically the programming language. You just say, "Tab bar."

Chris: Yeah.

Dave: Boop-bleep.

Chris: I even enjoyed... Not that I'm ever going to do this, but it's not through pure hate. But I liked how weird Flutter was to style stuff. It's almost declarative styling but you do it right within all the rest of your code.

Dave: It could have been this native stuff, but I started watching Flutter videos, too. [Laughter]

Chris: Yeah?

Dave: It's kind of cool. It's Dart under the hood.

Chris: Right. Right.

Dave: It's JavaScript-like, which is kind of familiar. But Dart has an interesting history just with it being... What was it originally called? Pepper or something like that a long, long time ago. But it was Google's replacement for JavaScript.

Chris: Is that their best answer to, like, Mozilla has Rust and Google has Go, so they need a language too, Apple needs--? Whose is Dart? That's Google, too, though, isn't it?

Dave: I think that's Google, yeah. Yeah, that's Google, too. Google also has Kotlin.

Chris: Yeah. Gees, shipping languages.

Dave: But Apple has Swift. I don't know enough here.

Chris: Facebook has the Metaverse.

Dave: I think Swift is even going through some changes. Facebook is drunk on Metaverse.

Chris: I've heard he's going to step down. He's done.

Dave: Really?!

Chris: No, I don't know. Probably not. But what he's got under his belt is a Metaverse disaster. But then there's this other guy who did all the Threads, and Threads -- whatever you think of it -- is doing well.

Dave: Taking off?

Chris: Maybe you should let that guy run stuff.

Dave: Oh, well, maybe that guy gets it. Yeah.

Chris: Or gal. I don't even know who he or she is.

Dave: Or gal, yeah. CEO of Threads. Got it.

Chris: [Laughter] Yeah.

Dave: It is Rousseau Kazi.

Chris: I don't even know if that's the person, but I could see it happening. Although, I heard the Threads team originally was - whatever - a dozen people or something. That's a little different in scale than all of Facebook.

Dave: Yeah, yeah, yeah.

Chris: You might want to baby step up a little bit.

Dave: Easier to make changes on a new thing versus the old thing.

Chris: Sure it. All right, dude.

Dave: Wrapping it up here. 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 the social medias, and then join us where the real party is over in the D-d-d-d-discord. Thanks, everyone, who supports us and sponsors us through all that. It really means a lot.

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

Chris: ShopTalkShow.com.