The Piano Man of State Machines

Welcome to syntax. Welcome to a brand new episode of the frontend happy hour podcast. Welcome to this week's JS Party. Live from ship shape Studios. This is Whiskey web and Whatnot with your hosts Robbie the Wagner and me, Charles William Carpenter III. That's right, Charles. We drink whiskey and talk about web development. I mean, it's all in the name. It's not that deep. This is Whiskey web and Whatnot. Do not adjust your set. What's up everybody? Welcome to Whiskey web and Whatnot with your hosts Robbie the Wagner and Adam Thomas Argyle the nerd. Yeah, we have a special guest with us today. Adam, would you like to tell the folks who's here? Oh, you know I would. We have David K. Piano aka David Corors sheet hailing from Florida where bath salts make people ravenous. We have David who is a key framer, tweet banger, enemy of the XState advocator, speaker, hacker, flipping animator, Alex the CSS husky creator, React heckler, if statement hater, and most lately an LLM powered finite state machine agent slinger.

Welcome to the show, David. Haven't seen you since you were in Seattle a few years ago. What's up? That's true. That's true. Good times. And also, that was the best intro I could have asked for. That was amazing. Well, quit having such a cool history. And then, you know, I'll I'll ruin it next time. Yeah. Announcing our new product, intros as a service. Adam will be doing these for anyone that would like one for anything. Hype, I gotcha. Yeah. All right. So, a much less interesting thing to mention, the whiskey. I don't have as many fun facts for you about this, but it is a fun one. You can't see you guys. You can see someone ones. A single malt. Let's see. Miyagio. That was pretty good. Yeah. Nika Miyako.

Play from 0:00

Miyak. Well, I think I screwed it up a little bit, too. But yeah, you're close. Yeah. Yeah. So, it's single malt. That means it is 100% malted barley. And it is, I believe, 90 proof and from the mountains of Sai. I don't know anything about if those are real mountains. Cool. But yeah, and it's lightly peed and aged in cherry casks. So, let's give it a whirl. Let's give it a shot. I was surprised that it's twist off. Maybe that's a Japanese thing cuz they like the efficiency because it's not a cheap whiskey. It was not. I'm looking forward to it. Me, too. Never tried this one before. Ooh, the color is nice. I just always think of like Jurassic Park looking at this like one day there's going to be a mosquito in there, you know? I'm going to be like, "Oh, that's cool.

Maybe it'll turn me into a dinosaur when I drink it." Well, I have a toast before we have our first tip. I mean, you're welcome to sniff it and all that good stuff. But here we go. To 10 great years of state machines. May they one day reign supreme over if statements and save us from the hell that is if spaghetti to David K. Piano. You're here. Thank you. So, I'm smelling have you guys had Hi-Chew? Yeah. Bless you. Totally. I have an apple one and it smells a lot like this. Whoa. So much apple flavor. Mhm. I don't know if it'll taste like that, but it smells very bright like that. Oh, no. You stole it right off my tongue. It was sitting there and you said apple and I was like, "dang." I really like this one. Okay. That is not how I thought it would taste after that smell.

A little smokier maybe. You know that's slight pete. Is it? It did say lightly peed in cherry casks. Double distilled. Ooh, I should triple distill and then charge more. I was going to say that's the thing with the Japanese whisies is like it's like sort of not the opposite but just contrast to the super peted, you know, whisies like Irish whisies, things like that. I was going to say this is one of the most flavorful Japanese whisies I've had. I feel like cuz usually they kind of I don't know if it's on purpose. I feel like it is cuz they're trying to be so efficient like they do a lot of like stuff with concrete and like trying to have like no flavor almost. It just is like drinking water. That's not bad. It's just also not super flavorful. So like this one much different. Lot lot of flavor. Mhm. So smooth too.

It's got a good burn, but man, it's smooth. And the way that it hit my tongue just spread across it. Maybe it's the cherry, too. So, it's got that really good kind of sweetness to it. Yum. All right. We have a very complex rating system on this show. It is zero to eight tentacles. Zero being the worst, eight being the best, four and a halfish somewhere middle of the road. Like, ah, it's fine. I'd drink it again, but wouldn't seek it out. Adam, what do you think? I'm a big fan. I've been having that Glenn footage since we had our last guest. Well, it's last guest to me, but you had lots of but Nean was on and I've been really enjoying that. But this is going to overtake it for me. What a good sipper. I don't need any water. I don't want any chasers. I would like to enjoy this to its fullest.

I'm going to have friends over and share this. This is super good. Somewhere in the sevens. I'm going to give it a 7.125. 7 and 1/8 just to be weird. Nice. David, what do you think? So, I actually don't drink whiskey too much anymore, but my wife introduced me to Japanese whisies, and it's just such a different flavor profile from American whisies. And honestly, Japanese whisies are really underrated. But yeah, floral, citrusy, fruity, those are the defining characteristics. And I really like this one actually. The flavor sticks. I would go solid seven. I know that's an amateur score, so maybe 7.1 just like Adam, but yeah. All right. All right. Yeah, I don't really have anything bad to say about it. I feel like a lot of times when there is a flavor to a Japanese whiskey, it's what I wish a scotch would actually taste like. So, I feel like they've like gotten the scotch flavors that I like and not the ones that I don't.

With that in mind, I'm going to be kind of the same as you guys. I'm going to go flat seven. I'm not going to do point anything, but we'll say seven. I like that comparison. Yeah, the light peed is nice cuz you're not giving a heavy a heavy peed, but it's there as a good influence shared with the floral and the sweetness. Man, I'm I'm a big fan right now. Well, should we dive into a hot take or should I ask you a provocative question? What would you rather what would you rather do? Start with the hot take then we'll go into the questions. Hot take. Hot take. Okay. Is Ustate still dead to you or has it zombied and kind of you know somehow found life in your workflow?

Play from 2:00

