A podcast about building websites starring Dave Rupert and Chris Coyier. Development, design, performance, accessibility, tooling, a little bit of everything!

Subscribe on iTunes or RSS

Twitter:

388 When Tech Works and When Tech Breaks

01:01:25 Download

Show Description

Chris and Dave talk about technology overwhelm, when tech breaks, when tech works amazing - and why and how tech sometimes falls out of favor.

Show Sponsors

Interested in sponsoring?

Time Jumps

Transcript

[Banjo music]

MANTRA: Just Build Websites!

Dave Rupert: [Speaking in a Fat Albert voice] Hey, hey, hey, it's ShopTalk Show. Boop-boop-beep-ba-dup-boop-ba-dup-boop Dave Rupert, boop-boop-beep-ba-dup-boop-ba-dup-bom-boom Chris Coyier.

Chris Coyier: [Laughter] Are you Fat Albert, Dave? I don't know.

Dave: I don't know. Happy Halloween--

Chris: Oh…

Dave: --or whatever month it is. Hey, so we're back. What a fun time we're having. We're learning about GitHubs and Gits and all things. I don't know, Chris. How are things on your end?

Chris: GitHubs, what do you mean? Oh, were you watching GitHub Universe or something or were you doing some Git work?

Dave: Well, I was dangitting my Git. [Laughter]

Chris: Oh, with Katie last week. Yeah. Yeah, yeah, yeah. That was good.

Dave: Yeah, but anyway, how are things over in your land?

Chris: Okay. Okay. My back is better than yours at the moment. Sorry about that.

Dave: Uh, yeah, so I am -- I'm having major health problems. [Laughter] Everyone loves to just talk about health problems but my back went out and it's been out for about two and a half months now. I'm finally -- I went to the chiropractor; that didn't do anything. I took a bunch of ibuprofen; that didn't do anything. I got a massage; that didn't do anything.

I was about to do acupuncture and then was finally like, "I'm just going to go to classic physical therapy." I went to the doctors, had x-rays, all that just to make sure.

Chris: Oh, man.

Dave: Yeah, I mean it's bad enough, and so I went to -- and now I'm doing physical therapy and stuff like that and so it's pretty intense, but most of it is like, "Here, lay on this ball." [Laughter] It's like, "Okay. Cool. I'll do that."

It's from sitting. It's from working. There's stress involved too, like my shoulders and back all clinch up. It's from working. How I sit is pulling on my sciatic--

Chris: Oh, man.

Dave: --which is causing my back to compensate, which is just wrecking me. Now, I'm trying to get back into life and I'm doing things. I'm trying to stand up during meetings. I have this standing desk, so I should stand up during meetings. It's at the point where it's like sitting hurts, standing hurts, and laying down hurts, so what are your options?

Chris: Oh, my gosh. Space, maybe.

Dave: Live in a pool?

Chris: Yeah.

Dave: Can I live in a pool? [Laughter] That's sort of where I'm at and, yeah, it's not fun. It has me thinking, and people can reach out to me over DM or whatever. I'm finding working with chronic pain is difficult. Maybe that's some privilege I'm acknowledging that I haven't had this problem before or, really, I haven't had it acutely until now.

You know that idea of long, sustained developer tasks like, "You can't interrupt a developer because they're a special superhuman who needs a bunch of focus"? I don't necessarily believe the other-ism of these developers can't be interrupted. We're not superhuman, but it does take a lot of brainpower to do a development task, I feel like. If you're interrupted, I think it does have a consequence to getting back into things.

It has me thinking about, like, what happens when your body is the interrupter, when that's the mechanism that's like, "Hey, you can't do this anymore"?

Chris: Yeah. Yeah, I mean I've had it in small ways.

Dave: It's tough.

Chris: Not with my back but RSI can do that for you where all of a sudden you have it and it hurts constantly. Your life flashes before your eyes, not because your fingers hurt a little bit because that's like, meh, whatever. It's not like the worst pain in the world. But it might mean that my entire career is over because, if I can't type, I'm done.

Sure, there are all kinds of interesting things. You could use Dragon Dictation and teach it to code with your mouth, but you know that you won't actually do it. That's one in a thousand people that actually pivot in that serious of a way.

Dave: Yeah. Yeah. Yeah, it's hard. Yeah, you just kind of sit there. You're like, "What are my options here?"

For me, it's even just like a satisfaction thing, right? If I can only do short tasks, will I ever accomplish anything of size or value? That's really hard to think about.

Anyway, I'm learning how this all works, right? I don't know. I'm just now starting to be like, "Okay, life is maybe different here. I probably have to take breaks every few hours, stretch, and do all this stuff."

Chris: Yeah. Hopefully, small changes can fix it for you and it doesn't have to be a massive change, but who knows. Maybe it does have to be a massive change.

Dave: Well, that's the thing with backs and stuff like that. Surgery is the last thing you want to do, really, for a back.

Chris: Right.

Dave: It could even just be -- you know, I don't even know. I don't know. …squats?

Chris: When somebody else is talking about their back, you're like, "How's my back?" I'm feeling it.

Dave: Yeah.

Chris: Do I feel strong?

Dave: Yeah.

Chris: On the opposite side of the coin here, maybe to take your mind off of it for a second, this occurred to me the other day because everybody talks about burnout, that very real phenomenon where you work too hard and you just can't anymore. Something snaps.

This is just tangentially related to that, but it got me thinking about myself and how this hobby that I have, which is computers, but it's my career too. It's a little awkward for some of us where we almost do computers too much.

Dave: Right.

Chris: I love it and it's my career and it's my business and it's my hobby… Anyway.

Dave: My wife is very empathetic and understands this -- not at all.

[Laughter]

Chris: It's just satisfying on so many levels. I've tried to even dig into why that is, in a way, but it's satisfying in a way that art can be satisfying for some people because you're creating something. It's like your canvas, in a way.

Dave: Yeah.

Chris: And it's this game. It's like if I make this little tweak, then maybe my revenue will go up, so there's some business satisfaction that can come from it. And there's just this nerdy, like, left-brain satisfaction to, like, solving an algorithm, a function, or something. All that stuff in a big pot of satisfaction, it's like computers can just be so satisfying. It's great. Anyway…

Dave: Mm-hmm.

