537: ShopTalk Live from An Event Apart 2022
Chris and Dave live from An Event Apart in Denver talking awkward break points, the npm web, Scott Jehl web criminal, web components, what is the purpose of a website, Svelte, and how does Figma do it?
Guests
Time Jump Links
- 00:23 Introduction
- 01:25 Conference sports
- 04:23 Awkward breakpoints
- 11:02 The npm web
- 12:06 Web crimes
- 19:46 Flexbox or Grid
- 21:44 Halloween costumes
- 22:38 Sponsor: Split Software
- 23:33 What trend do you hope takes hold in web development?
- 28:11 Web components
- 35:45 Who are Chris and Dave wearing?
- 36:38 What is the purpose of a website?
- 38:34 Viteconf
- 42:31 What do you think about Svelte?
- 49:34 How does Figma run in the browser?
Transcript
[Banjo music]
MANTRA: Just Build Websites!
An Event Apart Host: Hello, Web folks. As far as I'm aware, we were informed there would be no splash zone at this show. Anyway...
Yeah. Sorry. Maybe they'll change their minds. Anyway, thank you for joining us for this live recording of ShopTalk Show. I'm going to guess that at least some of you have heard of the ShopTalk Show before.
Audience: Yeah!
An Event Apart Host: Yeah?! It's a podcast with Chris Coyier and Dave Rupert, and they've done 536 episodes. Well, they've released 536 episodes. They probably have more in the can, and this is going to be one of them in the can.
I don't know. I don't know what I can say that would come even close to describing it, so we're just going to have Chris and Dave come out. Please give a welcome to Chris Coyier and Dave Rupert. Woo!
Audience: [Applause and cheers]
An Event Apart Host: Come on out.
Audience: [Applause and cheers]
Dave Rupert: Howdy, howdy, howdy, howdy. Hey there, Shop-o-maniacs. I heard a few Shop-o-maniacs in the audience. That's great. Thanks for coming.
Chris Coyier: Is this on?
Dave: Yeah.
Chris: Yeah, 537, this will be.
Dave: 537.
Chris: Pretty cool. Yeah, my voice is a little jacked up. I was yelling at the TV for some sports over the weekend. Like real, actual sports.
Dave: Which is a tad ironic because neither of us are sports--
Chris: Oh, yeah. I could care less, but it was fun to yell at the TV.
Dave: It's fun to yell at sports. I do like to yell at sports when sports is happening because sports gets the yells.
Chris: Yeah.
Dave: Yeah.
Chris: There's comradery and stuff. Everybody....
Dave: Hey, Chris. We're at a conference.
Chris: Yeah.
Dave: It's been a long time since we've seen each other in person. It's very great. But what do you think of the conference so far? Who is winning?
Audience: [Laughter]
Chris: [Laughter]
Dave: This is the only thing I care about is who is winning the conference, and who is winning right now?
Chris: Well, I don't know. Will got me fired up this morning. I was tired, but-- [Laughter]
Audience: [Cheers and applause]
Audience Member: Team Will!
Dave: Okay. We've got some Team Will. Okay. All right. Well--
Chris: For the first talk, and I was a little sleepy, and I'm like, "Ah, dang, yo. You've got stuff to say!"
Dave: Yeah.
Audience: [Laughter]
Dave: I audibly said, "Yo!"
[Laughter]
Dave: At one point because I was just like, "Geez. That's a good point."
Chris: Let me reflect upon it a little bit. There was a moment where he's like, "I'm going to get the top million keywords for a fricken' website, and then take all of them that Google puts images as the top result for, and then look at the images. And that's what your customers want."
And I was like, "Wow!"
Dave: Yeah.
Audience Member: Yeah.
Dave: Just a normal thing everybody does on Tuesday.
Audience: [Laughter]
Dave: They just check every million....
Chris: That was his example, right? Backyard swimming pools, that's what people want to see because Google knows because of crazy science, right? But it got me thinking.
Dave: Yeah.
Chris: We have all kinds of data at ShopTalk Show. Certainly, millions of keywords land people on ShopTalk Show.
Dave: Leaving clues. Leaving clues all over the place, right?
Chris: Yeah, so I took the top billion.
Dave: Yeah.
Audience: [Laughter]
Chris: And then found the top single one that only returns images from ShopTalk Show.
Dave: Yeah.
Chris: Just to see what are people looking for.
Dave: Yeah.
Chris: Visiting ShopTalkShow.com.
Dave: A data-driven podcast.
Chris: It was two white boys that started a technology podcast instead of going to therapy.
Audience: Yay!
Chris: That was the-- [Laughter]
Dave: Yeah.
Audience: [Applause]
Dave: Top result, huh?
Chris: [Laughter] That was the top.
Dave: Not paid. That's pretty good. If I understood the talk correctly. [Laughter]
Audience: [Laughter]
Chris: That's what image search comes up as.
Dave: I mean...
[Laughter]
Dave: That's good. Yeah. I think that sums it up: 530 public therapy sessions, I think is pretty good, so.
Chris: [Laughter]
Dave: It's pretty good.
Chris: So, I thought we'd reflect upon other talks of the day. Perhaps some more seriously than others. [Laughter]
Dave: Okay. Yeah, we can go a little more serious. We'll go in and out of--
Chris: Oh, I loved this one. I ripped this out of--
Dave: Jason's?
Chris: Jason's talk because every footer I've ever designed is broken at the slightly larger than phone size. [Laughter]
Dave: Oh, we should do a game where we take everyone's website in the room and pull it up at like 800 pixels.
Chris: Yeah.
Dave: And just laugh.
Chris: [Laughter]
Dave: Just have--
Chris: 800 is a killer.
Dave: Or like 600. Aw, God!
Chris: 600 is worse.
Dave: Aw, it's like--
Audience Member: 640!
Chris: [Laughter]
Dave: 640! Oh, we've got 640. Yeah, just being that; it's like the teenager of viewports.
Audience: [Laughter]
Dave: And you're just hideous looking and awkward, and your feet are ten times too big.
Chris: Yeah. All your columns are busted.
Audience Member: ...Nexus 7?
Dave: What's that?
Audience Member: How come no one designs for my Nexus 7?
Dave: Okay. How come no one designs for the Nexus 7? Good question. Ah, as a Nexus 7 owner, it quickly became out of date and stopped working. [Laughter]
Audience: [Laughter]
Dave: That was one problem with the Nexus 7.
Chris: Is that what they called it before the Pixel, or whatever?
Dave: Yeah. Right? It was before the Pixel, but it was like the old tablet. It was a good tablet. I won't lie. But every time I turned it on, it was like, "I have to update seven versions of Android." [Laughter]
Chris: Yeah. Jason, you'll recognize this as your slide.
Jason: I do!
Chris: [Laughter]
Jason: Somebody saw me ... "What the hell is going on here?"
Dave: [Laughter]
Audience: [Laughter]
Chris: We were just making fun of -- what's the worst pixel breakpoint?
Jason: 1120.
Dave: Ooh... 120?
Chris: 1120.
Dave: Okay. Yeah. Got big but not big enough. Yeah.
Chris: Like not worst, but the chances are of it having not been designed for particularly well.
Audience: ...576.... [Laughter]
Dave: Oh, gosh. We're all over the place. Okay. We got 240 here, the watch.
Chris: The watch.
Dave: The one Samsung Watch owner.
Audience: [Laughter]
Dave: [Laughter] He wants 240. What are the other ones? It was 517? Is that what I heard? [Laughter] Yeah, 517.
Audience: [Indiscernible] Yeah.
Chris: Yeah.
Dave: It's a rough one.
Chris: But for a long time, and this was a true quoted fact thing that people did, and I loved it, and I think it's even a decent philosophy today. Jason said you do that thing.
Expand your browser until it looks like shit and then, boom, you need a breakpoint. It's kind of good advice. I mean whichever direction you do it, but you find that worst tension point, and then you do it.
But then we got all into talking about -- how many times were container queries mentioned today over and over? You know? And component-based design and all this, it's just going to be this, which is still good advice, but we'll just make it--
Oh, gosh. Did that need a transition, Chris? No, it did not.
I better use typewriter effect. Oh, my God. I must have been bored this afternoon.
Dave: [Laughter]
Audience: [Laughter]
Dave: Add some extra time. Okay.
Chris: It's going to be expand your component until it looks like shit. Then you need a container query. It's still good advice, but that will just be the future of that type of work, I think.
Dave: It's interesting. Are you doing container queries yet? It has been approximately 13 days since you could use container queries.
Audience: [Laughter]
Dave: Have you flipped all your code over to container queries?
Chris: I talk in the morning, so we'll get into that.
Dave: Okay. All right. All right.
Chris: 9:00 a.m.
Dave: 9:00 a.m.
Chris: I don't think so, though. I don't think I've shipped a container query to production yet.
Dave: Yeah. Well, hmm... I am very much like, "I'm just going to do it, and it's going to be broken."
Chris: [Laughter]
Dave: --in Firefox for a bit. [Laughter]
Chris: Yeah.
Dave: Hopefully, they catch up before it lands in production.
Chris: It feels a little inside baseball -- overheard a conversation from people who probably know what they're talking about (and I won't name anybody) that said Firefox is going to go for it by the end of the year.
Dave: Ooh...
Chris: Don't quote me.
Dave: Ooh...
Chris: It was decent little birdy stuff.
Dave: I'm going to bet. I'm going to do insider trading on that.
Chris: [Laughter]
Audience: [Laughter]
Dave: I'm going to insider trade.
Chris: ...stock in November?
Dave: Yep. Buying Mozilla to the moon.
Audience: [Laughter]
[Laughter]
Dave: Diamond Hands. Yes.
Audience: [Laughter]
Dave: It's got to be good.
Chris: Yeah. Anyway. Maybe. Um... Oh, God. I put that in there randomly. It was almost because I wanted Adam to talk about it, almost because he's got--
What is the--? No. I can't do that to you because I think it's still beta. So, whatever.
Adam makes a plugin called Visbug that I think is really cool and worth you all knowing about, but it's just really advanced designer. It's like designer tools instead of dev tools.
Dave: It turns a website into Photoshop or Figma because you just turn it on -- beep -- and now you can move stuff around and be like, "Here you go. That's what I actually wanted it to look like," which is pretty cool if you're a designer.
Chris: It is pretty cool, but what I was thinking about is all the hoops that we jump through in the world to take a component system and be like, "All I want is ten layers of technology to take my fricken' components and put them in some other software where they can render so that I can drag them around." That's what I mean by position absoluteness. I think a design tool requires you. Like the primary tool, the default tool in design software is pick something up and move it or resize it, which that's not a Web thing. That's a design tool thing.
Dave: Yeah.
Chris: And it gives you that mental freedom of, like, "Oh, no. The button is going to go over here. I'm going to drag the headline down." You can make mental choices different and faster when you're in that position absolute mode.
Dave: Because it does, it just gives you an X-Y coordinate, basically, right?
Chris: Right.
Dave: And that's all. It's all built--
Chris: What if you could do that in the browser? And you kind of can in Visbug. Instead of having exotic software that takes your component system and puts them in design software, you could just render them out onto the page and then turn on the move tool and move crap around.
Dave: Chris Coyier, formerly of CSS-Tricks, is saying just use the position absolute for everything.
[Laughter]
Dave: That's the--
Chris: Maybe.
Dave: [Laughter]
Chris: And you know there's that other trick where you go, like, document.designmode=true.
Dave: Yeah! That's a good one.
Chris: Console, and it turns everything into content editable and stuff. I just feel like it seems inevitable that eventually design tools will use an actual browser-rendered thing.
Dave: It would be....
Chris: And nobody has really nailed it, and maybe it'll take ten more years.
Dave: You know what's interesting? Not to get full Web geek--
Audience: [Laughter]
Dave: [Laughter] But the original Sir Tim Berners-Lee, his original version for HTML, like for a browser, was to be an editor and a content server.
Chris: Yeah, the Read Write Web, right?
Dave: Yeah, Read Write Web, and so you could actually edit the page and click whatever they did, NextOS key S, and save it, and then it's done.
Chris: Yeah. That's funny. So, it was supposed to be Read Write Web. We ended up it being whatever it is now. What would you call it?
Dave: Read, and then a bunch of complicated stuff, and then there's a database.
Chris: Yeah, NPM Web or whatever.
Dave: Yeah. Now we're an NPM Web. Yep.
Chris: Yeah. Or all the way down where it's Web 3 where it's just write-only.
Dave: Write-only, permanent writes.
Chris: The immutable -- [laughter]
Dave: Immutable writes to an unscalable system. What?! Hey! So--
Chris: Which that's obviously a bad idea, and so is read/write. Maybe we already nailed it.
Dave: Maybe we're right in the middle. Maybe Blogger was the right answer.
Chris: [Laughter] Yeah.
Audience: [Laughter]
Chris: We should have stopped at moveable type, Dave.
Dave: We should have stopped at moveable type and Blogger.
Chris: All right. What else do we have to say? I stole this slide from Scott because I thought it was interesting because he was showing off Netlify functions and how it was intercepting Web requests. Then he wrote that the world's coolest cloud function that just took two--
Replace anything with anything URLs. [Laughter] That's horribly dangerous.
Audience: [Laughter]
Chris: Jesus!
Dave: How could that ever be misinterpreted in the hyper-fast Internet of screenshots?
Chris: Yeah, and then allows you to just steal absolutely any website.
Dave: Yeah.
Chris: [Laughter] Render it that looks like it actually came from this website.
Dave: No. No.
Chris: It's amazing what we....
Dave: I'm going to defend Scott. I think we should do more Web crimes.
Chris: [Laughter]
Audience: [Laughter]
Dave: I think we should steal websites more often. I'm on Scott's team, so I think criminal Scott Jehl is right--
Audience: [Laughter]
Dave: --that we should be just stealing websites and vandalizing them and putting them on -- pretending they're our own.
Chris: That'd be amazing. You take some website that has really good content and few ads.
Dave: Yeah.
Chris: Then you apply all of Will's thinking to it, right? Get the keyword research down.
Dave: Yeah.
Chris: Beat the original website at its own game.
Dave: Ooh, I'm going to beat Will.
Audience: [Laughter]
Chris: Then load it with ads.
Dave: I'm going to beat Will at his own game.
Chris: [Laughter]
Dave: I'm going to look at all billion images on Google, and I'm going to beat him. That's my goal. [Laughter]
Chris: Well, look at all the -- so, of course, it's crime-ridden, so all those websites are like, "Yeah, I'm onboard." [Laughter]
Dave: They love crime. So, who loves crime here? Netlify, Google, Akamai, Cloudflare.
[Laughter]
Chris: Yeah.
Dave: Yeah. All that crime.
Chris: But it made me think about a model that I think is important to understand because it was lost on me for a minute. It's not even going to be a joke, I'm afraid. But I just have to do this thing where I first heard of cloud functions through Lambda. That was like the original AWS tool thing where you'd write 28 lines of code, but they'd give you a URL to it. They still do that.
Dave: Mm-hmm. Mm-hmm.
Chris: That's how all these things work. You get a URL to it, and you hit it, so your browser can hit that URL and talk to it if it wants. A server could hit it - whatever. But you have to ask for it. IT's not just automatically applied to anything. It's just a little URL thing that you hit. But these edge functions, they might have a URL too, maybe, but they're fundamentally like proxies, like Scott described. It's more like a service worker. You don't have to ask for it to run. It just does run, which I think is mentally transformative a little bit. Because it just does run, you can do all this intercept-y stuff.
Dave: Yeah.
Chris: People make fun of React, like, "Oh, they ship a div. it's just a div with nothing in it." Fine. You could intercept it on the way to the browser, fill the div with stuff, and hit the--
Dave: It'd take you 42 minutes, but yeah, you can do that.
Audience: [Laughter]
Dave: And then, yeah.
Chris: Oh, no. That's--
Dave: [Laughter]
Chris: Dave, it's fast.
Dave: It's fast. [Laughter] I swear!
Chris: [Laughter]
Dave: On my computer, it's fast.
Chris: It's fast because... okay. I'm going to attempt to make this tomorrow, but I need to psych myself up for it now. The job of filling that div with crap is happening at a super-optimized little runtime.
Dave: Yeah.
Chris: On an Internet computer that's connected to the faster fiber optic pipes ever. So, you could give that job to that computer, or you could have it be the job of your little stupid phone on wi-fi to connect and go get the data and come back. Which one do you think is faster at filling the div with crap? [Laughter] You know?
Dave: Hm... Mega computer or my Cricket phone? Hmm...
Chris: [Laughter] Yeah.
Audience: [Laughter]
Dave: Good question. Good question. We'll never know, I guess.
Chris: Yeah. [Laughter] I know. It'd be hard to -- We'll have to spring....
Dave: The science is still out. Yeah.
Chris: ...to the party. See who wins. Anyway, I think that proxy idea is just interesting. We're going to see more and more of that....
Dave: I think some frameworks are starting to tie into this adapter idea, these meta frameworks like Nuxt and Next and stuff like that. You just give them code and they figure out, "Oh, okay. I can run this as an edge function, so I'm just going to do that." You wrote a client-side app but now you get server-side benefits.
Chris: Oh, yeah. That's amazing. You don't even have to think about it. It's just how the framework operates.
Dave: Yeah.
Chris: Yeah.
Dave: I think that's where I want to live. I just want to cobble together a website and then you figure out the best way to serve it. That would be better. Right?
Chris: Yeah. Yeah, right, because if you're saying, "Oh, there are four different ways you can render a component," it's a little hard. I'm going to have to pull that slide tomorrow (because I had another one) where I'm kind of like, "Okay, here's a website," and everybody thinks islands are cool recently, right?
Dave: Yeah.
Chris: If you just say islands, you get a little VC at least.
Dave: Yeah.
Chris: There's a header, and maybe that's just HTML that you just wrote. You just wrote it into the template, so that's up there.
Dave: Mm-hmm. Mm-hmm.
Chris: But then there's -- maybe the footer is like that, but the header has to be rendered server side because it needs a cookie about your login session and then whatever. It's going to have a thing.
Dave: Well, yeah....
Chris: And then some of the content hits an API, but does it hit the API at build time or does it hit the API at request time or something? Maybe there's some stuff that has to be client-side rendered because of something. Now there are all these different types of islands that have all these little different requirements of how they're rendered. I think that's going to be--
It's A) really cool and excites me and B) is too much. People will reject it.
Dave: Yeah. I mean I did have a situation where we were just like, "Okay, we're doing -- it's going to be fast. We're going to do a build time, right? We're going to pre-compile a build time." Then--
Chris: What kind of site was it?
Dave: It was like a five-paper, just like a five-pager.
Chris: Okay.
Dave: Just like a five-pager.
Chris: Yep.
Dave: We were just like, "We're going to build it." You know? We know how to do this. Build it.
Chris: Yep.
Dave: Then...
Chris: And then...
Dave: The client...
Chris: Said...
Dave: Said...
Audience: [Laughter]
Dave: "Hey, we have these testimonials." It's like, "Okay. Cool. Testimonials.html. I'm done, right?"
Chris: Yeah.
Audience: [Laughter]
Chris: How many?
Dave: Two thousand.
Chris: [Laughter] Two thousand testimonials. Super cool. Yeah.
Audience: [Laughter]
Dave: They all need to be on the same page. Also, we have quotes, and they also need to be on their own page. And a thousand quotes that they've collected over the years, and it was just suddenly like our build time went from 30 seconds to 75 minutes or something, 45 minutes on AWS. It was just like, "This isn't good," so we had to flip over to server-side render.
Chris: Was it like a server-side render like PHP include file?
Dave: Well, it went from deploying static files to AWS S3 to now we have to have an EC2 server to serve all that stuff, and these are nerd terms but it was just like this is way more expensive. This way more time-consuming.
Chris: Yeah.
Dave: Way more difficult. And somebody told me pre-compiling it would be fine, and it was until the requirements ballooned. You know?
Chris: Yeah. Yeah. That's too bad. It's a job for a database, I'm afraid. Two thousand anything ... SQL....
Dave: Well, Chris, to be fair, they were in an Excel file.
[Laughter]
Dave: They had thought ahead.
Chris: Man, I would overthink that so hard. I would invent so many ways around that. I'd be like, "Let's put them in a KV store and Reddit. We'll make them globally available."
Dave: Yeah. I mean--
Chris: [Laughter] Okay.
Dave: That's why we don't work together. No, I'm just kidding. [Laughter]
Chris: Rachel Andrew talked earlier, and she presented all this data about the usage of Grid and Flexbox and never once said that Grid is better than Flexbox.
Audience: [Laughter]
Chris: She just did not declare Grid the winner of Flexbox.
Dave: Which is really unfair. That was very unsatisfying.
Chris: Which was so strange to me, but you know what she did say? She said... [Laughter]
Audience Member: [Indiscernible]
Chris: Flexbox provided the faster horses, which is very much the--
Audience: [Laughter]
Dave: [Laughter]
Chris: --the most badass way of saying--
Dave: Yeah.
Chris: "Grid is better than Flexbox, you pleebs." You know?
Audience: [Laughter]
Dave: Yeah.
Chris: [Laughter]
Dave: Yeah.
Chris: It was just my favorite thing ever. You know? She's like, "You know Henry Ford. He insulted everybody and said that y'all are idiots and you want faster horses, but here I shall provide you an automobile, which is what you truly want." Grid, friends, is what you truly want.
Dave: Grid is what you want.
Chris: [Laughter]
Dave: Grid is what you want. Flexbox is what you think you want but Grid is what you actually want. That's my adage.
Chris: [Laughter]
Dave: Because you're like, "Ah, I could use Flexbox."
Chris: Yeah. I'm sick of the nuance ones where you're like, "Well, sometimes you want Flexbox." I'm like, "No." [Laughter]
[Laughter]
Chris: No more nuance.
Dave: No nuance in Web design. No nuance in Web design!
Chris: [Laughter]
Dave: That's like tombstone material for me.
Chris: [Laughter]
Dave: Here lies Dave Rupert, no more nuance in Web design.
Chris: It does not depend.
Dave: It does not depend.
Audience: [Laughter]
[Laughter]
Dave: We've been lied to for years.
Chris: This one....
Dave: ...big Depends has been trying to convince you it depends for years.
Chris: [Laughter]
Dave: It does not depends.
Chris: Are you doing a diaper ad?
Audience: [Laughter]
Dave: We are open for sponsorship.
Chris: [Laughter]
Dave: If anyone here works at Depends, we will gladly accept and wear your products.
Chris: [Laughter] Look at us.
Audience: [Laughter]
Dave: You know what? So, hey, Chris. I was thinking about Halloween costumes.
Chris: You were?
Dave: Yeah. You know what's funny is when you get the cool costume, and then they don't provide shoes. They just kind of -- [Laughter] They give you this cool costume, and then they're like, "Figure out the shoes."
Chris: [Indiscernible] [Laughter]
Dave: Yeah. Which is kind of funny, right?
Chris: They got the hat.
Dave: They got the hat.
Chris: They came with socks.
Dave: Hat, socks, but Bavarian shoes, they just didn't do it.
Chris: You know what I hate to tell you, ladies? That even fake men's clothing has pockets in it.
Audience: [Laughter]
Dave: See. Does that just fill you with outrage or what?
Chris: [Laughter]
Dave: I have like four pockets.
Chris: I know. Even these--
Dave: A belly pocket.
Chris: They went out of their way to make sure my giant phone fits in these lederhosen pockets.
[Laughter]
Chris: This cut into their profit to make sure that I, man, had pocket.
[Banjo music starts]
Dave: This podcast is brought to you by Split, the feature management and experimentation platform. What if a release was exactly how it sounds: a moment of relief, an escape from slow, painful deployments that hold back product engineers? Free your teams and your features with Split.
By attaching insightful data to feature flags, Split helps you quickly deploy, measure, and learn the impact of every feature you release, which means you can turn up what works and turn off what doesn't, and give software innovation the room to run wild. Now you can safely deliver features up to 50 times faster and exhale. Split feature management and experimentation, what a release.
Reimagine software delivery. Start your free trial and create your first feature flag at split.io/shoptalk.
[Banjo music stops]
Chris: This one came in through the--
Dave: Oh, from the forum here. We got, "What sort of trend do you hope to see take root in Web development in the next several years? Is there a particular user experience outcome that developers should prioritize, satisfying more than they do now?" Two-parter.
Chris: I'm obsessed with wanting the things that we build to have less tooling on them. If I want a trend to develop, I want the trend to be, "We're going to think about how this is editable and maintainable maybe just three years out."
Dave: Yeah.
Chris: I just pulled a project for a one-pager for our local meetup group because somebody DM'd me on our little Slack and was like, "Oh, the website won't build anymore."
I'm like, "Uh... It definitely should be just an HTML page. It says "Bend JS" at the top, and there's a link to a meetup.com, and then it's like copyright. There's nothing on it.
Dave: Yeah.
Chris: But it's Create React App, obviously. It might have been me because I thought it was funny to overengineer it for a thing like that.
Dave: For a JavaScript...? That's good. That's good. Yeah.
Chris: But it died. It just wouldn't build. Just incomprehensive. Why is this broken of all things? You know?
It's stuff like that. I happen to know how to fix it just because I've seen stuff like that before, but I have a feeling that anybody junior would just be like, "Pfft."
Dave: It's too many farts in the engine. There are just too many farts in the engine.
Why do you need that many farts? It's just a page. You know?
Chris: [Laughter] And that's just me bitching about one little thing, but it's like there is a little bit of a trend towards dialing back the tooling-ometer. And so, the question asked about trends. I'm like, if that's a trend then, you know, throw my weird red feather in the bucket - or whatever.
Dave: I think there is the trend of, like, we had Webpack for years as the dominant Web building solution. Now esbuild and Vite are out, right? I think that's an awesome trend. It's like, "You know what? It's not good, [laughter] reevaluation some software."
It was good for a time but, you know what? We can do this so much better and faster and with less brain melts in between. Hopefully, that's kind of what we're going for.
Chris: Do you think it's attached to the second question?
Dave: Yeah...
Chris: Whether you use Vite or Webpack doesn't automatically mean that the users--
Dave: Yeah. I think there's a slight trend towards more server-side rendered stuff, which I feel like I've been gaslit by JavaScript for ten years, and I'm raging. But that's fine.
But I feel like there's a shift towards server-side development now, and I really hope there's better tooling, like more server-side first sort of stuff.
Chris: Hmm...
Dave: But the idea, like, yeah, databases are good. We should connect to a database. I don't think there's a single -- Astro, even. Love Astro. It's not like, "Hey, man. Here's how to hook up to your PostgreSQL." There's not a post about that on the website. You know?
Chris: Hmm. Yeah, fair enough. It's like UIO API.
Dave: Yeah. Figure it out. You can figure it out here. [Laughter] You know? Love Astro.
Chris: Yeah.
Dave: And even 11ty.
Chris: Oh, I'm excited about this, though, because literally everything is cyclical. A lot of us have been around a hot minute.
Dave: Who has been around a hot minute? Anyone? Yeah. a couple of hot minuters. Okay.
Chris: Gosh dang right. You know what's going to come back? Client-side rendering.
Dave: Ooh...
Chris: Not that it's totally gone yet, but there's a little pushback towards SSR stuff, and it's going to swing again. And when it does, what are their little talking points going to be? [Laughter]
It'll be fun to think about....
Dave: Remember how Webpack was great, man? [Laughter]
Chris: [Laughter]
Dave: Do you remember 80-minute load times? Why don't we have that? It's like vinyl records. [Laughter]
Audience: [Laughter]
Dave: It's good. You had to get up every 12 minutes and flip the record.
Chris: [Laughter]
Dave: That's what we want, man.
Chris: Did you hate listening to music in your car?
Dave: [Laughter] Yeah. Portable music? No way, man! Not going to do it. That sounds awful.
Audience: [Laughter]
Dave: Buy records.
Chris: [Loud exhale]
Dave: I like records. I have quite a few.
Chris: Miriam Suzanne is here. She's been instrumental in all kinds of interesting CSS stuff lately.
Dave: Yep.
Chris: Digging into Web platform betterment. Her hands in all kinds of different stuff.
Was talking to Dave and I. Dave has been on a Web -- ShopTalk Show has talked about Web components a little too much, perhaps.... [Laughter] Not too much because, look, you've got a course. You're making money off of Web components.
Dave: Well, $10....
Chris: I'm onboard. I've always on the train of, like, obviously the Web should do it. But the conversation came up, like, "Okay, but are you using?" No, you asked us, "Are you using it? Are you using it?" It's almost always no.
Dave: Yeah, that was the thing. I think Miriam was like, "What would make Web components good?" The answer, it's just, "Are you using it?"
Chris: No.
Dave: Chris Coyier, formerly of CSS-Tricks.
Chris: I play with it sometimes because I think it's interesting.
Dave: Right.
Chris: And it's fun to podcast about.
Dave: Are you writing Web components on the daily? No.
Chris: No.
Dave: Is Miriam? No.
Chris: No.
Dave: Who here is writing Web components daily? We've got one hand. One hand in a sea of 10,000 people.
Audience: [Laughter]
Chris: [Laughter]
Dave: That's for the audio people. They don't really... Trying to make it look good. Okay?
Audience: [Laughter]
Dave: Okay. So, one hand in a sea of 10,000 writing Web components. Why?
I think, for me, it kind of comes down to the CSS question. Styling Web components is a little weird, right?
Chris: We should get Will on this.
Dave: Yeah.
Chris: You know?
Dave: Can Will?
Chris: The user of users.
Dave: [Indiscernible]
[Laughter]
Chris: Yeah.
Dave: I’m going to do that. I'm going to look at all the comments on Web components' Yelp page, and I'm going to find the--
Audience: [Laughter]
Dave: What do you call them? Diodes? Diagrams? Yeah, I'm going to find all the bigrams.
Chris: Yeah.
Dave: Ooh... I'm going to prove a point.
Chris: [Laughter] Good luck. So, we wrote that down as a question, though. That is actually a good question. What's one thing that would turn the tide? You'd be like, "Oh, they have that? Oh, sick. I'm going to use that now."
Dave: I would be curious if anyone in the audience has hot takes.
Chris: Oh, Mr. Adam in the front row. What do you got, Adam?
Adam: [Indiscernible] ...if they were as popular in the mainstream or just not mainstream ... immediately less attractive. If they were at the ... in every site, in every design tool, that would be....
Chris: Hmm. So, it's chicken or the egg-ish.
Adam: Kind of, yeah.
Dave: Okay. If they were popular, that would make them popular.
Audience: [Laughter]
Josh: ...popular ... it's only good at being popular.
Dave: Yes.
Chris: Yeah.
Dave: That was Josh Collinsworth, triple threat Josh Collinsworth. React is only popular because it's good at being popular - something. I'm bad paraphrasing. But JS Party did a really good podcast on that.
Chris: Certainly. Yes. Point taken, though, I think. Yeah, if you saw them on every blog post, all kinds of people would use them.
Scott has something to say, right?
Dave: Scott's got a hot take.
Scott: Declarative Shadow DOM.
Dave: Declarative Shadow DOM.
Chris: He did a trigram.
Dave: That's a trigram from criminal Scott Jehl, also a trigram.
Chris: [Laughter]
Dave: [Laughter]
Chris: Enemy of the state Scott Jehl. [Laughter]
Dave: No, that's a really good one. Declarative Shadow DOM is the ability to basically -- it's the sort of server-side rendering story for Web components. Basically, you can put the output of the components or -- here's a little trick -- webcomponenttricks.com -- you can kind of build your skeleton screens in there too, if you wanted. I know we all love skeleton screens (after Scott's talk). But you totally can. In theory, that--
Chris: Oh, that's smart. So, it doesn't do the whole thing.
Dave: Yeah.
Chris: It just does enough to be visually not a span.
Dave: Yeah, you can visually complete, sort of, you know, and maybe sneak in headings or something like that. But that declarative part is pretty cool. I think, good news, I think Safari has decided to take it up, so that's kind of always the -- with Web components specifically. Don't want to harsh on Safari too hard, but that's usually the catch-point for a lot of things.
Chris: Yeah. Right on. Yeah, we talked about the styling story a little bit. It'd be nice to--
Dave: Yeah, that gets me, too. Web components, they were like, "Hey, let's make Web components." Yeah, awesome. Cool. It's all encapsulated in the Shadow DOM.
Chris: Which is uniquely cool.
Dave: Which is cool.
Chris: It's not an iframe, and the styles are totally protected inside. React can't do that.
Dave: It's an egg. Nothing goes in the egg. Nothing goes out the egg until somebody is like, "Oh, I need JavaScript to go in and out." They're like, "Yeah. No, totally. We need JavaScript to go in and out."
Chris: [Laughter]
Dave: Then you're like, "What about styles?"
"No! That would fundamentally break the whole entire principle of encapsulation."
Chris: How about part and theme, though - or whatever? Who invented that?
They're like, "Here is CSS, but worse. You can have that."
Audience: [Laughter]
Dave: Okay. You can style it.
Chris: You had to name every single thing.
Dave: Yeah.
Chris: And there's no cascading. It's like, wow.
Dave: You can style it, but only these parts.
Chris: I'm sure smart people worked on that, but I was like, "Absolutely not."
Dave: It doesn't have the same vibe. Well, and I think the--
I feel like the issue with Web components is, who here feels like they're good at CSS? Anyone feel like they're good? A decent amount of people are raising their hands of the 10,000 people.
Chris: Yeah!
Dave: Yeah. It's about 8,000 people raised their hands.
Chris: This is the best!
Dave: If you feel like you're good at CSS, and then you're like, "Let me use Web components," suddenly, you feel un-good at your job.
Audience: [Laughter]
Dave: And that is a problem for Web components. That's a branding problem. [Laughter]
Chris: That's an interesting way to put it.
Dave: You know? You're like, "I'm good at CSS."
"You should use Web components because you hate React."
"Yeah, I do hate React. Okay, let me use Web components. I am not good at my job."
Audience: [Laughter]
Chris: That's why I always wanted -- and I hate to just throw things out there because I've never participated in standards anything, and I'm sure the are all kinds of caveats to why this doesn't exist. But what I always wanted was, like, I get why I can't just write "P background red" - or whatever - and it might not cascade in there. Although, weirdly, I think that one actually would because there are weird cascade rules of what is allowed in there and what's not.
But I get that there's some encapsulation. That it protects you against a lot of stuff because that's the point.
Dave: Yeah.
Chris: Right? But I always wanted, in CSS, then a selector that's like, "No, accidentally you can't reach in." But if there was some little part of a selector that was, like, the "I know what I'm doing" selector--
Audience: [Laughter]
Dave: Yep.
Chris: That then you could reach in, and that would just solve the whole kit and caboodle for me, I think.
Dave: Absolutely. Let's triple important.
Chris: [Laughter]
Dave: Bang-bang-bang.
Chris: You don't get to design the syntax.
Dave: I don't? Oh. They should put me in charge.
Chris: [Laughter] That's cool. That's our last slide, really. Let's pick the best one. Ooh... Maybe it's that one.
Dave: It's this one.
Audience: [Laughter]
[Laughter]
Dave: Does anyone have any questions? We have time for a couple few questions if anyone wants to ask Chris and I, AMA, anything.
Chris: It's actually better if you do. It's more of a comment - only in this one circumstance.
Dave: Yeah. It's more of a comment. Anyone have any just comments they want to get off their chest? [Laughter]
Audience member: Where are your costumes from?
Dave: Where are our costumes--? I'm not sure I know what you're referring to.
Audience: [Laughter]
Chris: You mean my normal clothes? [Laughter]
Dave: My eveningwear? My tuxedo? Amazon.com.
Audience: [Laughter]
Chris: [Laughter] Yeah. I went Alibaba, but I had a couple of weeks.
Dave: I feel like I'm at least going to get a Halloween out of them. You know? That's always good.
Chris: [Laughter] Yeah. So, comfortable.
Dave: It actually kind of is.
Chris: It's amazing.
Dave: For something under--
Chris: [Soft grunt]
Dave: I'm sure it's giving me an intense rash that I don't know about, but I'll find out about later.
Chris: No, my skin could be purple.
Dave: My skin could be burning.
Chris: [Laughter]
Dave: That's a sweet--
Chris: Let's talk about some more stuff.
Dave: Ooh, here. We've got a question here.
Chris: Yeah. Please.
Dave: Whoa! Existential question. What is the purpose of a website? We're all cars on the information superhighway, man.
Chris: [Laughter] Yeah. You've heard of White Snake?
Audience: [Laughter]
Chris: Laughing....
Dave: Forty-two. That's a good answer, 42.
Audience: [Laughter]
Dave: That's good. I mean I feel it comes down to a transference of information. I have some information or collection of data that would be valuable to you. Let's TCIP/IP handshake over it.
[Laughter]
Dave: Is that...?
Chris: I like the information one. I almost feel like I'd be better at answering it younger, you know? Because when I was young, I was like, "I'll just make a website." I just didn't even think about it. I was like, "Obviously, this should be a website. I'm going to write down my five favorite tacos."
Dave: Yeah.
Audience: [Laughter]
Chris: That should obviously be a website. And I didn't think of why. But then it clicks in your head that anybody could find my list of five favorite tacos.
Dave: Yeah.
Chris: Anybody with Internet access, and that's just cool. It's cool then. It's just as cool or cooler now because accessing the Internet is....
Dave: There was a period where saying you had a blog was not cool, though, like in the late '90s.
Chris: Yeah. It rollercoasters.
Dave: Yeah. No, I think--
Chris: What is that? Man, blogging--
Dave: Bloggers--
Chris: Somebody declares it cool again once every two years or something.
Dave: Any bloggers out there?
Chris: I'm always like, "Still here. Yo! Boom."
Dave: Boom.
Chris: Do you know how many blog posts this guy has written? A lot!
Audience: [Laughter]
[Laughter]
Dave: So many blogs. Here, we've got a question. Middle. Back.
Audience member: So... [indiscernible]
Dave: How guilty do I feel about being here instead of Byte Conf.
Chris: Vite.
Audience member: Vite.
Dave: Vite. Sorry. Vite.
Chris: I'm pretty sure it's Vite.
Dave: Vite. Okay.
Chris: Isn't it virtual?
Audience member: Yeah.
[Laughter]
Chris: Cool.
Dave: It's virtual, then I think I'm going here.
Chris: Then I'm going, baby. [Laughter]
Dave: I'm going to go here.
Audience: [Laughter]
Dave: I enjoy virtual conferences. I want them to be a thing that exists in the future because I think it's super important that you can stay at home and not have to find childcare for a week. That's kind of awesome, you know, so I hope that sticks around.
Chris: They've done a good job of marketing it. It does look pretty cool. I think it's also sort of StackBlitz Conf, too. So, whatever, #competitor, kind of.
Dave: Ooh, yeah.
Chris: There's always that.
Dave: Yeah.
Chris: But they're amazing, though. You see StackBlitz is so cool, how it runs. It can run Next in the browser, which is like, "How do you do that?"
Dave: Whoa!
Chris: What was I going to say? Do you think Vite Conf will have 13 years of Vite Confs? Hmm...
Dave: Ooh...
Chris: No, but that's almost cool. You know? I like it when a conference -- I like them both. You know? Like, AEA is amazing. It has incredible longevity. Amazing things have happened at this brand under this roof, essentially.
Dave: Yes.
Chris: Which is really cool, and there's some coolness about that. Also, jQuery Conf was cool.
Audience: [Laughter]
Chris: That was fun. They don't do that anymore. But I still remember it. It was cool. It had its hot little moment in the sun. You know? Everybody is talking about the same stuff.
There wasn't a MooTools talk at jQuery Conf. Maybe at the last one - or something - just to be funny. But there just wasn't.
It was all about the same thing. And everybody was hacking on the same stuff, talking about the same stuff. It brought together some people at the right time. Then they just turned it off.
I doubt there'll even be a Vite Conf 2.
Dave: Ooh... Whoa! Yeah. Whoa.
Chris: I don't know. It seems like it bundled some stuff together. It's a little exciting, but not that exciting maybe.
Dave: Yeah. I'd agree. I don't know. I do like technology-specific conferences. Those are cool.
Chris: I think it's going to be awesome. Good luck.
Dave: We're just going to talk about one thing. I think even when front-end, like when we started the podcast, front-end wasn't a job quite yet.
Chris: Yeah.
Dave: And so, it's even been cool to have front-end conferences or front-end talks or just this whole idea of, like, you can just care about the visuals, the stuff that goes to the user. That's a whole job. I think that's cool. I don't know.
Well, Frontend Design Conference was the first time we did a live show.
Chris: Oh, yeah. When you hear that, "Just build websites!" if you've ever listened to the show, that was at a thing like this where we made everybody do it.
Audience: [Laughter]
Chris: [Laughter] We should do it again. We're all tired and be like, "Let's build websites! Monday through Friday, 8:00 to 4:00."
Dave: [Laughter]
Audience: [Laughter]
Chris: [Laughter]
Dave: That's good. That's good. Yeah. No, so I'm not jealous of not being at a virtual conference. I enjoyed it, but I had enough.
Chris: [Laughter]
Dave: Virtual conferences were good for a time.
Chris: Yeah. The hybrid, that's the new thing.
Dave: Hybrid is good. Hybrid is an option. I realize Eric is there. I say hybrid, and he's like--
Chris: Meh. [Laughter]
Dave: Dollar signs just-- [Laughter] No. Because you know it's video teams. It has a cost, you know.
Chris: Yeah. What else we got, folks? Just a little bit of time left. I heard they have strawberry....
Dave: All right. Here we go. A good one right here.
Audience member: What do you think about Svelte?
Dave: What do you think about Svelte? Chris, you were talking about it earlier.
Chris: We just talked about how cool Svelte was just earlier because I was looking at this framework. I don't know what you'd call it. It's a processor of some kind. It was called mitosis, and I'd never seen it before.
The whole thing was they have yet another syntax you have to learn that's JavaScript-focused, right? But if you learn it, it can compile into any other one. The idea was, if you had to do this once, I would use it. If you knew that you had to make components and they had to work in React and Vue, just two, I would totally use this.
But it compiles to like eight - or something - which is an incredible amount of technical debt. I can't believe anybody would take that on for free. My God.
Audience: [Laughter]
Chris: Long story short - or whatever - maybe short story long in this case, [laughter] there's a little component, and it's just like a dumb to-do counter. It's like, "Button, call increment, and call decrement," and whatever. The React version is like, "Import. Use state," or whatever from the thing.
Dave: ...Yeah.
Chris: It's got its thing, and solid has got import use signal, or whatever the solid one is. It's amazing. You know? It does all the right things, and Angular is the weirdest one, obviously. Then you click over to Svelte, and it's like this big. It's like none code. You're like, "Wow!"
Dave: Yeah.
Chris: It makes the case for Svelte right on the mitosis homepage. And it's cool. There's no library. You don't have to learn a weird hook syntax or anything.
It almost had me thinking about regular Web components because that's a reason why I don't use Web components - one of them. I'm really hung up on this idea is that the reason we all got all hyped up on React (like 100 years ago or whatever) is because of state, that it would intelligently re-render little pieces of the DOM when it had new data and little user activity. That's what was exciting about it.
Then it turned out that, like, "Oh, crap. Building stuff with components is actually really compelling too. I can piece things together." Now I have state, and I have components, and I have some degree of scoping.
You're like, "Actually, maybe this is the right answer for the Web." Then it continued to be popular and dominant. Maybe it doesn't deserve that position anymore - React specifically. But it's still a good, conceptual idea.
Web components comes along, and it's like, "Oh, we'll be components too, but we'll give you none of that other stuff that you want."
Audience: [Laughter]
Chris: Including state management, which to me seems like table stakes for having it be useful.
Dave: You know how you love all that stuff?
Chris: But what if you don't need a fancy hook system? What if they're just JavaScript variables? Svelte is like, "Yeah, that can be the case." So, Web components could follow... maybe. I'm no genius, but it could follow some kind of path like that.
Dave: Svelte is cool. The tradeoff is you have to buy into the compiler, right?
Chris: Yeah, it's only compiled.
Dave: You're only -- that's it. You have to use this.
Chris: There's no Svelte in the browser, or whatever.
Dave: There's no Svelte in the browser, and if the maintainer ends up being a weird dude -- he won't. He's a good guy, but -- if the maintainer ends up being a weird dude, you've got a lot of code you need to fix. [Laughter] You know?
Audience: [Laughter]
Dave: That's something to think about.
Chris: Yeah.
Dave: Yeah.
Chris: Yeah. Yeah. Yeah.
Dave: But it's very cool, so.
Chris: There are too many frameworks though, you know? What are the chances I'm going to build something significant in Svelte? I'm just one dude, and it's like zero, unfortunately. You know?
Dave: And that's with frameworks or Web components or whatever. it's the power of the community behind it. It honestly doesn't matter how awesome your app or your framework or your library is. If no one uses it, it's ghost town, cobwebs, not cool. You know? Until A) somebody cool comes along and uses it like if -- I don't know -- Barak Obama shows up and says, "I'm going to start using Svelte."
Audience: [Laughter]
Dave: Everyone is going to start using Svelte.
Chris: Like it's a marketing thing sometimes too? Yeah.
Dave: Ooh...
Chris: Yeah. I saw one today. I'm going to shout it out because it looked reasonably compelling. It was called lightview.dev, I think was the URL. It looked like in the category of Alpine or Petite Vue where, unlike Svelte, it needs no compiler. You just write code and it does interesting, reactive stuff with no build step, which is compelling to me, especially because I just got done saying I want a fricken' website that still works three years later. Will the Svelte compiler, untouched, still compile your crap in three years without touching anything?
Dave: I don't think based on the current GitHub issues. [Laughter]
Chris: Based on current -- yeah. My general experience with not touching a website for three years has a very low chance. But if it doesn't have a build step, nothing can break. Anyway, lightview.dev.
But the website for it was really bad. I'm sorry. Whatever. I'm sure it's a real person out there. I'm not trying to dunk on you too bad, but bad in the sense of, like, it's just Times New Roman, full line length, like I'm going to apply zero CSS to this page.
Dave: Ooh...
Chris: Which is a little bit of giving up on it because it is a little bit of a game. If instead you put one of those -- made it like blue-pink gradient text and had one of those 3D backgrounds, maybe a little desert chrome on there.
Dave: Yeah. Okay. Okay.
Chris: You'll get some people that will use it just because they think it's cool. You literally will get users based on some dumb CSS that you've applied to your page without any technical merit at all. It's a game in that way.
Dave: Yeah. It works. I put a fake Paul Irish quote on a website we did--
Chris: [Laughter]
Dave: --and people downloaded the jQuery plugin. I'm just saying.
Chris: Yeah.
Dave: People are stupid sometimes.
Chris: [Laughter]
Audience: [Laughter]
Dave: Exploit it. You know? If you take anything away from this conference, it's that people are stupid and you should exploit it. That's what Will's talk was about. That's what--
[Laughter]
Dave: No. [Laughter]
Audience: [Laughter]
Dave: We're not getting invited back, are we?
Chris: Sometimes the stuff you say, Dave, is a little surprising, even to me.
[Laughter]
Dave: I actually got kicked off the marketing department at my company because--
Audience: [Laughter]
Dave: --get this, they didn't like this idea. I was like, "Oh, we need conference swag. What would be good conference swag?" "I got it," I said, "A shit list." [Laughter]
Audience: [Laughter]
Dave: And you write down the names of people you don't like in your office.
Audience: [Laughter]
Dave: And they said no.
Chris: [Laughter]
Dave: They said I couldn't do it.
Chris: I'm shocked.
Dave: I was like the Steve Buscemi, like lipstick. You know? [Laughter]
Audience: [Laughter]
Dave: Kind of crossing Dave off the list.
Chris: At least it's inventive. Yeah. Yeah. Like I've had enough - whatever - lip balm, SurveyMonkey lip balm. I have enough of that to last a lifetime.
Dave: They didn't want it. Can you believe that? Who would want it? Oh, all 10,000 people rose their hands. Here we go.
Chris: [Laughter]
Dave: One more question here.
Audience member: I've always been interested in this, and I'm more of a designer.
Dave: Okay.
Chris: How does Figma run so--
Audience member: Yeah.
Chris: --incredibly....
Dave: ...Adobe thing.
Chris: And why hasn't it ushered in an entire generation of other apps that work that incredibly well?
I don't know. Probably because A) it's WAZM, and that's new and weird, and not as many people know about it. I don't. I conceptually understand what it is, but I'm not--
Audience: [Laughter]
Dave: Yeah.
Chris: ...$100, I couldn't make a WAZM app for you in an hour. You know?
Dave: Yeah. WAZM is WebAssembly and, basically, you take nerdy computer stuff and compile it to something JavaScript can talk to. And so, complicated stuff like putting a button with a border radius on a page on a canvas. That's hard for a browser to do. [Laughter]
Chris: But it's like WAZM isn't a rendering surface, right?
Dave: No, but it--
Chris: WAZM is just behind the hood doing God knows what.
Dave: Yeah.
Chris: And then it's probably canvas, I guess, that drives everything.
Dave: Canvas, and so--
Chris: That's why it's like if they have auto-layout or whatever fancy crap they have that sort of kind of replicates what websites do. It's not actually Flexbox, clearly, because there's no Flexbox in canvas.
Dave: Yeah. I mean maybe they copied the Flexbox implementation and put it in WAZM to put it in there to do all the math. It's basically just like math machines because the one thing the browser is bad at is math. [Laughter] JavaScript math is super bad, and then you're just like, "Hey, do a bunch of math all at once." The browser is like, "Please don't. I'd rather not."
Audience: [Laughter]
Chris: You know what my favorite thing in Figma is? I'll take a full resolute -- I'll just hit Command-Shift-4 -- or whatever -- on my Mac, and then press spacebar and get the whole browser window. Then on a retina display, it's like 4,000 pixels big. It's just enormous, high-res thing. Just drag it onto Figma, and it's just like, boop. It's just there immediately. And I can zoom in so far just immediately. And you're like, "What is--? Wow!"
Audience: [Laughter]
Chris: Whatever is happening there is some crazy computer science stuff, but they do have a large team of, you know, they invested in that technology heavily. But it is amazing.
Remember. What was it, less than six months ago? Adobe was like, "Oh, yeah. Photoshop is in the browser now." We're all like--
It got like one little news cycle, and we're all like, "Yay!"
Dave: Yeah.
Chris: Then--
Audience: [Laughter]
Chris: Why don't we care more about that? That's amazing.
Dave: I don't know.
Chris: We're still all, like, "Oh, Figma now has -- you can use yellow."
Audience: [Laughter]
Dave: [Laughter]
Chris: Or something, you know. We're like, "What?!"
Audience: [Laughter]
Chris: That's why they got bought. Figma can do anything. Everybody was like....
Dave: We could all Figma at once. It's amazing!
Chris: Yeah. [Laughter] You're right. Figma is awesome.
Dave: Yeah.
Chris: They deserve it.
Dave: It's amazing what $330 million of engineering can do. You know?
[Laughter]
Dave: It's incredible. Uncanny.
Chris: It's cool to know what's possible, though. It would be interesting to see more apps shoot for that level of real-time-ness.
Dave: Well, and so, I said, "It's a win for the Web," on the Twitter, and I got called a capitalist pig or something.
Chris: No nuance in Web design, baby.
Dave: Woo!
Chris: [Laughter]
Dave: Anyway... But the idea of, like, for years I've heard, "Web versus native, native is better because... because John Gruber." You know? I've heard that for years and years. Then it's so cool to see Figma, a Web product--
Chris: Super win.
Dave: --super win.
Chris: Dominant.
Dave: And part of its success is just it's based on Web technologies, and that's what enabled peer-to-peer communication. That was a big collaboration point.
Chris: Yeah.
Dave: We used it eons ago.
Chris: I like how they have convinced us that files are stupid too. You know? We're a little too into files. [Laughter] Figma is like, "I don't know. It's ... little rectangles somewhere or something."
Dave: Yeah.
Chris: You put it wherever you want. And you just don't even think about files as a concept when you use it, which is, I think, better. You know what it is instead? It's a URL.
Dave: It's a URL, the power of the URL. That's what's amazing. It's all URLs under the hood.
Chris: Yeah. "You want to see this and/or work on it? Here's a URL." Sick. Sick.
Audience: [Laughter]
Chris: Where's your URL, Swift?
Dave: Yeah.
Chris: [Laughter]
Dave: No one is like, "Why isn't keynote taking off?" Because it doesn't have URLs.
Chris: Yeah.
Dave: Why isn't pages popular? No URLs. Think about it, man.
Chris: Think about it.
Audience: [Laughter]
Chris: Think about it. All right. Are we done? [Laughter]
Dave: We should wrap it up. Hey, thank you, dear listeners, for coming and attending this live show. We really appreciate it.
Chris: Yeah.
Dave: Be sure to star, heart, favorite it up, the podcast, whenever it comes out, or whenever you listen to it - or don't listen to it. Whatever. I'm not going to judge.
[Whispering] I will...
And follow us @ShopTalkShow for six tweets a month. And you can join us every day. We're over in our Discord at patreon.com/shoptalkshow.
Chris: You did the whole outro.
Dave: Yeah. Chris, do you got anything else you'd like to say?
Chris: Not really. I had a great time today, though. Hell yeah. That was awesome!
Dave: Thank you, all.
Chris: Woo!!
Audience: [Applause]
Chris: Thanks, An Event Apart, for having us. Thanks, everybody, for listening, and we'll see you later. ShopTalkShow.com.
Dave: ShopTalkShow.com.
Audience: [Cheers and applause]