So here's the thing with my conference talk titles. I a few years ago I had goodbye useEffect and then more recently I had a talk called goodbye you state and I'm actually talking about that in November at React Summit. And so the point of these talk titles is basically to bring attention that these hooks might not be needed as frequently as you might think. Like people tend to overuse useEffect. And the same thing goes for useState. So with useEffect it was more understandable. It's like okay why are we using this to fetch data or to update drive state or anything like that. But with useState people are like wait a minute this is a really fundamental hook. Why are you saying like let's get rid of it. And there's actually a lot of good reasons for it. And I could talk the entire time about it, but I won't. But the point is that you should know when and where you should use these kinds of hooks because overusing even these basic primitive hooks can really just mess up your application where it makes it very hard to maintain.

Like you've seen apps that have like 10, 20 use dates in a row. You don't know which ones relate to which. And same thing with chain useEffects. It causes a huge mess. You have an infinite loop. Cloud flare is shut down and you have no idea why. It becomes really hard to debug. And so basically I'm just bringing awareness for when the appropriate time to use these hoaxes. Would you say that class-based React was better? Oh man, not really. Class-based React was a little bit awkward. Honestly, it was it was a huge step up from like the days of Angular and Backbone, but it still had a lot of awkwardness. I personally think the life cycle hooks were a little bit awkward and people tried to shove logic into there where it didn't really make sense where it's like you're doing critical business logic in components did mount and it's like what does the component mounting have to do with this?

But it's just like oh well this is just an opportune time for this logic to run. So yeah, classes are awkward in general. I wouldn't say they're bad. They're just awkward when overapplied. And so React's class-based components were I don't know. I it's a net positive that we have hooks now. Hooks are weird in its own right, but I understand the trade-offs made to have hooks instead of classes. That's fair. I just wish the naming like I actually did like component dimmount tells you exactly like when that's going to run. Yeah. Like use whatever. I don't know. It's going to happen sometime. That's true. and people try to like just shove that logic into the callback of a useEffect and that's wrong for many reasons too because that's not exactly the same thing as components will unmount or whatever it was. Yeah, it's just awkwardness all the way around. I keep thinking about stupid jokes while you're talking. I'm so sorry. But like the first one was I was like all the hooks I was like someone for Halloween should be Captain hooks.

You know, you got a React shirt on. You gota and then but you have to have too many hooks. So it's almost like the video like too many cooks too many hooks but you got like too many hooks and you're just like how many hooks does that captain hooks have? Like does he need more? I think he's misusing that one called state and then basket that you like can't hold. It's so heavy. You're like dropping hooks out of the I should go hook. Oo, they well, there's how you could have a special little follower or something. That's like the hook fairy. If we could have one hook, it would be that hook. I don't know. And then you said component did mount. And I was like, components ride horses, you know, like when did that happen? Like is that funny? Thank you. I thought they were stupid.

I'm going to just I never thought about the terminology of it mounting.

Play from 7:00

That is kind of weird, but yeah. And yeah, what did it mount? I said horse, but that's just a guess, you know. Yeah. Okay. Yeah. I don't know what this next question is about, so I'm going to let you. Oh, yeah. This is my provocative one. David, you wrote a tweet and it says, "don't sleep on child." And I was like, "you sleep on children?" But really, it's cuz I'm doing the stupid thing, you know, where like the newspaper takes a segment of what you said. And so David says, "don't sleep on children." It's like, "Hey, hey, hey, that's not the whole thing I said. You said if you're using Tailwind, don't sleep on child selectors. They clean up your styles, eliminate repetition." Where did you see that? And like when did you use it? And you were like, I'm going to go tweet about this Tailwind thing cuz it's been good. All right. So going to take you behind the scenes of like why I come up with some of the random like post tweets that I do.

It's because I'm working on like three or four side projects at a time and I'm working with all sorts of you know technologies right now. Lots of reacts, lots of AI. Yeah. So, so I just run into weird things. And so there was one instance where I'm like, hey, my, you know, Claude LLM, whatever, it's doing this stupid thing where it's like, you know, just adding the same padding to all the children, which is correct. It's visually correct, but I'm like, you know what, I want the padding to be a little bit bigger. And then I'm like, oh man, now I have to go through and, you know, do it for each of those things. This is really annoying. Oh, and also because Claude code and all of these, you know, LLM things, they love Tailwind. They don't really like writing CSS, but that's probably because of the system prompt of whoever created these things.

They're just all in on Tailwind. I used to be anti- Tailwind for a while, but and you know, I was big on CSS, still am. Love CSS, love SAS, love doing as many things as possible that I could do in it. But with the age of LLMs, you sort of have to embrace Tailwind just because it's just the way things are. I was like, it only has one color. It's purple or indigo. I don't know. Depends if you're color blind or not. I don't know. Some sort of gradient cuz if this were CSS, I would just, you know, write a descendant selector and then just apply the same style to all the children. There has to be something like that in Tailwind. So, I dived into the docs of whatever the verb is and I saw that and I'm like, "this is obscure, but I'm really glad that it exists.

I'm gonna tweet about it because whenever I find something that's unique, but potentially helpful to at least one other person, I'm like, I'm just going to tweet it out to the world. If someone finds it helpful, I've done my job. I don't care if people attack me or whatever." And trust me, I did get attacked for that tweet because they're like, "Oh, you're bringing back CSS. this is anti-tailwind. I'm like, no, it's not. I'm literally sharing a Tailwind tip and you're saying it's anti-tailwind. Like, it's something that exists in the Tailwind API for a reason. And yeah, got a lot of hate for that. But so, basically, all my all my tips come from me just coding and being like, that's interesting. Let me post about it. That's the way that is how viral tweets generally happen. I think if you sit down and try to write a pop song, you write a garbage song.