Chris: Also, the physical requirements for it aren't that much. It's good to have a back that isn't fricking killing you, so sure. But there's a lot of -- you can use your computer from a hospital bed a lot of times.

Dave: Yeah.

Chris: I can be really, really sad one day and still be very productive on my computer. I could be very, very happy one day and be good on my computer. I broke my arms and didn't really have that bad of an off time from my computer--

Dave: Right.

Chris: --because it's just the way they broke it. But if I broke my legs, then I really wouldn't have. I'd probably be more productive because I broke my legs. That's why I relate this to burnout is that you can be in a really wide array of mental states and physical states and have it not really impact your computering ability.

Dave: Mm-hmm. Yeah.

Chris: Except for this moment where it tips the balance a little too far and you're like, "Oh, my God. My brain doesn't work because the pain threshold has crossed this line where, even if I can work a little bit, I can't work for very long and I can't do very hard tasks because my brain just feels clouded from all the pain." There is a line in which that stops being true.

Dave: Right.

Chris: But it's otherwise kind of amazing how much we can continue computering.

Dave: Well, yeah. It's that computers are very emancipating. It gives you a bunch of freedom and ability, even from an accessibility standpoint. A lot of people depend in their devices to get around. It's a superhumanizing tool, right?

What is it? What's the Steve Jobs quote about the bicycle? A computer is a bicycle, or whatever.

Chris: For your mind, right?

Dave: For your mind, right.

Chris: Wasn't it about, like, it's incredible how little energy some animals can use to move, like the condor or something is otherwise the top animal because of how little energy it needs to get really far. But then most animals, they don't really use tools. I'm sure there's some monkey that sticks a stick in an ant hole, gets some ants, and eats it. Thus, the stick is a tool. But humans really use the heck out of tools, obviously.

Dave: Yeah, yeah. We even built a catapult to--

Chris: Yeah.

[Laughter]

Chris: Or we built a computer, dangit. That condor equation of how efficient they are at moving is out the window when you factor in even just a bicycle. Then, all of a sudden, a human being's energy output for movement is much further than even the condor, so a bicycle for your mind.

Dave: Yeah, it's cool, but it's kind of like a prison too, right? You have a fricking cold, like green snot is coming out your nose. You're like, "Well, I'm just going to lay in bed and power through some emails," or whatever.

Chris: Yeah. Exactly! [Laughter]

Dave: "I'm just going to clean out the inbox on my iPad," and it's just like that stinks. Why do we…? Anyway, we can't just be sick anymore. You know what I mean?

Chris: Oh, I'm terrible at that. I can't even walk down the stairs without swiping a few emails. It's unbelievable.

Dave: Yeah, and so whatever. It's this beautiful emancipator. I was thinking, if I have Slack on my phone, I can mostly do--whatever--a lot of my job and I can go to the coffee shop or whatever, if Slack is on my phone. But then, having Slack on your phone is so annoying and stress-inducing [laughter] at the same time. It's like a "both" "and" thing, you know?

Chris: Yeah, this will evolve over time. I think we've watched it evolve with built-in tooling to warn you about things and measure things like that.

Dave: Mm-hmm.

Chris: The answer isn't as simple as "Just leave your phone at home," or "Uninstall stuff from your phone." Those are early answers to these questions, but there's probably more like a dial that you can turn where it's like, "I don't necessarily want to leave my phone at home, but I want to set some expectations of myself and others of when I am away. It's just a bit more complicated.

Dave: Yeah. Well, or it's like you get the lite phone, right? Do you use a lite phone to break away from technology? Freedom, right? Okay, I'm doing that. I love that until somebody texts me a picture of my kid or a video. Then it's like, "Ugh, I wish I had that smartphone again," or I needed a map. Ugh, I don't have a map, so now the paper phone doesn't work anymore.

Chris: Yeah.

Dave: All that stuff is cool and there needs to be a way to break from technology. I don't know. Huh…

[Banjo music]

Chris Enns: This episode is brought to you by CloudBees Rollout. CloudBees Rollout is where developers come to ship changes at will. CloudBees Rollout allows you to manage feature flags at scale so that you're empowered to continuously and intelligently roll out changes as soon as they are code complete on any platform, even mobile. You can decouple development from code releases for real-time change control. Rollback only the changes you want.

CloudBees Rollout also allows you to deploy features to different segments of your user base, segment by any property or attribute, and create static and dynamic segments. You can also use multivariate flags for A/B testing and nix misbehaving features with a kill switch.

You can check out their 14-day free trial and experience how CloudBees Rollout can help you rock every release. Follow the link in your podcast player right now or visit rollout.io for your 14-day free trial. Our thanks to CloudBees Rollout for sponsoring this episode of the podcast.

[Banjo music]

Chris: I have some notes here about other things related to this. This is a decent segue into that.

Dave: Sure. Sure.

Chris: Just because lately -- and this happens. I think things come and go in waves but, once in a while, you start to feel overwhelmed with technology things that break and that, ultimately, you feel helpless about. Even you and me, we've been around computers for a long time, have a decent degree of confidence and skill in fixing technology problems. That's what I do all day long.

Dave: Mm-hmm.

Chris: If a problem comes along, I can probably fix it.

Dave: You must fix it.

Chris: Yeah. [Laughter]

Dave: (Speaking as if singing) If a problem comes along, you can probably fix it.

Chris: You must fix it.

[Laughter]

Chris: Of a wide variety of stuff too. That's why we are enlisted to fix our parents' email and stuff like that because we've had a lifetime of experience doing that. It's interesting when the problems come along that they happen and they still have the power to make you feel helpless. You're like -- [loud exhale] -- I don't know. You know?

Dave: Yeah.

Chris: Or that you're mentally just not ready for it or it's like, "It's Thursday. I have things to do. I can't. This feels like an all-dayer or an all-weeker for me to dig into." You just feel deflated.

Dave: Yeah, there's nothing worse. I've had that with computer problems. I know a lot of friends who have the MacBook. There's a new MacBook coming out so, for $5,000, you can fix this problem, but their keyboards keep going out. It's just like, "I just need to work, but my S key stopped working for the third time."

Chris: Ugh!

Dave: What do I do? You know what I mean? When you are helpless to fix the problem or powerless, there's nothing -- and I feel this with my back, too, the same sort of deal. When you're helpless to fix the problem or somewhat helpless and the pathway to getting better or fixing the problem is not clear, that is just destroying. It is a destroying feeling.

Chris: It is. It's a special kind of helpless because it's not like, "Oh, I lost my key for something and so I just have to wait until Sue from DevOps gets in….

Dave: Comes over and unlocks the building. Yeah.

Chris: That's kind of a version of helplessness, but it has a clear path forward. It has an answer.

Dave: Right.

Chris: There's just something that can happen. But sometimes this is something that you're the only gatekeeper of and nobody is going to come along and help you. It's broken, and so -- meh. They've been piling up for me. A rapid-fire, I'll do them.

Dave: Okay.

Chris: I upgraded my plugin in WordPress for my forms that's called bbPress to 2.6. A big release. It's been years in the making.

Dave: Okay.

Chris: Ran some database queries because it needed to make them and then my forms are just wiped on CSS-Tricks.

Dave: Oh, no.

Chris: I don't have a boss on CSS-Tricks. I don't have anybody to help me with that. All I can kind of do is peruse some forums, think about rolling back, but not super-duper sure how to do that, especially because it had a big database migration in it. If I'm going to roll it back, it's a big rollback. You know, probably ask my host for some help and find a backup that's not too old, but only replace the right tables, not the content tables and comments tables. It's just a big, complicated thing, and I'm just like -- flah!!

It feels helpless to me because I can probably rope some people in. I can probably get through this, but it's like, [pouting] why? You know?

Dave: Yeah. Now you have a remodeling project.

Chris: Yeah, which is just landed in my lap.

Dave: The toilet started shooting water and so now you have to fix it, so that's tough.

Chris: Yeah, I lose a remote control for a TV and I'm like, "You know what? I'm going to buy one of these fancy remotes. Why not? That way I can control all my stuff. I'm not searching to replace the exact remote that I lost. I'm going to get a fancy remote."

I get it. It downloads an app on my phone, and the app sucks on the phone. It's clearly poorly designed. This is a Logitech Harmony remote.

Dave: Oh, I had this one.

Chris: I've had these before, over time, and they all suck, at least for me. Even the base technology of it still sucks. It's like you have these little tiny IR things that have a really long cord attached to them that you're, what, supposed to mount to a plant or something in the back of your room and that behaves as your remote? You're like, I want a remote so it doesn't have a wire. Oh, my God!

Anyway, that aside, it does work for some stuff like Apple TV and stuff where it's supposed to. You set up all your devices and you set up your actions and all this stuff on the app now. Okay, that makes sense. That's a little better than it used to be having to do it on this tiny screen on the remote itself. Then it has to sync to the remote. Well, the synching process just doesn't work. It goes 1%, 2%, 10%, 12%. On mine, it gets up to 58%--and I've done this like 6 times now--and it just dies at 58%. The entire remote is useless. I can't reset it. I've tried 100 times to do it.

Anyway, that's not as bad because I can take this remote and throw it in the junk or return it to Amazon, which is what I'm actually going to do. But it's still this helpless thing like, [whining] my God. Why can't technology just work?

I get this new iPhone. I buy a 2018 Chevy Tahoe because this is our brand new, fancy car for the family. We got it after Ruby was born.

Dave: Okay. Family van. All right.

Chris: Yeah, or I think we got the '17 instead of the '18 because there were very little differences. One of the things in the '18 was that it had a charging pad for your phone that works.

Dave: Heck, yeah. Okay. Yeah.

Chris: Nice. I want the charging pad, but the 2017 didn't have it, so we still went for the '17 because, you know, it was significantly cheaper or whatever, but then had them install the '18 charging pad in it.

Dave: Ah-ha!

Chris: It was a little pricy, but we did it. It's nice. Okay, we got the charging pad thing in there now. Then I get the new iPhone and it doesn't work with the charging pad anymore, so I got like eight months of usage of it.

Dave: (Indiscernible)

Chris: [Laughter]

Dave: Cripes, almighty.

Chris: Come on!

Dave: Ugh!

Chris: Okay, so now I'm working on a new series for CSS-Tricks.

Dave: [Laughter]

Chris: Dave, you're going to be a part of it. It's going to be great.

Dave: Yeah, yeah.

Chris: We're going to write some stuff, so I'm working on CSS-Tricks, just creating some templates, writing some CSS, getting this thing going, and I have a Gulp process for CSS-Tricks. It's worked fine for a long time. I migrated to it. I can't remember why exactly. For a long time, when I'm working by myself, I just use CodeKit or something to process my crap. Gulp could do a whole suite of things, and I'm pretty comfortable with Gulp processes anyway.

Dave: Yeah.

Chris: I'm working on it but, lately, it started to do this weird thing. I have all these steps. When it processes my CSS, it runs Sass and then it runs auto-prefixer. Then it minifies it. Then it moves it over here. Then it cleans up after itself. There are a bunch of steps.

It's starting to do race conditioned stuff. Have you ever seen this?

Dave: Oh, yeah.

Chris: It moves stuff to a folder too late. Then the cleanup doesn't get it.

Dave: Yeah, so it's like compile my Sass or whatever and then format my CSS, or something, or format my Sass, and then it will be like, "Oh, I detected a change, so I'm going to compile and then I'm going to come back and then I'm going to do this." Yeah. Especially in a watch task or whatever, it gets really overburdened.

Chris: Right. I have a watch task for sure, too. Anyway, I build this thing in Gulp 3 because there's Gulp 4, which I think is widely regarded as a much better improvement to Gulp-land, kind of modernized a ton of stuff.

Dave: Mm-hmm.

Chris: But there's this funny thing where they've decided to bundle the CLI. That's what Gulp Global is, is the CLI, where it used to be Gulp and CLI separately or something like that. The CLI at one point was 3.9-something but, for some reason, now the modern version of the CLI is 2-point-something, so it's like a backward movement in the CLI version or something. You're supposed to install that globally.

Dave: Yeah.

Chris: Gulp is a local thing you NPM install or you uninstall or whatever. But the CLI stuff is global, so you can just use it wherever. Fine. I don't even care. These days, I'm so used to just doing yarn run gulp something-something anyway to keep it local, but who cares.