But if you sit down and you're like, I'm gonna explore this weird little thingy and hey, that brought me joy. And then you post it out. Those can be some of your best ones. And plus, you never complain it. You know, you never know. Some hit, some don't. So cool. So you're slinging from the heart is what you're saying. Exactly. You're in the trenches. You know, you're covered in mud and you're like, I'm going to use my muddy fingers to make a tweet and maybe someone will, you know, hear this. Yeah. Trust me, if I were garbage posting, I'd post like, what is your favorite JavaScript framework or something? And yeah, just vapid tweets. Yeah, I don't think I don't think those work anymore. Yep. Yeah. So, something that is for sure not controversial and has a 100% correct answer. Is HTML a programming language? It's a good question. It's really good question. Deflection. I love that question. Yeah. Yeah. Well, hey, guess what? I have you on record here and I have a tweet.

It says CSS is not a programming language that should be underestimated, which to me says CSS is a programming language in between the lines. You know, depends if you do the CSS CNN thing, you could say, "Oh, wait, no, he said it's not a programming language." So, yeah, to be fair, CSS is becoming more and more of a programming language. And depending on how you define it, I define it as a spectrum. programming language is you're instructing the computer to do things. Whether that's fully declarative, fully imperative, somewhere in between, you're programming it to do something, to do some behavior. And CSS with HTML sort of works like that. Now, people can argue like, oh, CSS is not a programming language because it needs HTML alongside it. But you know what also mostly needs HTML? JavaScript. Now, people could say, "wait, I can make a node app with just JavaScript." Technically, no. You need C++ behind the scenes in order for it to work.

But still, you know, they're like, that's why JavaScript's a real language and CSS is not. But I think that CSS and HTML are languages for programming some sort of behavior and desired functionality in the web. So, it fits within the spectrum of programming languages. I also think that the question is dumb. It's like yeah, it doesn't really matter. Yeah. Yeah. I mean, I think everybody like, you know, has always tried to make websites with no JavaScript, but yeah, try to make one with no HTML or CSS, like good luck. So, you know, if you're trying to say bad things about either of them, like you need them. Like, sorry. Yeah. trying to think of a comparison where like could you build a house and say like the instructions are real programming and just the wood and the planks and the paint like you know, that's just that's that's just a means to an end of my execution of awesome instructions, you know?

Play from 11:00

Is that like what's a good comparison that would just make it sound so silly like you think one piece of plans are the real construction. I mean, e even with whiskey, like some people might argue, oh, Japanese whiskey is not real whiskey. It's not like our Kentucky bourbon or like Irish, Scottish whisies. But yeah, they could try to say that, couldn't they? Yeah, they'd be wrong. Yeah, I referenced you in a in a previous episode because you tweeted, "I'll give my honest opinion about Tailwind Colon. It's by far the worst state management library I've ever used." Now, this caused a lot of contention and I'm still torn whether or not you were just saying XState is great and Tailwind sucks or if you actually are making a comment about Tailwind being a bad state management library. Which is it? answer it for us all. I was honestly just posting at that point just because I didn't realize how much attention my post on child selectors in Tailwind would get and how offended people would, you know, get at it.

Quote tweeting me being like, "this is the dumbest thing I've ever seen, saying I have skill issues, etc." And wow, I had no idea. So, it was funny like when I posted that, what I predicted would happen would be that the CSS people will get angry at me for posting about Tailwind and saying, "Hey, you could use this Tailwind stuff instead of CSS." But they were actually by and large very civil. It was the Tailwind people who came after me. Not the Tailwind team. Tailwind core team is awesome. I'm talking about people who live, eat, and breathe Tailwind every day. They're diehard Tailwind fans. Yeah. So, I'm like, "Wow, I didn't realize that posting about Tailwind would just be so controversial." So, I'm like, "what is the stupidest thing I could say about Tailwind?" And so, it was that. Nice. I did. I extrapolated. I'm such a dork.

I was like, "you're saying something super intelligent." And you had good reason. Yeah. Do you want to hear my madeup I made about like what you said? Go for it. I mean, I'll try to remember. It was basically like, okay, so if you've got you've got a logged in state or a not logged in, you have basically you have states of an element and when they have to change more than one class, it becomes a pain in your ass. Hey, that rhymes. But that was kind of the deal. It's like, hey, you know, like it's not a very good state management library because if you have to do five states, you have to manage five groups of classes. And it was already kind of hard to read. And now you're in nested class swapping scenarios where you have to swap many classes that change all these different properties. And that's just a terrible state machine.

And that was just not what you said at all. No, but I do get what you're saying. And honestly, with the kind of stuff that I'm working on, like with my side projects, the class names get really hairy because you have classes, then you have classes for dark mode, then you have classes for if it's mobile or not. And granted, you have to do all these things in CSS anyway. And then you have state-based classes. So, for example, I'm making a standalone Stately editor, basically just redesigning the current Stately one. And so there's different yeah there's different states like a node can be selected or it could be highlighted or it could be dragging etc. And obviously there's no built-in CSS properties for that. So you could either go the React way and use variables or whatever or you could use data attributes which is really nice because you could visually test those in the browser.

So I use data attributes. Tailwind does work with that but if I post that it would be controversial like we're using data attributes blah blah doesn't matter obviously Tailwind's not meant as a state management library but I feel like more developers should know about how states affect styles and to just stop polluting it with booleans and you know finite states really help CSS styling too but then how can I have a super nested turnary that's what everyone wants no I'll just leave it at that. That was the hell I was talking about earlier in the toast where I was like the hell that is if spaghetti and it could be worse. You could be in turnary hell which actually sounds like a place that evil developers we should we should send them there. we should make this place, let's have a religion that if you're a bad developer, you go to turnary hell where you can't even, you know, decipher whether or not it's a question mark or semicolon.

Like, where am I in this hell? Like, we don't know, but you're deep. Where do good developers go? You have to finish that turnary. Oh where does a good developer go? Somewhere where there's not very much indentation. Everybody uses tabs and you can only rebase.

Play from 17:00