I cannot get the fricking CLI to downgrade from 3-point-something to 2-point-something and, within that state, it won't run Gulp 4. Because I'm trying to solve this race condition problem, I'm throwing the kitchen sink at it, Dave. I'm trying to restructure my tasks and use different sequential task runners.

Dave: RMRF node modules?

Chris: Oh, yeah.

Dave: Like the root node?

Chris: Yeah, I've done a million things to try to fix this problem and I just can't get it. It's one of these helplessness things where I don't have a boss I can call. I can't even really Stack Overflow this thing with my own question because it's so specific to my busted ass setup.

Dave: Mm-hmm.

Chris: When you've read 15 tutorials on how to do this and nobody has covered your specific thing, you're kind of like you're lost, man. You're in the woods.

Dave: Mm-hmm.

Chris: You're just like, "I don't know what to do." I only put all these things together not just to whine, because I'll probably, ultimately solve all these things somehow, someway through getting help and stuff, but even us, you know, or even me, anyway. I get myself into tech situations where I still just feel totally helpless.

Dave: My yesterday, do you want to know my yesterday? Prettier plus stylelint plus ESLint, like, oh, buddy. That was my whole day. Who is doing what? You install some VS code plugin, the Prettier. You have to install the plugin to get the format on save to work, right? Then you have to install the node module in your project to get it to register that it can actually format on safe. Then you get into stylelint. Then there are all the rules, like where you can save the rules and stuff like that, but you don't even actually want to write your own rules. You want to just use the recommended rules.

Chris: Yeah.

Dave: You want to start there and override. Boy, howdy, I just went through. I think I got it all working. It's like I want to save a Sass file that is chunked up, just bad.

Chris: Yeah.

Dave: Just poorly formatted and have it fixed, right? I think I'm finally at the place where it'll do it, but now it's like, okay, how do I roll this out to my team? How do I say, like, "Okay. Everybody, I think I got a situation"?

I don't like the linting errors on deploy. It is helpful when you commit, like a pre-commit or post-commit hook. That's awesome, but I really want it while I'm authoring, I just want it to fix, right? But I have three Visual Studio code plugins that are all kind of working together, but which ones do I actually need? I think I just need the Prettier going, you know? And so, what's the minimum viable clean up the code?

Chris: Really? Did you actually get it? I wouldn't--

Dave: I did.

Chris: I think stylelint can do format on save, but I would think that's in lieu of Prettier, then. You can't get both of them to do their job, can you? That would be impossible.

Dave: I think you can. Prettier is for, I'm going to indent things and put the brackets in the right place, or something.

Chris: Right.

Dave: Stylelint is like, okay, I want a space before every media query. I want a space after the colon in your property key value. I want a space or whatever after the media queries, every media query property or whatever. I think it's good and then you can do other things like no importance or whatever. You can enforce more stricter rules. I think that's what it allows, which is probably handy in more advanced situations. What would you say? It's probably handy in big teams where you need more strict code enforcement and stuff like that.

Chris: I use it, but I just have it do the squigglies for me, stylelint.

Dave: Okay.

Chris: Because I found it conflicted with Prettier in having two different things autoformatting.

Dave: But that's it. I think I had it going but now it's like, okay, let me turn off all my plugins and make sure. You know what I mean?

Chris: Yeah. Yeah.

Dave: Then I have a JSON, package.json, right? What's funny is I can run stylelint-fix in an NPM script, right?

Chris: Right. Right.

Dave: So, I go, like, fix CSS. NPM run fix CSS. That works fine. But if I run stylelint from the command line, it's like, "Stylelint is not installed," and I'm like, "What?!"

Chris: That's exactly what I was talking about with Gulp. These days, I don't even trust the CLIs anymore. I always do Yarn run thing.

Dave: Yeah.

Chris: So it's running in the scope of your project or whatever. Then it's like if you get these working anyway, it's like, hopefully, everybody on your team uses VS Code. On ours, I think we do, but I want to be a little bit more future-proof than that, so I'd prefer to keep all of these things as pre-commit hooks with Husky.

Dave: Mm-hmm.

Chris: Just because it works great in VS Code for you, you hit save and it formats stuff, it should also do that from the command line from your commit.

Dave: Somebody uses CODA or whatever.

Chris: Yeah, because I just don't want us to be like, "Oh, I opened up this file and I moved a couple of imports around and I indented a few things. I put a couple of spaces over here," and that's a commit. "Just cleaning up." You're like, "No, no, no. I don't want any white space or code formatting choices to be commits."

Dave: [Laughter] Yeah, that's fair.

Chris: I do that because I do that. I do that. My brain gets all distracted. I open up a file and I'm like, "Let me just clean up in here first and then I'll get to work." [Laughter]

Dave: Well, and it's like, "I don't know. I'm feeling four spaces today."

Chris: [Laughter]

Dave: I'm like, whatever, "This is what I feel like today, so I'm going to do that." For this project, in particular, I'm just like, "Okay. I just want it to all be the same. We can override rules, but that's intentional choices." But then I get mad.

Thankfully, my JSON is all formatting now, like automatically Prettier. It swipes out the blast trailing commas and stuff like that. But, man, you write a JSON wrong and the whole thing just breaks. You're just like, "Goodness!"

I think I'm realizing, and this will be in my little CSS-Tricks post if that's not already out, but it's just like this configuration stuff is not my favorite at all. It's like the opposite of favorite.

Chris: It turns out Rails was right.

Dave: Rails was right, man. Rails is just like, "Just type Rails server in your command line and everything will just pretty much work. We'll bundle some performance practices in there." Then, all of a sudden, for some reason we were like, "That's terrible. This isn't good. We need to rewrite everything in JavaScript - God's language."

Chris: [Laughter] What was that, if you had to guess? Let's say it's 2014, or whatever, rolling into 2015, '16. JavaScript is exploding at this time, but it's still early days. Nothing compared to how it is now with JavaScript totally taking over. What was it? I have some guesses, I think, but could you just be like, "I don't know. Some libraries existed and people really liked those libraries, so it was the explosion of the library"? Or was it the capability of browsers? Or is it the capability of networks? What is it?