Oh, I have no idea. Okay. It's a very I was gonna say any Astro website is where they go to. Hey, Astro's great. Yeah, it's just Astro Heaven, you know. Hey, whatever floats your boat, bro. You can just have an island over here and Hey, you get islands. Yeah. So, I want to go to the place where I get islands. Sounds like Astro is it. Mhm. That's funny. I was thinking about you the other day because we had a component in Shopify and it was supposed to be simple and it's just like the image is loading in an avatar. So you have an avatar and maybe it needs to load an image if there's an image provided. So first off you've got like is there an image or not? Then you have to wait for it to load and so at first it was just a boolean like you're saying huh is it loaded or not? And then the amount of like nested states that showed up I was just chuckling to myself. So like we had like has it loaded yet which was an amount of time you need to wait because if it hasn't loaded yet and it's exceeded a certain amount of time we want to fall back to something cuz clearly it's taking a long time and you need to see something.

So then okay so now we have like has it has it been 200 milliseconds? Then you should show the initials of their name over the circle. That way there's like something okay cool. Oh, but crap. It just loaded the image like 50 milliseconds after we put the initials there and that looks like so now we need to add a debounce. So now after 200 milliseconds, debounce the actual loading of the image so that it doesn't interrupt this initials that we just showed. And it's just like the amount of states that needed to be handled was this little tree that just kept growing. And it was just like this is supposed to be is the image loaded or not yet. And I loved it. It was just a classic scenario that I could hear you whispering over my shoulder, you shouldn't have started with booleans. Yeah, honestly, as you were saying that, I was visualizing the state machine.

Like even that part's most interesting where you show the initials and then it immediately shows the next thing. Obviously, when you're in that state, that's when you should have sort of that grace period of like, hey, let's wait a second before. Like, man, I see so many apps that just have that jagged UX where it's like it's not there. Just kidding. It's there. Like, Reddit, all over Reddit. Yeah. In a state machine, how would I debounce and guard? So, I know there's guards. So, it's like in this state, you can only go to these other states, but how do I guard it on a certain amount of time? So, I'm like, if you're in this state, never allow you to exit this state until this other timer has gone off that all of a sudden unlocks the gate. And so you've got a state that's waiting to change, but it's like a horse wanting to mount and run.

Okay. Well, that was just a stupid try to call back, but anyway, you see what I'm saying? Like how would I guard and time a state change like that in Stately where? Yeah. Yeah. So, so you would have like a state where it's like showing initials and then when an image, you know, finally loads, that's an event. So, you would go to another state or it could be a state inside that state depending on how you want to organize that. And in that state, let's just say pending image or something, you would have, it's called an always transition. It's basically a transition that no matter what, it's going to happen after some delay or whatever you want. Actually, just kidding. It's called an after a delay transition. So after the delay transition, then it goes to your showing the image state. So it's literally just three states. So you're here, image shows, now you're in the waiting state.

After a delay, you go to the image state. Awesome. Let's see. Rails or Laravel? I've never used Rails actually. I've seen code examples. I've never tried it. I have used Laravel or Laravel, however you want to pronounce it, in the past. Even many years ago when I tried it out, I was like, "this is such an awesome framework." Like, it's all batteries included. Like, there's a module or whatever you call it, a package for everything. like they've thought about everything and I really do love the whole batteries included aspect of it. You know, we also have Django for Python. There's Phoenix for Elixir. There's just all and of course there's Ruby on Rails. There are frameworks like that in JavaScript. They're just not as popular as next, which is so bare bones compared to, you know, all of these other frameworks that I mentioned. So, yeah. Why aren't they more popular? I honestly don't know. All the money has gone to this meta framework stuff. Tom Preston Wernern has been doing Redwood for I don't know a long time now.

Yeah. Like six years, seven years more maybe. I don't know. It's basically a Rails or something batteries included but for React. And it's like why do people not want that? Why do they like the pain of like I can put my files anywhere. I can do whatever I want. Like I guess the freedom maybe. I think that's it. I think that we have a lot I mean obviously there's a lot of PHP developers but we have a lot of JavaScript developers and they all have lots and lots of different opinions. So you can't really build a one-sizefits-all thing that will get super popular because the minute someone says it includes something that I don't like then they're just going to you know dismiss it or be like I'll build it myself or I'll move to something else. The state of things is like let's say that you want to prepare a simple dinner. So you go to the grocery store but it's only a grocery store for vegetables and fruits.

So now you have to go to a different kind of grocery store, pick the stuff you want. And it turns out that all of the different stuff, the best packages are ones that are SAS. So you have to pay a subscription for them. It's all just very fragmented. It is possible to have a really good like not batteries included, but you include everything that you need experience, but it's going to be costly and it's going to be just lots of fragmented pieces that are trying to work together. I guess the closest I would say the closest I've seen to like this semi-popular like batteries included framework is Convex. I'm not sponsored by them. In fact, I was pretty opposed to them when I first heard about them, but I'm using them now and I love them. They do include a lot out of the box and I really hope to see the JavaScript ecosystem move towards that where it's unashamedly here's my opinion.

You could adopt it or not. But trust me, your life is going to be a lot easier if you defer your opinion making to this framework rather than trying to have opinions. This just in whiskey.fund the fund is now open for all your merch needs. That's right, Robbie. We're hearing reports of hats, sweaters, and t-shirts, as well as a link to join our Discord server. What's a Discord server? Just read the prompter, man. Hit subscribe, leave us a review on your favorite podcast app, and tell your friends about our broadcast. It really does help us reach more people and keeps the show growing. All right, back to your regularly scheduled programming. Yeah. So, couple of things about that. I wonder if both opinionated frameworks being easy for AI to follow because they're so opinionated is going to be helpful and make people want to move toward them so they can build stuff way quicker with AI or if because AI is getting better and better at doing whatever you want. if it will make people do more of just random that they're putting together because like you know you can just tell it all I want to use all these services I want you to time together I want you to figure it out I don't need a batteries included thing cuz I want you to do it all like what do you think about that's a really interesting question because it's sort of a double-edged sword right now you have basically two sides of the coin the first is let us like just go down a welltrodden path where for example let's do everything in next or everything in Laravel.