Dave: I think there are going to be three things. Rails has a footprint. It had a lot of bad press, like scaling issues. Twitter couldn't scale with Rails. Therefore, it's bad. It was like, well, [laughter] Twitter is a little bit of an edge case. That's like millions of people hitting the same server at once, but then, also, real-time updates. A lot of stuff is going on with Twitter and it's micro. It got a bad rap for, like, can't scale. I think setting up Ruby on somebody else's computer was still very difficult.

Chris: Yeah.

Dave: Even now it's like Jekyll or 11ty. It's like I'm going to just say 11ty because you download the node binary and type NPM install 11ty and you're done, or whatever. You're up and running. You can even run it off of MPX, MPX 11ty, or whatever, and start compiling a blog without even installing 11ty. I think that's the difference.

I think stuff like Socket.IO was a really compelling technology, like threading or very concurrent connections and stuff like that. I think node had an advantage on that just because of its style. It was designed to be highly concurrent, I think. I think somebody pointed out Elixir is sort of a spinoff of Rails, like Phoenix Elixir sort of stuff. I think a lot of Rubyists then moved to other things as well because they sort of started hitting the limitations of Ruby as a language and started peeling off.

That's all to say, you can still build a very good site with Ruby and Rails. It's really great and really wonderful to work in. That's not most people's problem, right?

Chris: Mm-hmm.

Dave: But I think some people will feel like they hit a wall at some point or couldn't solve something or something, or the Gem doesn't exist or whatever.

Chris: What about this? What happened in JavaScript land that made us move away from server stuff to asking more of the client, just doing everything on the client-side?

Dave: Well, that's a good question.

Chris: Is there a particular feature you could point to?

Dave: Well, on the client-side you had, what? Everyone had a jQuery app. It's still like 86% of the Web is jQuery or something like that.

Chris: Yeah. Even back then, we were doing that, right? It wasn't like we were just using Rails for everything. We were already JavaScriptizing our apps. We were just having trouble with it.

Dave: Yeah, and was it jQuery barbeque or whatever, the history push state library? Do you remember?

Chris: Oh, yeah, sure. Sure.

Dave: dollar.barbeque or something?

Chris: Strongly desiring some routing capabilities or Ajax-y SPA capabilities.

Dave: Yeah, but then Backbone hit and Knockout were around. Somebody recently did a really cool visualization of all these logos showing up on a timeline. I know a lot of people went all-in on backbone. Then they kind of hit the limits of that and were like, "Uh, this is rough," and then React came out.

React or Angular, I guess, would have been first. Angular is like, "Enterprise, baby." Everyone was like -- all the enterprise people were like, "Yes, baby! I want to be that," because if you're like, "Oh, Google makes things with this? Oh, I could probably make a thing with this," like some sort of real-time, reactive to data.

The data updates. My thing updates…. This is amazing. React comes out.

Chris: Mm-hmm.

Dave: It has a really cool component model. I remember 2014 conversations where I'm in a client and we're just sitting around, "Did you see that React thing?" They're like, "Oh, yeah." "Is that something we should look at?"

I had my--whatever--apprehensions about all JavaScript. I think we should do progressive enhancement or whatever, but this is before render to string. But even then, it was a very compelling component model. You write the components and those components tie together, which was better than what we were doing--

Chris: So, it was real-time capabilities. It had URL handling capabilities and a component model.

Dave: I think so and that goes back to the Socket.IO and the concurrency stuff too on the server.

Chris: Mm-hmm.

Dave: I think you had that and then the real-time and the component model stuff that started coming out.

Chris: It didn't look good in jQuery. You can open a WebSocket in a jQuery app too, but then the data comes in. Then you, what, run a jQuery selector to find the thing in the DOM that you want to change and manually update it?

Dave: Yeah.

Chris: That's fine, but it's starting to get fricking sloppy.

Dave: Yeah, it'd be like dollar document on listen, or whatever, on whatever, Pub/Sub or whatever. I don't know, but yeah, so it just wasn't, I guess, expressive. Is that the right term for coding? The reactive model wasn't there in jQuery and I think we do need a reactive model.

I think our understanding of UI and state also improved. You need a little bit of state. Components do things.

Chris: I think people waited around for Rails to do this, and I think they have some kind of answers for it, but I think it's not too little too late in that Rails still does a bunch of useful stuff, but don't you see more and more people being like, "Well, I'm just going to use React anyway, but I can still use really nice stuff on the back-end"?

Dave: Mm-hmm. Yeah.

Chris: It doesn't mean I can't use Rails.

Dave: No. Yeah, I think your talk or whatever is, I guess, for all full-stack developers now. I think it really highlights, as these things move to the client, our relationship with the server has changed. Now, if you are like, "Oh, I'll do templating on the client, not on the server," it's like now you're demanding less of your server. You're like, "Well, I don't need to do that. Oh, GraphQL? Oh, I'll just write my database queries on the client. Whatever." Then your server is like, "Oh, okay. I guess I don't do that anymore."

Now you're like, "Oh, okay. All you do, server, is fetch data and munge data. I bet I could do that in a serverless function, a half dozen serverless functions that only run on demand."

As this whole thing snowballs forward, I think our relationship with the server is changing, so I'm even thinking about that with an app I'm building. It's just like, how much of this could be serverless? I want a form on this page that saves some data somewhere, but I don't want to run a Rails app or anything. I'll probably just try some serverless functions and see if it works. [Laughter] See if it saves things.

Chris: Hmm.

Dave: Then I just need to get the data.

[Banjo music]

Chris: Hey, this episode of ShopTalk Show was brought to you in part by WooCommerce. WooCommerce is e-commerce for your WordPress site and so it's a plugin. If you have a self-hosted WordPress site like ShopTalk Show is, CSS-Tricks is, the blog at CodePen is, or whatever, you can install WooCommerce there. Then you have a full-featured store ready to go.

It's kind of built for people who build websites, I think, is a way to think of it. It's pretty easy to get started with. I find it tremendously easy, but it's not meant to be, like, the absolute easiest hand-holdiest way ever to do e-commerce. It's meant to be flexible, designable, extendable, and stuff. I found that to be highly true. You can take really strong design control over this site or be pretty hands-off if you want.