The problem with that when it comes to AI is that it is basing all of its code and all of its knowledge on the average developer. The point is that AI doesn't produce good code because it wasn't trained on good code. It was trained on your code. And so by that I mean it's average developer code. So it is going to include the common foot guns and mistakes that developers make and those are very present in the welltrodden paths. So your typical React app, you ask it to make React anything, which seems to be very popular with app builders. It's going to include your useEffects, your use dates, and all of these antiatterns that advanced, you know, more senior React developers would not do because they know better because they actually read the docs. But the AI is more biased on the average code than the actual documentation and it doesn't like keep up to date with the docs as well as it should.

On the other hand, you have code that it's like you're trying to piece together different things. you're trying to do something unique and that's going to get better as AI progresses, but it won't be as good as your standard like welltraveled path of we've made the same tic-tac-toe or to-do list app millions of times before in React, so I could just regurgitate it to you in my sleep. So, yeah, I think there's trade-offs with either approach. I'm bullish on the second approach of AI getting smart enough to actually combine these services, but there's still a lot of work to do there. Like I said, AI does not have like the most up-to-date knowledge of documentation when new versions are released. It even does silly stuff like manually update like package.JSON. So, you know, it's going to go for a lower version than it should. Yeah. So that there's trade-offs all around and I think that any good developer should be well aware of the trade-offs of either approach.

So I think that hopefully developers are going to go this path of trying unique solutions, not going down the same path every time and just exploring what there is out there just because nowadays it is a lot easier to try new things. like Remix just came out with their new like whole anti-React pure DOM approach, pure events approach and LLM's like they already know the DOM, they already know all these events. So they could write that code pretty easily even though Remix is a completely new framework. So I just think that developers should not shy away from new stuff. Well said. And leaning into native browser things is also helpful because yeah, AI will know how to do those unless you're interviewing, right, Adam? Yeah, they don't want to hear that. They want to know. Well, they want Captain hooks to show up is what they it's like, I got eight tentacles.

Each one knows the hook code really well. Oh, that's funny. You keep calling it the welltrodden path. And I was listening to Oh, man.

Play from 22:00

Celebrity names. I suck at them so bad. Who's the famous artist guy who's helped tons of people with he's a producer. Rick Rubin. Oh I remembered a name. Rick Rubin was talking about AI the other day and he was like, "remember punk rock?" And it was it's like so approachable. In like a day you could pick up an electric guitar and learn a few chords and start a band. And he was like, "that's what AI has done to web development is he's like, you can sit down in a day, play a song, and you've never been able to do that before." And sure, it's a mainstream song, and sure it's not creative, and sure, it's not piecing together historical orchestral remnants into a new modern masterpiece.

That was a pretty good madeup phrase right there. Someone write that down. Anyway, whatever. But I like how like you keep explaining that it's just the current state of where we are. It's almost like AI right now is only good at power chords. Occasionally it makes a solo and you're like, "dude, did you see it going? I had to really work for that." Robbie knows this. He makes amazing art for each of these episodes. And if you look at the art, you're like, "that was not a oneshot prompt. That is a crafted prompt." And so you see people like taking power chords, taking these things and then saying, "well, here's how I express myself with these." And so it's like democratizing web development through the sort of use of power chords. And as much as I don't like Rick Rubin, I thought that was a pretty good description.

So yeah, I don't know. You kept reminding me of that as you were describing what was the state of things. Yeah. And React and Tailwind are the power cords of the web right now of the of the AI code generated web. I should yeah, people will either love that you said that or hate that. Yeah, I like power cords personally, but you know. Oh, speaking of AI, I've been I've been like really conscious of so I've got Cloud set up. I have all sorts of AI agents set up and skills just came out. Have you all seen skills that came out with cloud last week or just a few days ago or whatever? Skills? No, I don't think so. Skills. David, do you want to describe skills or do you want me to? I want you to, but I'm going to try to explain it. Skills are basically a markdown file that gives Claw domain specific knowledge on how to perform certain things.

I haven't tried them out yet, but that's just the what I've gotten from their announcements. Great explanation. It's almost like where you give an agent a role. You're like, you're an expert web developer who always writes perfect TypeScript, but this is more specific. So, that was kind of a generic role. And this is saying you are good at whimsical animations and you would go give it not only just this description of like what it's good at, but it examples. says like, "here's three amazing animations. You produce these in your sleep or whatever." And so we have these skills that are sort of competing with MCP servers where an MCP server might have taught an LLM something on the fly, but that requires an endpoint, requires handshaking and conversation back and forth, lots of tokens. And at this point, they're basically like, what if we took an entire MCP server and squished it down into this little markdown file and rapidly condensed it and then had its ability to invoke these specific attributes when a specific skill is needed.

So then you extrapolate a little bit more and people have already created these like skill slurpers. And so like if it doesn't know the skill, it's like the Matrix where if you don't know it, it jacks it into the back of the head and all of a sudden like you're you can fly a helicopter. And so people are making cloud now connect to the internet, go learn a skill on the fly, like literally creating the markdown file. So it'll go to a website, turn the entire documentation, summarize it into a skill, and then use that skill in the moment. And so I've been following all these things. It's it just sounds so cool for something to be able to learn on the fly. And then I'm reading about the latest AI hacks that are happening right now and all of the really interesting ways people are hacking AI, especially through these AI browsers.

And I want to list a few of them here because they're so interesting. Like one of them is hacking you through your CSS file. So the CSS file just has a comment block. Yeah, it's programming language. You know, an LLM reads it. Like anything in an LLM or read, people are like going to start nesting little prompts into that steal your stuff. And if you're in an AI browser, you're not only just stealing what's on the page, you're stealing the credentials that AI has across all of the tabs. It could it can open tabs in the background and do things without you even seeing because that's just how it works, right? Now, it hits 20 websites and then goes and finds the results and gives you the answer, right? But what if it goes and hits 20 websites and buys 20 things and you don't even know? It's like a completely invisible thing. So, I just like want to read a few of these cuz they're really wild.

So malicious pages embed instructions in their HTML. Your agent processes the page with your cookies and your session tokens and when it follows those hidden commands, it acts as you bypassing same origin protections entirely. Here a hidden prompt in a comment made the agent read a user's email OTP and hijack the session by making cross-sight requests. Even after patches and mitigations, attack vectors remain. Zeroclick attacks. Listen to this one. Your AI agent reads your emails automatically. An attacker sends you a document with embedded commands. The agent extracts your data. It just reads the document. It's like, "Hey, let me read this document to give you some context about this email." That document, you didn't even click it. You did nothing. It's full of malicious prompts and it just starts stealing your right off the bat. So, like we have basically like we have years of the of browsers fighting and learning to protect us as we browse the internet and AI browsers are showing up and hitting the reset button.

There's an entire like and everything we've ever learned now needs to be retaught to LLMs because they just take prompts at face value and they don't really know when and where a prompt and there's no protocols to say that this prompt was user generated versus you scrubbed that off a web page. It's all the same in a lot of cases. And so especially when it's trying to be proactive. And then the real tension here is like in order for all of this stuff to be good it has to know everything. You know, and when it knows everything, that means when you get pawned, you get pawned everywhere. All of the things that you've logged into just became accessible to this thing and it knows what they are. It's not even a mystery. It doesn't even have to crawl to discover it. There's a history. It could go into the tabs you currently have open and just be like, I smell a victim. You know, like, yeah.

And it's just like reading this stuff in this month of October and I was like this is the scariest thing I've heard this month is the creative and there's just like a list. I'll put it in the show notes. There's just a list of creative terrifying ways that the browser has been protecting us for 25 years that LLM just unwrapped and gave to people on a silver platter. Was that scare y'all too or is this conspiracy theory and I should like cool down? What do you what do you think? I mean, it is scary, but at the same time, it doesn't scare me because these kinds of things have I don't want to say they've always existed, but they've existed for a while in the context of browser extensions. When you install a browser extension, you're implicitly giving trust to that extension to do a lot more things than a normal web page can do. I've worked with browser extensions for years now and they can do a lot that normal people even developers don't realize that they can do.

They could, you know, read cookies, read your other tabs, just read the page contents, everything. So basically, yeah, when you have AI controlling your browser, like at the time of recording, I think it's OpenAI Atlas came out. So we have that new I mean there's also DIA and comment and whatever and probably just numerous other browser extensions that are AI powered like there's always that risk of like hey the website is going to inject some nefarious stuff into the prompt and then that's going to leak into the agent and read all of your stuff but that risk was always there with extensions too. It is scary but you just always have to be cognizant of that. Nice. How about you Robbie? How you feeling? Yeah. I mean, I feel like it's like anything else where if you're a little bit educated on the problem, it's easy to mitigate, but it's like the people that it's going to get is like you like tell your mom, "Yo, go get this new AI browser." Nope. Not a good idea. Like we're able to like notice things that like could be a problem and not fall into that trap.

But yeah, I think the wider population if this starts to be a thing that everyone has is going to have a lot of problems for sure. So the reason I brought up skills in the beginning is because it's easy for us to assert that the browser an AI browser is more generic and problematic for our moms and our family or whatever, right? But the skills issue that I so I just last night was looking at a GitHub repo that's like skills on the fly. That's what I was telling you. Skills on the fly sounds super dope, right? That is naively visiting the site and slurping it up and sticking it into a skill which you run on your command line. Okay, so now you're the dork. Okay, it's not just your mom, it's you trying to slurp and sidetrack or sidestep all sorts of stuff. And you just did that like the to are we going to ask all these tools that are slurping up and creating skills and writing MCP servers to also make sure that they have security inside of them?

It just seems like a it's a big that'll be coming up. Yeah. And I just I'm trying to be very conscious of it. A because it's interesting. Hackers are always interesting. What a creative field and just to think outside the box like that. But anyway, that's that's my little story. Can I tell you what I love about state machines? I know it seems like a nonsequittor, but it's actually related. I love this, dude. Bring it back. All right. No, it's very, very related. like all the stuff you're saying is very valid with like security concerns and also like just prompt injection in general ever since you know GPT3 2 or 3 was released.

Play from 33:00

People were saying, "Oh, how can I get around it? How can I spit out a system prompt or make the AI do stuff?" People are even just going on website chat bots and being like, "Oh, wow. It issued me a 1,000% refund, so I am entitled to money." Like stuff that should be impossible. And so people are they're sort of estuing the whole deterministic nature for this non-deterministic LLM that's just like, hey, I'm going to do whatever I want, but since I you believe that I'm smart, it's probably going to be the right thing. But of course, with prompts, you could trick it to do the wrong thing, which has been proven time and time again. And so that's why I'm still bullish on state machines. You could think of state machines as the dumbest version of AI just because it's deterministic. Like what that means, people throw those words around, but with determinism, you know, given the same inputs, you're always going to get the same outputs. Non-determinism, you're not going to you're not going to get that.

And also with state machines, when you're in a state, there's only a certain number of possible actions that you could do. So apply state machines to LLMs and now you have something where it's like even if someone was suggesting oh hey this prompt says do something nefarious the agent which could have an underlying state machine can say like hey I know you want me to do this but I have three possible actions to choose from and even if I wanted to give you the bank accounts information or whatever that's not possible there's only three things to choose so you have that extra mathematical layer of protection. And by mathematical, I mean it's mathematically impossible to do something that's outside the state machine. It's sort of like railroad tracks. You could only go in those unless something really bad happens, but you could only go down one of those paths. And so you could actually control the nature of something non-deterministic like LLMs by saying, "Hey, you're restricted to only these actions." And that's something I really want to see more of, especially from a security standpoint.