But it integrates with lots of stuff and that's helped me over the years tremendously, like, oh, okay, I've got to get these orders, but they've got to go into ShipStation because X, Y, and Z company needs to deal with ShipStation on their end. Fine. It's a plugin. It works great. Or we need to take money through Stripe or some other thing, there's a plugin for that. Everything is a plugin. There are a zillion plugins for it and it's great in that way.

Now, that's for your self-hosted WordPress sites, but WooCommerce is an Automattic company and Automattic is WordPress.com, right? WordPress.com is like the hosted version of WordPress. You don't have to deal with hosting, security, or any of that stuff. It's great. I have a site on it as well.

You can start a store on WordPress.com and it's really woven in there. If you start a store, you don't even really see the WooCommerce bits, but it is WooCommerce under the hood. That's cool. You can do all your e-commerce on WordPress.com and kind of know that it's WooCommerce powered, if you care, so that's cool, and extended still through WooCommerce add-ons.

This is interesting too, and you might not have known this, but on WordPress.com, if you have a business plan, you can just install third-party plugins too on your WordPress.com site. It feels weird almost to some people, but you can totally do that, including WooCommerce. If you just want to use WooCommerce that you already know from some other experience, you can totally just do that as well right on WordPress.com. That's cool.

WooCommerce, a totally good e-commerce software for WordPress. Check it out. Bye-bye.

[Banjo music]

Chris: Oh, God. I think this is fascinating. Obviously, I've been thinking about this stuff a lot. What happened to this client-side and why the pushback recently? Is there really any pushback? There are a million things to think about.

Hey, I got an email in my inbox here that's pretty interesting.

Dave: Oh, do we got money? Did we get the Coil money?

[Laughter]

Dave: Did we get it?

Chris: No, I haven't heard from them. They're still -- I don't know -- dotting t's and crossing I's, or whatever they say.

Dave: Okay. Okay.

Chris: [Laughter] We'll see. It doesn't feel -- to be perfectly honest, it feels like, "Are you really doing this anymore?" This long of radio silence always feels weird for me. Who knows? Maybe we'll just get an email that does something. I'm specifically talking about the grant that was a part of all this.

Dave: Yeah.

Chris: No, Gatsby must have hired a PR firm or whatever. In fact, I know they did because I got an email and they're like, "Do you want to hear about our secret stuff?" I don't sign NDAs. I just don't care that much. I'm not like a real journalist or whatever.

Dave: [Laughter]

Chris: But then they were like, "Well, we'll tell you when the embargo gets lifted anyway." Okay, cool, but apparently it was just lifted.

"Gatsby, the fastest growing website development platform beloved by developers used by thousands of companies around the world like IBM, Nike, PayPal, and Harry's."

Harry's? Is that the shaving thing?

Dave: The razor?

Chris: Yeah.

Dave: Yeah, the razer.

Chris: Right up there with IBM, Nike, and PayPal. "Has launched its first commercial platform, Gatsby Cloud, with an expanding--"

Dave: Oh, there it is.

Dave: "--expanding suite of new tools that dramatically improve workflows, developers, and content creators." It includes Gatsby Preview, which they already sell. That was a pro feature from not long ago.

Dave: Mm-hmm.

Chris: Then the other thing that's comboed with it is called "Gatsby Builds, the fastest way to build a Gatsby site. Tailored to Gatsby applications, Builds provides all the automation and infrastructure you need for instant continuous deployment." Then it does Lighthouse checks and stuff too.

It doesn't say it's hosting, though. When we had Jason on, I was trying to -- he has since left Gatsby, I think. He's at Netlify, too, now, right?

Dave: Yep, I think so.

Chris: That's a weird transition. I was trying to drill him. I'm like, "Dude, come on. When are you going to -- are you guys going to go to war with Netlify here or what?" You know?

Dave: Mm-hmm.

Chris: It sounds like this is maybe step one for that. It doesn't say the word "Netlify" anything on here, but it does say, "Push to deploy with GitHub."

Dave: Yep. Yep, it looks like a sort of Netlify competitor for Gatsby only.

Chris: But you can't host. It's still pushing the hosting part to somebody else, so I assume you can use this with Netlify, too, but I assume it's no mistake that Netlify is not mentioned here.

Dave: It's kind of like one click, set up your website. It gets you a GitHub and it--

Chris: I guess.

Dave: --I don't know--would say where do you want….

Chris: It's totally unclear. "Fast build times. Builds every brand automatically." That's Netlify-esque. "Show and share previews of deploys." That's very Netlify-esque. But where? Are they just temporary? Are they immutable?

Dave: Gatsby Cloud, man. Gatsby Cloud. I wonder--?

Chris: Yeah, but then you can't use it for production? What's the deal?

Dave: I wonder if it's a white label Netlify. That would be cool, but-- [Laughter]

Chris: I'm sure these answers will become clear in days to come and so we'll sound like dummies by the time you're listening to this, but whatever.

Dave: Sure.

Chris: That was two seconds after reading the email.

Dave: Well, it's interesting. I think we talked about it a long time ago, this $15 million investment into Gatsby, which, for better or for worse, it has chosen Gatsby plus GraphQL plus Webpack, basically, as its product, right? That's its product. Sorry, I guess React plus GraphQL plus Webpack. It's sort of, at its core, it's just those three things. Now they're building hosting on top of that.

It's interesting to see investment come into this static site market, this JAMstack market, like a big investment. That's a lot of investment to build these tiny clouds.

Chris: Oh, yeah. There's coin thrown around. That's for sure.

Dave: Then why does--? I mean maybe it's like organization or whatever, but why does 11ty not have the investment? I know we joked around that I invested $16 million. [Laughter] Just one more than Gatsby. But what is the difference between Gatsby and 11ty that 11ty would not have somebody knocking on the door to give them…?

Chris: Oh, I think it's somewhat clear. Zach wears everything he does. Zach's got his heart on his sleeve, as they say. Zach is not cooking up any secret crap behind the scenes that is some big powerplay in the world of websites. Zach is just like, "I'm going to make a really cool SSG. Here you go, world. I'm going to open source the crap out of it and tell you every single thought on my mind," kind of thing.

Dave: Yeah.