Play from 43:00

It's just saying you're only allowed to do these things in the states. It's a awesome answer. A quick followup is that Anthropic just came out and announced Claude can now run in sandboxes. So it's not a state machine solution, but they are constraining out of the box. This reminds me of Node versus Dino. Node is a free spirit. You can give it mushrooms and it will trip. Dino will be like, "no, I won't take those mushrooms unless you said it's okay." You know, like, "did you spin me up and say it's cool?" Then it's cool with me. So, like you have these like kind of like opposing mentalities. So, just in general, it's the same thing. It's like again like AI in order for it to be as marketable as it needs to be. It needs to be unfettered. And so you're suggesting that it's on rails and that it can't make decisions outside of its current perspective that you've pre-programmed, which by the way, I think is a brilliant comparison and a very effective thing that could really prevent a lot of security issues.

However, you're going to have marketing and UX people show up and be like, well, if we start to make people choose to allow stuff, it causes extra clicks and extra abrasion in the experience. And we already see that with clot and people hit YOLO mode. So many people run in I'm sure I have. I've Okay, I've run my stuff in YOLO. I'm like, you know what? I am so tired of this allow list. I'm like, just do it all. I trust you. And then I'm like, I need to stop trusting because the more I read about this stuff, I'm like, I cannot y they should take out yolo mode. You know, it's as convenient as it is, it's asking for issues, right? But this is the tension that we have to deal with, which is like I'm a lazy butthole and I want to hit go and then have it go versus I want to babysit this thing and be a dad.

Be like, "Oh, I have two agents running right now and you're misbehaving. You know, I need to tell you again.

Play from 45:00

I want so, it's like I get both sides of this and as a user, I want one, but I have to respect what I'm enabling. And I don't know if that there's going to be education or UI or state machines that protect people from this, but it's a real problem." Yeah. Honestly, it's like autopilot. Even right now with autopilot on Tesla or cars like that, they still want your eyes on the road. They want you paying attention fully. They want it to be supervised even though it is smart enough to just navigate like situations that you might have never encountered in your life. And so I know the desire to be lazy. Trust me, I have like let Claude go loose and be like, "yeah, yeah, just edit it, do this big feature, and then just tell me when it's done." And then I go and I see the feature.

I'm like, "Okay, I need to revert this entire thing. I don't know how much money that cost me. It just sucks." So now that's why I really want to post this on Twitter. Like it's sort of a you know the midw curve. You have the like the bell curve. The bell curve. Yeah. Yeah. Yeah. Yeah. So you have the people on the left side who are like, "Oh yeah, I use AI too. Tab tab and press enter." And then you have the people in the middle where it's like I have teams of agents and sub aents and deep agents working together and doing all sorts of things and controlling my desktop. And then you have the people who are deeply working with AI where they're like, "yeah, I just tab tab use it for autocomplete and small tasks at a time." In fact, I don't know if you've seen the Carpathy interview.

Really really good stuff. But Carpathy is like one of the top AI researchers. Yeah. that's exactly how he uses AI too. He uses it in small parts and he uses it mostly for autocomplete and that's how I work as well. I don't know all of these agent clusters and sub aent stuff that people are doing. I don't do it. I don't need it. I just like having a little bit more control. Yeah, I've been lazy recently and I'm glad that there are actually a little bit of guard rails because I was using open code to work on a V plugin earlier. I was building the V plugin in the context of an app because it needed to use it and then I wanted to split it out and like publish it to npm as a separate package. And I was like, "Oh, cool. Dope. Just move that to another folder and like publish it for me." And it's like, "I can't." And I was like, "Oh, wait.

You actually have guardrails to where you can't just edit the rest of my system. That's kind of good." So, you do have that small little bit of help there. But, yeah, we had a guy on the guys from Friday deployment spirits. I don't know if like how serious he was about this product, but he said he was making a thing called maybe not.AI or something like that and it was like just security for AI. It's like maybe you shouldn't AI on that. Like here's the guardrails you need for like how to do that, right? What a tough problem. It's like we need something at the network level because the file system level is people are giving access to folders really quickly. I don't even think people read the long path. It's like, "Hey, I'm trying to do this thing on blah blah blah blah." Is that cool?

Play from 47:00

And people are like, "allow, obviously. Get on my face watching Netflix while you work, fool." You know, like I think that's such a bad habit that AI is training us unknowingly training us to do. Just like the days of like, "Oh yeah, that's a really long PR. They probably know what they're doing. I'm just going to approve that." Like, it's so bad. I think it's similar to gambling, honestly. Like you're it's the dopamine hits. I'm autod doing I'm just hitting go go go go go go go go go go go and I want like when it works you're like oh yeah that felt it's a slapper prompting it's just a slapper. Oh my goodness that's a good call dude. So we've talked a lot about tech. Tell me about pianos. Pianos? Yeah I have one right here. It's my Lego piano. Al another one here. It's awesome. I love it.

I still play piano. It's my favorite non- tech thing to do like just when I'm done working or even in the middle of the day working on some Christmas tunes right now. I know it's a little bit early but like yeah just for fun. Nice. Nice. Good call. I need to remember Christmas on like Jingle Bells on Banjo. I learned it a year ago. I'm sure I'll pick it right back up. Good call. I need to start ramping that practice back up. Yeah. Yeah. And I feel like it's important to have just some sort of completely non-technical hobby just to let your brain reset. It's sort of like doing clear context from Claude where it's like, "yeah, you have all this junk. Just forget about it. Go touch grass. Come back to it." So for us, that thing for us is just, you know, whatever it is outside of the computer.