Chris: If Zach wanted $15 million, he'd have to have some secret crap he was working on that was going to be like 11ty cloud that's an online editor for SSGs. It's faster than anyone out there. He'd have to start speaking the speak of VC fanciness and have secret stuff up his sleeve that he's out there pitching and stuff. I just don't think he lives that life right now. That's just a guess.

Dave: Yeah. Yeah. No, I mean, like -- yeah, I guess probably location factors into it some, too, right? Even probably your client list or something like that, you just have enough demand from Airbnb like, "Hey, can you help us do this?" I don't know. It's just interesting how the world works.

Chris: Sure is.

Dave: Dev 2 got a bunch of investment, right, the Developer Blog Forms? It's like, how come that happens? I don't know. I don't understand it.

Chris: Yeah.

Dave: I will gladly take anyone's money.

[Laughter]

Dave: All right. What else do we got?

Chris: How far did we get here? We're getting there. We started speaking a little bit about, like there are these moments in tech where, no matter who you are, you can feel totally helpless with the things that go wrong.

Dave: Mm-hmm.

Chris: Then, on the flip side, it's kind of fun to think about things in tech that just work that are kind of astounding in their effectiveness. Even on the show, I had opened up our little Trello board because we get some questions in. Maybe we'll do a question here. The next time, I promise, we'll do tons of questions.

Dave: One question--

[Laughter]

Chris: Is that I hooked up Zapier and Trello a hundred years ago. We have a Wufoo form. The Wufoo form submits and it emails us for the questions. We should probably change this at some point to be like, "Contact Chris and Dave or submit a question," but we only have one form on the website. We really are going to do redo the website, by the way. Stay tuned.

Anyway, sometimes the "ask a question" ends up being like, "Hey, dummies. You have a typo on this thing or whatever."

Dave: Yeah.

Chris: We want to get that over email so we can fix it, right? Mostly, they're questions for the show itself that come in, and so the Wufoo form then goes to Zapier, which makes a Trello card of it and puts it in Trello. I set that up five years ago.

Dave: Mm-hmm.

Chris: It has never broken, ever. There's never been a -- I've never touched it ever since then. That's awesome! That's how tech should work!

Dave: Yeah. No, I mean, if anything, it's gotten better, right? I remember this one time we were getting a bunch of spam through our contact form there, like FIFA. Buy FIFA coins or whatever.

[Laughter]

Dave: But I think that's all done, right?

Chris: I tend to not get that much spam through Wufoo, so I don't know what that was about. I don't even remember that specifically.

Dave: You know what's not on this tech amazingness? You all know I switched to Windows like four or five years ago. There are still things with Windows that probably people are like, "Oh, I don't want to do this." I know DHH recently switched to Windows and he's like, "The type is terrible. I can't do this," or whatever.

I don't have that problem, but one thing about Windows, I feel like Windows keeps getting better. I feel like that's kind of cool and that's hard for a big company like Microsoft or whatever. My experience on Windows has been like, oh, this is just great. I get new things and everything is getting better. There are some hiccups here and there, but I'm on the cusp of getting WSL2 on my big machine here and that's going to be a big improvement. In some ways, that's cool. I'm glad that's happening. Yeah, I'm thankful.

Chris: I tweeted about my forum problem. I literally cannot say the word "WordPress" without somebody being like, "You should switch your entire CMS." It's almost a joke at some point that I always get them. They don't tweet me back as a joke because I don't talk about it that way.

Dave: Have you tried Hugo? Have you tried Hugo?

Chris: Yeah.

[Laughter]

Chris: Hugo sounds great. Love it. Let me just switch it over. I've written about why I don't intend to switch. That's not forever. I'm just saying, if we think of tech that works pretty well, I'm going on 15 years here of having a WordPress site with that long of powering everything I do, it's pretty low in its technical debt problems for me. Just saying, high five to things that just work really well for a long time.

It seems to me, these pretty hard, like, "We're not going to deprecate old functions and stuff," I think there's some crazy folklore where they never have. They might give you warnings and stuff, but they just don't break old stuff, even if that means that the code base evolves more slowly or it's frustrating to some people or something like that.

It's a little bit how the Web itself works. The Web itself takes that stuff even more seriously than this open-source project does, you know, projects all the time. Who was writing about this recently that was great on how frameworks, it doesn't matter. They can have hard upgrade requirements. There's versioning. You don't have to use the new version if you don't want to, but you have to use--

Dave: Jen Simmons was saying that about the Web.

Chris: Yeah.

Dave: She was saying the Web doesn't get a V2.

Chris: Right. You can't just opt into an old version of the Web, so they have to take the super, super seriously and they do and they tend to do a great job at it because any time where they slip up just the tiniest little bit, it's kind of a disaster. Chances are they have to roll forward and fix it for more backward compatibility.

Dave: Yeah. No, I mean, you know, speaking of Web, it keeps getting better. I don't know if you follow the blogs, the Chrome Dev Summit just happened.

Chris: Yeah, what was new? I haven't even read a roundup post yet.

Dave: You know, I'm slowing getting my information here as I go, but there's a good talk from Una Kravets--I feel like that's her last name, but now I'm second-guessing myself--and @argyleink. They were on there talking. They did a speed round of like 20 CSS features.

Chris: Yeah, that's great.

Dave: In like 30 minutes. If I were to recommend one thing to ShopTalk listeners, it would probably be that.

Chris: Was it surprising or would we know them already?

Dave: I think you'd know them already.

Chris: It's still a cool presentation. I just want to know if there's something I haven't seen yet.

Dave: Yeah.

Chris: Are there any surprises?

Dave: Well, no. Yes and no. I think we've been -- it's hard to describe, but the block and the inline sizing, have you kind of caught up on that story?

Chris: The two-value syntax?

Dave: Yeah.

Chris: Yeah.

Dave: The two-value syntax. Even your margin, whatever, block inside or whatever, like block start or whatever. That would be margin-left in RTL and block whatever end would be LTR. I said that backward, but anyway, it's confusing because it's hard to explain with mouth coding, but it is kind of like a next iteration of how we program the box model and deal with boxes and internationalization. It's like a huge leap forward.

I don't know how it's going to work, like, CSS-wise or pre-processor-wise. We'll probably need a whole new set of tools to do all that for browsers that can't do it. But all that stuff is going to be really cool.