So that's that's piano for me. Nice. So, possibly related, if you weren't in tech, what other career would you choose? So, this can also be if you want to like sky's the limit. If you want to just gain a skill without like having to do any work, like what's your ideal thing to just do all the time? I mean, I went to college for piano, so it was sort of my dream to just I don't know, play piano all the time, but now it's like just sort of a post tech goal where it's like once I'm done and retired, all I do every day is practice for a few hours. And that sounds dreamy, man. Be a music. Does piano help you with typing? If you're learning to play really complex piano things, does that make your typing speed faster? I think I have pretty fast typing speed, but yeah, like just with certain combinations of keys and stuff, I guess I have more of a muscle memor I don't know if it's more than the average person, but I do have a lot of muscle memory for just a ton of like VS code keyboard shortcuts to the point where I can't tell you exactly what the keys are.

I just know if I need to do something like go to a reference or like move this up a line, I know what buttons to press, but I cannot tell you exactly what they are. It's in there. Yeah. And I think that's some of the piano coming out and doing that. Yeah. Yeah. I haven't played piano in a long time. I did lessons for like three or four years growing up. I could like if I tried to do anything now like the thing I remember being hard like learning is like doing like a beat with one hand like just playing a chord and then doing like notes with the other hand that aren't like the same doing that I feel like would open new pathways in your brain that help you with all things that you need to use your fingers for.

So I feel like there could be a correlation. I think so too. Yeah. I don't know the exact psychology behind it, but a lot of good developers I know have also done music or some sort of fine arts. I mean, Adam plays guitar. So, I played piano first. I did four or five years of piano and I was really weird in that I played a lot of the video game music that I've here's a fun little dive into history. I listen so it's like a final Fantasy. I would go get the MIDIs and a MIDI was a multi-layered instrument variant of a song and you could go break out various instruments from the MIDI and I would go and I would load them up. It'd be like 10 instruments in this song in final Fantasy or Parasite Eve or whatever it was and I'd go find the two that I wanted to play on piano and I'd isolate them.

I'd delete the rest and then I found a tool that would convert MIDI to sheet music and then I would print out I made tons of my own sheet music and then would sit down at the piano cuz I got tired of playing like painting along the ocean like all these songs and they're like they were beautiful songs right you know like don't get me wrong like I loved them but they're just like oh the Beethoven classic painting by the ocean I try to remember the name of the guy there's like a couple of people that I was like I played a lot of their songs and they're like they were they were cool but it's just like I was 14 and I was like, I need to get chicks.

Maybe they'll like video game music, which was wrong. Anyway, what's very cool? Check out this Sephro song I can play on piano. Like, hallelujah. Anyway, that was what I did. And I had a lot of fun like creating my own sheet music and piano. I just wanted to comment on like muscle memory is so cool. Like how cool how cool is it to sit down and be like my brain is not going to do the work right now. My muscles are because I don't know what the hell's going on. But for some reason when I go brain that song from 25 years ago and it goes I'm like I don't even know what's going on. Like my head is somewhere else and my hands they know it all. What a cool thing. Yeah. So cool. Same thing with code too. Like sometimes when I'm refactoring, it's like I know exactly where to go, which files to go to, and it's just sort of mindless.

And I that's why I love refactoring. I think it's like piano where it's like that road to practice or doing scales. Like that's refactoring to me. Like I won't let AI do refactoring. I want to do it myself. I might let it tap tap, but otherwise, I don't know. I just find joy in it. Did you ever play live music and do this thing where like I remember it was so hard to even get good at playing guitar and singing at the same time? But then after I'd played a bunch of shows, I would be playing and singing and I would be somewhere else. Like my mind would be like looking at people and thinking I would even process I needed to do after the show. I'm in the middle of doing something extremely complicated. Yet somehow I'd done it so much it was a mindless activity and now I could spend my brain power doing something else entirely.

Like bodies and the humans are cool. It's kind of the thing here. Like we are incredibly powerful units on this planet and music is like one of those things that like somehow we can conquer this very complex, very emotional, very like the planet doesn't want us to play music and we're like guess what? I'm going to play you a song, Earth. It's like, I didn't ask you to do that. And you're like, I'm going to do it anyway. It's like, but we do it and then we like are somehow elevated into this next state. It's just what a cool little thing to exist to get mindless doing something wildly com. It's like when people are doing three Rubik's cubes and they're probably like writing a poem to their girlfriend at the same time because they have a girlfriend when they're doing Rubik's cubes. Anyway, you know what I mean? I know exactly what you're talking about. like when I'm playing covers or improving or something like that, like I'm thinking about my day or whatever, but it's just so awesome to just let your fingers go on autopilot.

Yeah. All right, we are at time here. Anything you would like to plug or where can people find you, etc. So, people could find me anywhere online, David K. Piano. So, GitHub, Twitter or X now, Instagram, it's on private though. LinkedIn people go. No, no, don't go there. LinkedIn, even though I think LinkedIn is just slop like more so than Twitter, but Oh, that's a hot take.

Play from 50:00

Yeah. I'm sorry. Are you posting this on LinkedIn? I hope you're not. No, I mean, not right now, but just kidding. I'm also the founder of Stately. So, something we've been working really hard on. If you want to visualize state machines and you know just make cool state machines export them to code or go the other way around then just go to state actually states new we got that domain you could just yeah that's awesome get a state machine just from there. Nice very cool. All right thanks everyone for listening. If you liked it please subscribe leave us some ratings and reviews. We appreciate it and we will catch you next time. You've been watching Whiskey web and Whatnot recorded in front of a live studio audience. What the are you talking about, Chuck? Enjoyed the show? Subscribe. You know, people don't pay attention to these, right? Head to whiskey.fun for merch and to join our Discord server.

I'm serious. It's like 2% of people who actually click these links. And don't forget to leave us a fivestar review and tell your friends about the show. All right, dude. I'm out of here. Still got it.

Play from 58:00