Chris: I'm a big fan. It's like when CSS evolves to just be better later. We can't use it right now. There might not even be extremely distinct advantages to using it now. But as we go on, we just change how we teach CSS so it's just better. There'll be a day, let's say, five years from now where even boot camp kids, or whoever--they don't have to be kids--are not learning margin-left. They're learning margin block start.

Dave: Yeah.

Chris: Because that's just the right thing to do to learn because it just works better when you change stuff around on the page. Five years from now, we won't have to worry about the browser support of it. It'll just work.

Dave: Yeah.

Chris: The same thing with the two-value display syntax. It's just a better mental model. It doesn't actually unlock any special new abilities. In fact, I tried to dig through there to see if there's anything that it did that we can't do now. It's like, not really. No.

Dave: Well, and I was trying to figure out, what could I do with it? I really don't even know yet. If it could eliminate a div, like when you do flex and then you say the child is also a flex so that it can grow or whatever, does it fix that? I don't really know. I'd be curious how this all works, but maybe it's to support -- have a flex item inside of a grid item. It can be both of those things. You know?

Chris: Mm-hmm.

Dave: Different directions, I guess, so I don't know. There was a talk from Sungug, Sam Richard.

Chris: Houdini?

Dave: [Laughter] You know he's talked a lot about Houdini. There's Houdini stuff in the Una talk, but he talks about Fugu stuff, which is Google's kind of big effort to bridge the gap between native and Web. He built a Markdown editor that saves to your file system locally. It's not out. You can't really do it. It's origin trials or whatever, but it's this idea of, like, oh, you want to write to the operating system? We're going to give you an API to do that.

If you do Visual Studio code, it kind of does that. I'm sure there's some sort of intense operation that happens. This would be direct rights to the file system sort of thing. Yeah, it'll be interesting to see where that goes. Then things like portals is all kind of being talked about.

Chris: Didn't we get that last year? That was confusing to me. I'm like, why are we talking about portals again?

Dave: I think we got it this summer, but I think it's kind of coming along. I think it was….

Chris: Messaging, I saw a big slide that was like, portals don't animate but you can animate them if you want to. It's just an iFrame that you promote, right? By promote, I mean let's say you have a big page that's a thousand pixels wide and you have an iFrame in it that's 300 pixels wide. Imagine that iFrame animating up to take over the whole page and then it's not an iFrame anymore. It gets promoted to be the active URL of the page. It's super cool because it means SPA -- there's only one reason it exists at all.

Dave: Yeah.

Chris: You don't really need it for performance reasons because you can always do prefetching and stuff like that if that's what you're trying to do, so there's only one reason it exists and it's because now we can do SPA-like work without jQuery barbeque.

[Laughter]

Dave: Yeah. No. Yeah. No, because you just think of an iOS animation where you slide a pane over from the right as you drill down. That has great UX and great mental models, so I think that's happening.

Chris: The big use case is the shopping cart for your e-commerce site. As soon as you scroll your mouse up there towards the shopping cart, at that point, you should be like, "Ooh, let me preload that portal quick. Now I have it. Now if they actually click there, I can promote the shopping cart to the new page without refreshing the page and it'll look super-fast because it's been loading while that's been happening."

It's a great idea, but I wonder what the pushback has been or what the adoption is going to be like or what. Is it a really progressive enhancement friendly thing? I would hope so, but maybe not. I don't know. It doesn't seem like the kind of thing Firefox is going to jump on, but I could be wrong.

Dave: Well, and what's it do for the page? We're already, with single-page apps, just murdering the main thread, but now it's like, "Oh, we're going to keep two pages of memory on the same page." Does that just destroy apps? I don't know.

There were a lot of talks, too, about getting things off the main thread and performance, like Adi and Surma were talking about that stuff, kind of classic Chrome developer talks. Anyway, it's good. It was good. I really like the Chrome dev rel team. I know that's a contentious opinion, unpopular opinion, but I think they're great and they worked hard at the Web.

Chris: They've got a lot of big names, smart people. Is this Edge collaboration stuff for real? They didn't fire anybody when they gave up on their own browser? [Laughter] Did everybody get a new job there and it's collaborating with Chromium?

Dave: You want the tea? You want the tea here?

Chris: Yeah, what's the deal?

Dave: Pre-Edge, like a couple summers ago, a lot of people on the Edge team, at least I know two or three or whatever, moved over to the sales, went over to Salesforce. There was a little bit of attrition happening. I think it was all kind of around this move, like a restructuring, like, "Oh, we're not going to make the browser anymore. Then what am I doing?"

I think Greg Whitworth and @stubbornella do a talk at the Chrome Dev Summit and it's all about the collaboration state. Edge has landed like 1,600 commits in Chrome, and those are around security, accessibility, and things like that. It is making Chrome a better browser and hopefully more performance stuff and stuff like that.

But I also think one thing that Greg Whitworth has been working on is fixing inputs and they updated all the styling of inputs. That's going to be a key factor for the next iteration, which his now giving developers the ability to style your inputs however you want in dropdowns and the select dropdown. You can program that with CSS. I think they're coming up with ways to do that.

Chris: That's nice.

Dave: Yeah. No, I think it would be really cool.

Chris: Like anything with Greg and Nicole is, like, oh, that's so great but that's two people. What are all the rest of you doing?

Dave: [Laughter] Yeah, what is everyone else--? Well, I'm sure there are people behind them helping.

Chris: Yeah.

Dave: And things like that but, you know, on the flip side, when I hear things like, "Oh, we had to call in Bloomberg to write Grid," then I'm like, "Wait a minute. What's everyone doing?" [Laughter] Grid was an outside thing? What's going on? Anyway, I guess we'll see how this all shakes down. It is an interesting time in browser land.

Chris: Okay, Dave. Fun times.

Dave: Let's wrap it up. Thank you, dear listener, for downloading this in your podcatcher of choice. Be sure to star, heart, favorite it up. Find out about jobs. You like jobs? Get a job. [Laughter] Twitter @ShopTalkShow. Chris, you got anything else you'd like to say?

Chris: [Loud exhale] ShopTalkShow.com.

Comments

Job Mentions

Check out all jobs over on the Job Board. If you'd like to post a job, you can do that here, and have it mentioned on ShopTalk for a small additional charge.