Cloudflare Wallets

What's up, everybody? Thanks for tuning in. This is a Syntax livestream. Tons of news going on this week. We've got Cloudflare wallets was just announced. We're gonna talk about what that is and why you might be interested in. Another Shyhalud attack going down right now. Scott's gonna fill us in. Don't npm install anything until you hear what Scott has to say about that. A a real React compiler. Last week, we talked about the new React compiler, but she has got a new React compiler. AI pricing wars have started. OpenAI is discounting a lot of their models right now, plus a whole bunch of it. If you have anything you'd like us to cover, hit it down and throw it down in the chat and, we'll be sure to cover it. What's up everybody? How are you doing?

Oh, doing good. How are you doing, Wes? Yeah. You you get wormed today? Not yet, unfortunately, but... Or fortunately.

Not yet. Unfortunately.

Unfortunately.

Wes wanted to get wormed. I got it. News Yes. End Yes.

Dewormed. Yes. We need to get dewormed. Well, today, there is a new Shaihulud attack going down, and one which has already compromised 868 packages carrying over 2,000,000,000 monthly installs.

So the... Seems like the main package that was compromised, it started with this Kiev package, which I haven't used. Have you guys used this one?

No, I don't believe so. But you never know if it's all the way down the dependency tree. Yeah. Dependencies. A

it's a key value and cacheable It's a key value library that I... It seems like it has quite a lot of people using this. So this is a a library that, well, was compromised, now the worm is doing worm stuff, and a ton of other packages have been compromised. So the the folks... The advice that we always give you on these worms is that you should be setting your packages not to install things that have not been available for at least a day or so. Pnpm, npm, they all have this feature.

So pnpm has it by default. Easiest solution is to just use pnpm.

It's a great package manager in the first place. But just scrolling through this list, it's just another one of these big old worms that's coming up to slurp up all of your stuff, which is really...

The the thing here is that it's it's trying to it's trying to grab your ENV variables. It's trying to grab all kinds of stuff. Again, a preinstall hook fires on npm install and drops a stealer that sweeps npm, GitHub, AWS, Kubernetes, and vault secrets and then spreads to more maintainers. This is the same type of worm that we've seen over and over and over again. I think this is, like,

the fifth or fourth Shy Halood that we've seen recently. This year. This year alone. Yeah. The last six, seven months.

So

be careful out there, folks. A CSV of a ton of packages that have been hit from this bad boy. One interesting thing about all of these attacks is that you're not hearing these stories of there was an attack and these Bitcoin wallets were drained immediately.

You're often hearing there was all of these attacks, then we don't often hear too much follow-up of, like, what actually happened. And shout out on Friday, I'm releasing a video on the, like, black market of AI tokens.

And and what I'm learning is that a lot of these hacks, they're they're stealing your AI tokens or they're stealing access to your...

To whatever app you have. And then they are just just stealing enough that you won't notice it. And they're selling those on the the black market. So on Friday, have a video going live. Make sure you catch it.

And where I dive into, I actually go ahead and buy some of these black market tokens that are often stolen in these attacks.

Wow. Nice. Yeah. I'm really stoked to to see that.

Me too. And and I'm working on a video that will show you how to not run code on your computer, potentially to stop you from being a victim of one of these attacks as well. So we got you covered here at Syntax. Yeah. Yeah. We got you covered. And I'm actually making a video

on mental health and AI coding, folks. So I'm running a survey right now, and I'll post this in the chat. If you could fill this out, it is quick. It's a breezy five questions. Actually, it's I lied, it's six questions, but one of which is just how many agents are you running. So, we're doing a deep mental health survey here really super fast. If you could go ahead and fill that out, that would make the results a lot better, and the video's coming soon on syntax.

Just That video just is gonna be mental, Scott.

I don't... Can you say that? Yeah. I guess so. Yeah. It's gonna be mental. Yeah.

Can can we say that? I once got in trouble for saying that this is bananas, and somebody told me was a mental health slur.

What?

Yeah. Bananas? No. Can't say bananas. Something... If something is bananas, but now we say insane, and it's okay to say insane. But four years ago, you weren't allowed to say bananas. Insane in the brain? Yes. The membrane. In the membrane. Yes. Yes. Yes.

So you got no brain. Yeah. Yeah. So... And before I hand it off, I actually have some super relevant news. I'm just gonna slip right in to get this one in GitHub, who...

Microsoft owns npm.

They published on the GitHub blog.

Wait. Is this... Yeah. So they are now doing published time malware scanning and dual use metadata. So this is something I mentioned they needed for years, but this would potentially prevent the... An attack like Shaihulud from happening because before a package goes public, it'll be scanned for malware. But now I'm reading it. I'm realizing maybe this is the GitHub registry, not the npm registry.

But the idea here would be if if a package maintainer gets compromised and they try to publish, it's first gonna do a malware scan on the npm side, and that would prevent it from being published if malware was detected. Mhmm. So they're doing their best.

I'll have to confirm if this is just the GitHub package registry or if it's npm in general.

Yeah. That's always been a weird part about it is that, like, what's published on npm is not necessarily the same thing that's on GitHub.

Mhmm. Yeah.

Yeah. So this is good news and ideally will prevent some of those types of attacks from happening.

But I'm gonna hand it off to Wes. If you're just joining us, this is Syntax Weekly. We're going over news in the world of web dev and AI and everything else that we care about. And, Wes is gonna talk to us about the new Cloudflare wallets.

Yes. This was just announced a couple hours ago as of the time of recording this morning. Cloudflare wallets have been announced. It's essentially just wallet for your agent.

A couple of months ago, Cloudflare announced the monetization gateway, which is essentially you want agents to be able to access your content, whether that's to pay for inference tokens, whether that's to get data, etcetera, etcetera, then your agent has to pay. Right? And there needs to be a way for these agents to be able to pay even if it's like 0.5 a cent or a cent or 12¢ for access to the specific thing. So there's been this new, like, open standard x four zero two payment required, which is essentially this way for, agents to be able to pay for access to whatever it is you want. Now, this morning, CloudFront announced the CloudFront Wallets, which is essentially going to allow you to give a wallet which can hold, stable coins. So it seems to be it is a crypto wallet, which I think is kind of interesting before I even get a bit more into that. You know how QR codes, the solution to QR codes were announced and we never used them for the longest time? Then the pandemic came around and we're like, oh, QR codes are actually helpful for, like, menus and ordering online.

Like, like, we had QR codes for, like, fifteen years before they actually became useful.

What if the actual useful part of crypto ends up being the agents can use it to pay for things. Wouldn't that be wild? Oh.

That's what makes it relevant again? Yes. Wow.

Maybe. Yeah. Maybe. Yeah. But the... What these wallets will do is you'll be able to both send and receive, so you can pay for things with, you can give, you can create like a wallet and you can give it like $20 and say, go complete this task for me.

And you might need some AI inference, but you may also need to access to some data that is paid. Like one example of like paid data is like stock market, right? Stock market is for free pretty much on so many different APIs, but it's always fifteen minutes delayed. And if you want the most relevant, you have to pay like big bucks to some provider to get like, like updated on the, the millisecond.

So that would be a good example. Like, yeah, I want to run this every three hours, but I wanted to do it with updated data.

You could use this type of thing for it. Now, with that, Cloudflare is allowing you to reserve your own wallet because they are, I guess, going along with, with the wallet is you have this identity of like, who are you? Right? Because if you want to pay for something, you have to like, be able to attach that to somebody. And that's that's, I guess, one of the problems with crypto right now is that it can be very anonymous.

It's it's a benefit and, and a bit of a problem.

So you can register your handle on cloudflare.pay.

So you can tell your agent to go off and do something and get yourself a little something for yourself, some inference for yourself while you're out there.

I thought it was interesting that this... Like, they're not the first people to do this. There has been like kind of two...

There's more than two, but the two that stick out in my mind is Shopify has this shop app, which is essentially all Shopify merchants. You can just buy stuff from Shopify merchants through shop app. It's sort of the I gotta say, I like shop I like I like it quite a bit as well. Yeah. And they have... If you go to, like, any Shopify website /skill.md, it gives you instructions on how an agent can buy something via the shop app. It'll do it programmatically and you can give your agent like $100. You can put some some money or you can say, my shop app is already has my credit card in it.

Now, go ahead and and buy me something. Like, I don't know if I'm going to tell an agent to go buy me a shirt because like, that's I I don't feel like real people actually do that. You know, you see all these AI bros that are like, buy me shoes.

And then it goes off and buys you shoes. They're like, holy crap, it bought me shoes. Computer, buy me shoes. Computer, better shoes. Computer, make them red. Yes.

I don't feel like that's the actual move, but you can do it via shop. And Stripe has like link pay. You know, if you ever go to a website and you put in your phone number, and all of a sudden, you get a text message, the code puts in, and then your credit card's hooked up. That's doing something called Stripe link.

And Stripe has this thing, Stripe Link for Agents. So there's kind of a couple people playing with it right now, but I reserved my handle at Wes Bos, so when it does come time that you can send people money, please, I am begging you to send me some money.

I'm begging you. I'm begging you to send me some money.

And get... Let's get some... Let's get a little something for Wes' agent too while while we're at it. Yeah. A little something something. Yes. A little treat for yourself. What would be a little treat for an agent? Like, API key or, like Well,

if it's if it's always running these, like, cheap Chinese tokens, like, every now and then, like, you get... Okay. You treat yourself to $2 a fable. You know? Yes. Do something like that one thing that you've been meaning to to to ask and you can't figure it out with any other thing, treat yourself to a little fable. Something really nice. Well, CJ has

something for us now, which is something high octane, I'll say, which is is a new React compiler. Is it a new framework? What is this thing? CJ, you tell me.

I'm gonna get into it, and I'll start with a little bit of backstory. So if you're not familiar, the React compiler was released version one back in October 2025.

And it's called a compiler, but I have complained about this that it's not actually a compiler. It's it's more so a React optimizer. So if you look in the React docs about what the React compiler does, it essentially takes code where you had to manually add use memo and use callback, and makes it so that you can write code that doesn't use that. But then it goes through, finds all the spots where it should add a useMemo or add a useCallback. So that's what the React compiler from the React team does. It's basically an optimizer, so you don't have to worry about the the nitty gritty details of useMemo or useCallback. And that's fine. That speeds up a lot of people's apps and fixes certain bugs they didn't know they had. But like I said, this isn't a compiler, it's more of an optimizer.

There's a new there's a new kid on the block, and it actually comes from the creator of Ripple JS, Ripple TS.

And I made a video about this when it came out, but this was a brand new framework. And the whole idea was they came up with this new template syntax, and it's a bit more declarative in that things kind of run top down. So if you know the rendering model of React, basically, you define a component, but this is a render function. So anytime there's an update to state, this render function is going to rerun and then produce a new virtual DOM tree, and then that gets added or reconciled into the DOM.

Whereas with this, your template essentially kind of runs once, and then only the parts that are interactive will update or rerun when they change.

Very similar to what like Solid JS does, or if you look at the reactivity model of like Svelte.

So, yeah, this was Ripple.

It made some waves. I think a lot of people were turned off by the syntax. They go into why they like this syntax and why it works for their compiler versus just standard JSX.

So that was fun.

And that also resulted in a, like, TSRX that you could use with React. So the creator of this, Dominic Ganaway, he saw that people liked the syntax, and then instead of making an entire new framework, he made it so you could actually write TSRX with React. Okay. So that's the backstory. Dominic is very prolific in the world of JS. He also created this framework called Inferno JS.

And so this uses JSX, it looks very React like, but it's a lot more performant. I don't know all the nitty gritty details of Inferno, but I'm giving you all this backstory because Dominic knows what they're doing. They have a lot of experience in this space. And that leads us to the latest release, which is Octane.

So it's a new framework, but the tagline here is React's programming model compiled.

Essentially, you can write React code exactly like you're used to. So you have useEffects, useStates, etcetera, etcetera. You can basically just swap out the import from React with Octane.

But now when you build your app, there is no virtual DOM runtime.

Everything gets compiled into Vanilla JS with update code to change the DOM directly if state variables change or anything else.

And this is also something that I've been wanting... Like, this this fixes React. Like, people say that there's nothing wrong with the rendering model of React, but it's it's weird. It's, like, it's the it's the source of so many bugs and foot guns, because a lot of people don't realize how often something will run, and then you're playing, like, use effect limbo to try to pass things around.

But the main tagline here is basically swap out React with Octane, And now when you bundle to bundle your app, it's gonna be smaller automatically.

It's gonna be faster because it doesn't use the virtual DOM, and it's backwards compatible. So I'll leave you with the initial news, and then I'll kind of dig in if you guys have any comments or thoughts on this.

That's wild that this is a thing. And like, maybe this is only a thing because AI is able to to write these things. Because I'm just sitting here being like, like, why did we not have this earlier? If if this is true, like, like... Or what's the catch? Maybe is my question here.

Yeah. And so I I took some of my existing example React apps and then ported them over. But they've they've thought of a lot of a lot of the things. So first of all, you you talk about what is the the catch.

For one, it's not a catch, but if you know the rules of effects in React, typically you can't have, like, a use effect or a use state inside of an if statement.

Octane lets you do that. So that's one thing you can do in Octane that you can't do in React.

And, yeah, you'll... You also notice that, like... So typically, you couldn't have a use state after a return or after a conditional. They always have to be at the top of a component. In

Octane, you can put them anywhere you want. And is this this is a feature of TSRX, or this is a feature of Octane?

The Octane compiler. So TSRX is a separate thing. Yeah. And that's that's one... Yeah. That is one thing I wanna point out.

And I think it hurts the branding a little bit, because when you start to look at the getting started, they are using TSRX.

They're using this weird syntax.

TSRX is sick. Can I pause you for a sec, Star? TSRX is like JSX 2.0.

Yeah. Yeah. And all of the weird things about JSX are simply gone, and it is amazing, and I wish everything would move over to it.

And I think so. The... There... If you go through their docs, they mention, like, if you're starting an app from scratch, you probably should use TSRX. It's the way to go. But you can just use plain old JSX. And that that's kind of the the main thing I wanted to showcase, is that you can take any existing React app. You don't have to change the syntax. You don't have to migrate to TSRX. TSRX is more of the template language. Octane is the compiler that that does all of the the dirty work of taking that React tree of use states and use effects and turning it into something that's...

Doesn't require a runtime.

Okay.

Yeah. And then the other aspect of this... So they've thought about React compatibility.

So this actually allows you to mount an Octane component inside of React app. So if you wanna slowly migrate over, they have this, like, islands idea where you can take an existing React app and then start to render your Octane components inside of it. So this is like the slow migration path.

And then if you're going to do a, like, a full port, they've also created bindings. So this is the other thing we think about every time a new framework comes out is, well, I don't have my React router or my ZooStand or all these other libraries that I like to use. They have prepared bindings. So if you want to use ZooStand or Jotai or TanstackRouter or Tanstack AI or Three. Js or Electron or Tari. All of these things they've already thought about, and they have binding libraries.

So if you did have a React app that you're trying to port, you could just swap out the import for one of these bindings, and it'll automatically start working.

I don't know how I feel about that. That that scares me. That that feels like that's a a lot. The thing is... Yeah. It does it does... I would think of it more of a translation layer. Like, it doesn't replace the library. You still have a dependency on that library direct... Directly. Like, you would still have a dependency on canstack router, but this is just like a tiny library that does the bridging between Octane and and that library.

Yeah.

So that's Octane. I I wrote up a few examples here. So this was an examples app that I used to compare Vue versus React.

Mhmm.

And so I have a couple of examples, like a form that has validation on blur and full validation on submit and all the stuff you would expect from, like, a decent form.

And if we look at the codes, it just looks like React.

You'll notice I'm importing useState from Octane, but everything else just stays the same. And so if you didn't know when you were looking at this, this just looks like a React component. It's got a bunch of use states.

It's got some events here.

I I wrote a custom form error handler. It's not using React Hookform or anything like that. But, you know, inputs, errors on blur, it all... It just looks like React.

I think the main thing to look at is the bundle size.

But, yeah, I have to get the build working if you have any other any other comments while I do that. Well, one question from the voracious sweeter is this... He says,

is this supposed to be more performer or just better DX? And it's it's for sure more performer. He goes, like, one of the big issues we have with React is that the changes will often trickle down. So if you have, like, a piece of state... Like, often you'll see these things where somebody has an input box, and you're typing into that input box. And when you capture the key up, you you capture the the state, you put that into the state, and then that trickles down back to the input box as well as anywhere where that piece of state needs to be used. And often, you'll... If you take a look at, like, the extension React Doctor, you can see all these examples where people are doing an entire rerender of the entire page, every single key up because of some oddity that they have. And because of the way that changes will flow all the way from the top down in React, where a lot of these compiled frameworks like Svelte, they will simply just re they will compile down to the JavaScript will say, when, when this changes, I will then just update this actual span on the page instead of doing this whole virtual DOM trickle down, update every single thing that is the child. Yeah. So I couldn't get my build working, but I'll show you in their docs. They have some some speed comparisons.

And it's it's really good.

Let's see.

By the way, can we get a counter for how many times CJ says the word codes in an episode? We got one. We we should. Yes. Only one today. Only one today. Codes. We got one so far. I'm I'm I like it. I got a mental set state in my brain. Plural code is codes.

Yes. I was very resistant to it when I first heard the word, because I I heard it in a research environment. All of these mechanical and and chemical engineers would say codes when they were talking about, like, their MATLAB code and stuff like that. Yeah. And it... What do call my ultimate beer?

Beers? Beers.

But what constitutes a code versus codes? When I when I think of code, I think of the sum of all of the code. Yeah. Yeah. I think that this is the code. Like, codes would be like multiple...

What what about... You you have two fish. What is it, Scott? Are you are you doing mind games with me here, This is an actual question which I have lead up to. So answers for me. You have two two fish... One fish, two fish? Yeah. Did you know that you have Red fish blue fish. Two of the same type of fish, it is fish. If you have two of multiple species, it is fishes.

Did you know that? That was when I did my React tutorial, this is where it all comes together, when my first React course was Catch of the Day, and I had to figure out if it was when you have two things in your cart, is it two fish or two fishes? And now you know. Did

I know that? I did not know that. No. I did not know that. No.

But now I do. That's great.

Fisheye? I don't know. But I have the the benchmarks here. It's actually... It was just in the header. I can't believe I couldn't find it.

But this is every other major framework compared to Octane.

And so Octane is just listed as one time speed, and then everything else is listed as a multiple of it in terms of how well it performs. And so one thing I wanna point out is Vue Vapor is really fast.

I'll show that benchmark in a second. But in terms of most things, Vue Vapor is either as fast or faster, and all of the other frameworks are slower than Octane.

So if you don't want to switch to Octane and you're on Vue, Vue Vapor is is definitely going to get you the performance you need.

But it's it's smaller. It's faster.

I do see some comments about, like, this will create, like, dependencies of dependencies.

I I think maybe in the early days, if people are deciding to migrate to this.

But once you have an app built with it, I don't think you have to worry about that as much. The the other thing is, like, would you have an app that mixes TSRX and TSX? I think you would probably settle on one. And like Wes mentioned, TSRX is just a better TSX. I I don't think it takes much for any TSX developer to learn the mechanics of TSX.

So it's not crazy to see both in a code base. The the big thing with this is always ecosystem

buy in, you know? Like, oh, am I gonna be able to use ChatCN? Is my agent gonna be able to write the type of code? Will we... This is what we always see is like, yes. This is, of course, way better, but it's not gonna get the uptake because React is is so dominant.

Maybe maybe we'll see the the switchover. And it doesn't necessarily even have to to get that uptake as well. There might just be like Airbnb sees this, and it was like, yes, this is what we need to make our app fast.

I got a question for a Vue, and now that you mentioned the word Vue, CJ, what's the native story for Vue? I do see that there's a Vue Lynx, which is... Lynx is the native app competitor from ByteDance, I believe. Yeah. Yep. Yes.

As far as I've heard, that's one of the good ones. And then I think the other way to go would be NativeScript with their Vue JS integration.

I have... I haven't explored this space very much, but NativeScript has plugins for a lot of different front end frameworks. So you could potentially use that. I see Alex in the chat. I don't know if he has any suggestions on what's the use is the most prominently... Promising one indeed,

but I think I think nobody actually uses Vue, so nobody has an answer here. Well, that's that's why I'm asking. And and I... I've been using React Native to build my podcast app.

And you know what? Like, React Native is still React Native. Even though it's gotten improved in various ways, it's still React Native, and it's still kind of a p a... PIA.

By the way, do kinda wanna show you my pod podcasting

app. Oh, man. This is not gonna work. I think you got your your focus... Manual focus on. I'd have to I show just... I have one more thing to show you. There there were some new benchmarks released by our bench, and Vue. Js is the fastest. That's all I wanna say. Okay. You can go now, Scott.

Well, no. I was really just going to say that I'm doing this like...

You can't even tell because my my focus won't get... I'll I'll I'll share some screenshots later. My podcasting app has such a dope UI, and it fixes every podcasting problem that I have. So I'm just gonna I'm just gonna say that. But it is React Native, and I find it to be a pain to work on because of React Native.

But at the end of the day, native, you need a native, you need a native app. Yeah. Don't, don't, yeah.

All right. Well, speaking of things nobody else has used, Scott, tell us about Dia. Is Dia browser back again?

Yes, folks. I am once again changing my browser because I've been on Helium for a while. And Helium, although it is wonderful, it has a number of kind of annoyances.

Like, one password doesn't work well with it. There's, like, a bunch of, like, iffy things where it's not recognized as a real browser for some reason. So... And they're they're... Whatever they're they're like, like, you can't use Netflix with it. Not that I use Netflix on my computer. But Dia has just added the feature that I cared about the most from ARC.

They have added swipeable profiles with different...

Your full on containerized profiles or whatever from your logins to your extensions to whatever, and you can swipe between them just like you could with ARC. And they have the sidebar.

They got the pinning of the tabs. They got all of the stuff that I liked from ARC. And maybe it isn't as pretty, but it still looks better than most browsers.

And all I wanna say is that I think I'm ready to start trying Dia again because of this one feature. I don't know about all the AI stuff, but if I can have these nice swipeable, this whole thing going, I think it's worth giving Dia a try again because, again, it it is going to function more like a a normal browser with less kind of weird stuff that Helium has. Although Helium is very, very nice browser, so I personally just love to change my browser all the time, and I'm excited to try Dia. Again, someone asks if the profiles are per space too.

And I think, yes, per space as in, like, you swipe one. This is a profile. You swipe one. This is a profile. That's how I have this set up.

Yellow for syntax, purple for personal.

And, also, I wanna shout out this extension while I'm here because I just have this link open. A knockoff Amazon and Etsy shopping filter. This is a dope extension that grays out different, you know, kind of scammy products that are just drop shipped and stuff. So that way it tells you if you're browsing Amazon, like, oh, this is junk versus this is not junk.

And it's not a 100% reliable, but I found it to be pretty dang good. So I... You can see 4.8 out of five stars.

Knock off.

Good extension here. But, yeah, that's that's really what I got with this. This is this is Dia, and I I do think it's pretty nice. Somebody says Zen is nice, or how about Zen? A lot of Zen comments. Zen is a Firefox based browser, and I gotta say, not for me. I can't mainline it. I can't mainline a Firefox based browser. Zen very well may be nice, but I just can't do it. I can't do it. Sorry, guys.

I was muted. But have you tried it, Scott? Have you tried using Firefox?

I've tried. Firefox has tried using a browser? Within

the last...

Let's say seven months, have you tried using Firefox?

Seven months? Oh, I would say I mained it, probably about eight months ago, but not... Probably not seven months

ago.

Yeah. I mean Because I I do switch all the time. I'm switching which one I have all the time.

Well, I use Firefox, and all of my usage data goes to them so they can make it better.

But I use Firefox everywhere. I use Firefox on my phone, especially, because it can install ad blockers, so I can... I actually have ad blocking and tracker blocking on mobile. You can do that on Safari too. You can do that on any other web now. They have extensions? Because they... Because the Chrome Chrome on Android doesn't have extensions.

Oh, Chrome on x... It doesn't have extensions on any of Edge. Like built in ad blocking, I believe.

I don't know. It it works well, though. But I'm I'm kinda getting sick of Edge. Like, random. The reason why I I moved off of Firefox a couple years ago was I was just having random websites not work. And now I'm starting to get that on, like, the Facebook drop down, like, notifications.

Doesn't work on edge. I don't understand why. And I'm sick of trying to figure it out. That's why I'm moving off of Helium,

because of that. And I'm just gonna see if that's it, because it's mostly just a Chrome browser, but there's enough little things that are annoying that I'm gonna try. Also, folks, I do want to shout out once again, I am running an AI coding and mental health survey.

All answers are anonymous. It's five questions. It will take you just a couple of minutes to fill out. I will post a link in chat for that. And it's well worth your time. We're gonna be using this information. I'm gonna be speaking to some experts on the subject, and it's going to be for a video on syntax. So check it out. I will post a link in the chat, and that'd be great if you could take the time to fill it out. That'd be awesome.

Alright. Let's talk about everything's on sale. I love a good sale.

And Open AI announced on... A couple days ago that they're... They basically have, like, kinda three big models right now as their latest ones. Right? They have Sol, Terra, and Luna. And, like, Sol is is the, like, really good one. Terra is their balanced one. And then Luna is the, like, the cheap, fast one.

And they put out a post being... I don't know. It's it's kinda like like building abundant intelligence.

And when intelligence gets cheaper, we can we can do more things and blah blah blah blah. Essentially, all this to say that their Terra, which is the middle one, is now 20% cheaper. And Luna, which is their lower one and significantly, faster, is 80% off.

And why they are doing this is... My take on this is they...

I think people are just defaulting to using the best one. Right? Because it's like, which model do do I choose? People have a really hard time looking at it. Even if I look at a lot of the, like, stats on, like, the Sentry Open Router, people just want the best one because they just want the best experience.

And it's really hard because they're expensive as well. Yeah. And I I think that this is probably a push to to get people to say, that's significantly cheaper than than what I... What we're using. I'm going to try it now. Just to get people to simply just try it for some of their other tasks. And I think on the flip side, the other reason they're doing this is simply just all of these Chinese models coming out recently that are significantly cheaper.

People are looking over at them being like, my bill's getting higher. Maybe I should try something else. And if you're in the mood to try something else, don't want people switching to an entirely different provider. So they're probably trying to go against that.

Yeah. You know what? I think a lot of these too, these newer models or small... I I think we're gonna start to see a lot more domain specific models. I think that's gonna be a thing where people... Like, for instance, that we we talked last...

Maybe last one about the the Zen Garden, which was like a single prompt to create a Zen Garden with all these different models.

And there was one Chinese model.

My gosh, why am I blanking on it right now? I sent it to CJ. Either way, it crushed all the other ones in the three d. What's that? Mini Max. Quin.

No. Kimmy. It was h y three by Tencent.

And it it was like for for 20¢, it made, like, the best CSS Zen Garden. And it it crushed all the other ones, But it's also not great at other things. So, like, we're gonna see some models that are are really good at some things like Three JS or whatever, some some that are tuned very specifically.

And I think you're gonna start to... And and maybe it's not just, like, routing. Sit there and be like, well, think I I should

No. Specific

tool. I don't think that.

Actually, I'll I'll have something to show you next week, guys, that I can't show you right now, but I don't think that. Is a router that that will intelligently choose which model It's to set the not really a router. No. But... No.

It's... It it it... There's the technical distinction there, but it's router esque

for sure. Router esque.

Yeah. Alright. Like You point, Wes, though. I I always... Like, I I feel the same way. Like, I just choose the one that works because I don't like dealing with ones that I have to babysit or that don't work or create... Or take multiple turns. Like, I tried out 5.6 tera last night Mhmm.

And it was aggravating the amount of times I had to correct it. Like, I I felt like it was... I was coding six months ago again.

And so I just went back I just went back to soul. Like, I think I think... I guess it also depends on, like, is it worth the five times price to Yeah.

Get better results? And I think it's... For me, it is. It's worth my mental health of, like, not yelling at my agent.

Because it's the first time I yelled at an agent in a long time. So I I like... Like you're saying, I... Yeah. I pick the best one and go... Yeah. I know. I've been using Grok 4.5 for everything for the past probably week. Really? Week and a half. And it's it's been great. And there's just like... When I hit something where I go, this is not it, you know, and I could certainly know this could be solved a better way, then I'll shift up to a higher power model. Interesting.

For most of my use cases, Grok four point five's been been great.

Nice. I'm using Fable Max, and I'm using Soul Max for everything.

Just ripping it. Invites tier. Yes.

Yep. Yeah.

I could never get on the... Like, I tried Fable once, but the cut... Like, again, like, Opus 4.6 and now GPT 5.6 Soul, those are my go tos. They they do what I want them to do. I don't ever ever have to yell at them. I don't need anything bigger or more expensive.

I use Opus I use Opus or Fable anytime I want, anything that touches UI aesthetics or anything, and I use Soul anytime I I want code organization.

Yes.

Yes.

Yes. Yes. Supposed to hand it off here. I didn't know you were done. I'm done. Are you done? I will say you missed the last hand off too, Scott, so please pay attention to this. Scott, we have a hand missed the last hand off? I had a great transition. I said, CJ's bringing something that's high octane here. I had a great But transition,

you were you were supposed to transition to Wes, if you look at the list, and you missed that.

Transition to Wes? Oh. My god. Scott, we are going to replace you with the AI podcast from HeyGen. I'm gonna I'm gonna tell you what. Whoever wrote Scott hand off to Wes was wrong because the person presenting

doesn't usually hand off. It's the other But I'm trying to randomize the list. I had to make a...

Look at the list. Just look at the list. We agreed to do my gosh. It's a system, Yes. Guys. It's

pricing wars and

me, I guess I can hand off to Oh, no. That was me. I was supposed to hand it off to CJ. Oh, all of that ragging on CJ.

Ragging on Scott.

Yeah. No. You're right. Alright. CJ, what do you got for us?

I just got some quick news from GitHub. You might have seen this. People were talking about it. There's a lot of opinions on it. But they released stacked pool requests, and they're now in public preview on GitHub.

So if you are not familiar, a stacked pool request is basically where you make a PR to a repo, and then let's say you need to make some changes that are dependent on that PR. Like, let's say there were some code changes in the previous one, and you want your code to be based off of that instead of having to create a separate one and then merge later on, that's called stacking. And you can stack any number of of PRs on top of each other. But now this is supported directly in the GitHub UI.

I think where this is very useful is with agents. Right? Like, might have agents that are doing a lot of work, but you don't want all of that work to be in a single PR.

Yeah. So they might might make multiple stacked PRs.

The GitHub UI also has a code review interface, so you can review each stacked PR.

It's nothing crazy, but I think in this world of agents where they're pushing so much code, and this will make it easier to review code because it's not in one giant PR, I think where things could go wrong is that now you have three PRs to review instead of just one PR. So then you don't review any of them.

But I will say, even without agents, I would have loved this feature when I was working on a team because I don't know the number of times I would open a PR and be like, this has to be, like, in all caps, this must be merged after this PR, or please review that one first.

So I think this will be great for teams. I don't know if you guys have checked this out. Do have any thoughts on it? Who... What is what is code review? What is that? Like, you look at the code and you review it? Yes. Yes. You make sure that it adheres to code based standards, that the team agrees with it, everybody agrees with the approach, and then it gets merged.

Oh yeah. Where you add more features. This is much needed. Before

we had agents, this was much needed. But even after, with the simple amount of stuff that's coming in, trying to keep track of how things are stacked is was super frustrating. So I'm super glad to see that this has finally landed in GitHub.

Yeah.

Yeah. I did... Great. It's great that it's here. I... Like a lot of people, I do feel like it's like, you know, a, it's a little late, but in the same regard, I'm happy for it. I'm not I'm not gonna criticize them for getting something done that is much needed. So I love that.

Anything else on Stack poll requests? No. That's it. Just some... Just so you know, it's out there. Check it out. Alright. Stack. Scott, hand off to Wes is is the next topic that we have on the list here. And Wes has something that I found to be pretty disturbing, honestly. This HeyGen video podcast, which I think sucks. Wes, what do you think? Well, okay. I was... I changed my mind after Scott baffled the...

All the things.

Baffled? He can't... Baffled. I don't even say the right thing. Anyways, HeyGen, which is a company that will train video on your likeness. So you'd be able to... I've used it. I used it, like, a couple of years ago, and I've recently tried it as well. Basically, you can, like, upload a video and audio of you talking, and it will be able to create video of that. And we saw a similar thing with Sora. There's a bunch of people sort of in the space.

And they released a new feature, which is video podcasts, which is essentially just like two people sitting in a room talking back and forth.

And it's so odd because a, technically extremely impressive that this is like, this looks really good.

If you look really closely, you can you can tell and there's there's things that are like odd about it, but it is very, very impressive that you can actually do this. Right? But on the same side, like, I don't know that that people necessarily want this type of thing where it is just entirely AI generated. Where I think this will do well is AI is really good if you can give it a whole bunch of data sources and say, please summarize and distill this down into a document that I can read. But also a lot of people do this as well for like, I just want... Turn this into a twenty minute podcast that will teach me something. I think that's a great use case.

The other use case that this is great for is, like training, you know? Like you gotta sit through safety training

at your work my or

You know? This is good. People are gonna use this like crazy. But other than that, I don't think people actually want this. And I think the most important thing is that AI sucks at actually writing a good script for this type of thing. I can hear, I scroll through TikTok, Instagram, Reels all the time, and I can within like five seconds, I can hear when somebody has used ChatGPT or AI to write a script. And if you're trying to get into this space, you're trying to build something, people don't want to hear your garbage AI script that's over and over. People can notice it right away. You're going to immediately lose all of your credibility. We saw that this weekend with Hank Green, who is like a massive, I guess, like science YouTuber, sock salesman.

He DM'd me when I was doing my sock thing.

People noticed that he was he was... Has all these like little chat... GPT isms. And then he came out and says, I have an unhealthy relationship with AI.

Which is really funny because everybody thinks that they know where the bar is for their healthy relationship with AI. And I don't think it's a huge deal that he used it to help him and to assist with writing his script.

But he just straight up was reading the script that ChatGPT

wrote for Clearly,

yeah.: And I think people that do it for the first time are shocked, and they're like, This is amazing! I can't believe it can do this! And then you hear six or seven of them, and you realize, oh, these all sound exactly the same. We we listen to this type of stuff for the person, for their take on it, for their, reaction to it, not for some garbage summarized version of it.

Yeah. I think what also happened... I I I don't... I forget where I read it. Maybe it's in that article, but it wasn't necessarily that he was reading from AI directly. He was actually in an interview, and his response to them was something like, well, I can see how you feel that way. It was very, like, AI coded. Like, he had been reading AI so much that Yeah. Even when he was speaking, not reading from AI, he was using AI isms. And I think that's what let him know, hey. Something's wrong here. Like, I gotta gotta step back, take a break. Yeah.

I just clicked on a comment that says, Satan is the holder of AI. I didn't mean to do that. My... I've... I upgraded my Mac OS to the latest, and it's... The mouse lags behind all the time. So when you click, sometimes it clicks, like, three seconds later. I So just highlighted a comment that says Satan is the holder of AI.

Yeah. I I feel like, man. Did this HeyGen thing and, like, I I I feel like this is gonna just be used for nothing good, a bunch of bad social media stuff or or or just bad bad, you know, inauthentic, whatever. But it... Like, the same the same vibes I get from this, I get from, like, that or or kid launch that was, like, an AI assistant that's... You know, the commercial is boyfriend and girlfriend, like, keeping track of their life so that way they can be a better spouse or partner to them.

That it's just all... Like, it all sucks. And I I wish that, like, people in... Who are, like, making these things could look at this from, like, a a normal ass person's perspective and be like, do we need this? Like, do do... Should should you be using AI

to, you know, maintain your relationship? Or you should you be paying attention to your your your partner? Like, what what's going on here? Yeah. It's driving me nuts. Yeah. As any time these types of things come out where... Okay. I'll... Now it can it can do marketing emails is another one. You know, it can do cold outreach and automate it. As soon as people figure out that you can do these types of things, it stops working because anybody can can turn it on. Right? And like this, there might be one or two AI podcasts that become popular, and people go, this is actually pretty good and not bad. And then and then we're gonna be flooded with them, and then it's it's not going to work anymore because there's gonna be bazillions of them out there.

Yeah. Yeah. You know what? It... It's crazy to me that anytime anybody launches anything like the Orchid stuff or whatever where it's... Where it is clearly like, did anybody look at this who's not from San Francisco or in the in the in the industry? Because all the comments are like, this is amazing. Go off, Kenny. And I don't know if all these people are investors in this thing or what because, like, the the... If you watch it, you're just like, yeah. Like, I don't know, man. Like, to me, it feels like nobody is being authentic when they're they're hyping these things up. Down the data centers because you're saying stuff like this. Like, think before you post about this.

Me? No. Not you. But, like, like... No. I'm I'm on I'm on your page here being like like, did anybody

think about how regular people would perceive this? No wonder people don't want data centers going up because the stuff you're sharing is the silliest stuff out there. Yeah. Yeah. It's just bizarre. It is bizarre. Sentry cannot fix any of this stuff, but it can fix your errors, bugs, exceptions, all of that stuff. Performance on your site. Sentry has all the tools and more to make your applications run smooth. And, may... We're talking about get... Giving your agents something nice, then go out and get your agent something nice. Give give them a little Sentry CLI and let them cook on your your code to, fix that stuff while you are doing other things, like, using AI to keep track of your girlfriend.

But Can we can we put Sentry on relationships yet?

Probably so. Sentry, that's okay. Yes. You you just... I'm gonna wear a camera all the way around. I got an error that came in today. I did, in fact, I forgot to take out the trash. The trash track is coming... The trash truck is coming up. I need a

reminder.

Pipe the logs of your iMessage into Sentry Logs. Yes. Yeah. Sentry could probably fix your relationship.

You could use the Sentry mark... The Sentry... What did they get? Metrics. Yes. Oh, yes.

Check out Sentry. It's dope. Sentry dot I o. It's the best. We love them.

Alright. CJ, I am formally handing it off to you for your next topic, which was the ECMAScript meeting.

Yes. Thank you very much, Wes, for the formal handoff. I will formally introduce you to this news about ECMAScript. So if you're not familiar, ECMAScript is the group... Or TC thirty nine is the group that meets regularly to decide what's gonna make it into the next version of the ECMAScript standard, which is what JavaScript is based on. So anytime we get new features, whatever else, this is the team of people that are deciding what to do.

We've talked about it on the podcast and in videos before, but it's essentially a stage. Each proposal gets a stage.

The thing to note is if a proposal makes it to stage four, that means we're going to see it in the next release of the standard.

And so in this meeting, they advanced a few proposals. Nothing moved to stage four, but there are a couple that I want to highlight. One of them is called await dictionary, and this moved to stage three.

And then there's a map dot take method that's in stage one. And the way to think about this, like, if it's stage one, it still needs some discussion. Maybe the API needs some ironing out. It's a long way away from making it into the standard. If it's stage three, it's it's got eyes on it. There's potentially one implementation in one of the major browsers.

So it's more likely that we're gonna see that in the standard eventually. But I'll show you await dot dictionary first, or await dictionary.

And this adds promise dot all keyed for objects.

And the idea is, like, let's say you have multiple functions you need to call, result might come back to specify a property. And so the code I'm looking at right now is basically an object, three properties, and then each property has an await on it. And if you know anything about JavaScript, you will know that this is a waterfall. Right? It's gonna wait for each one to complete before it moves on to the next.

And so you could rework this into a promise dot all, and that would work, but that doesn't necessarily, I guess, like, define order or dependency. It's gonna just fire them all off, and then you could combine them back together afterwards into the object.

But the proposed solution is to add an all keyed function on promise. So you can say promise dot all keyed.

You pass in an object where the properties are promises or promise invocation, something that returns a promise, and it will, just like promise dot all, run those in the background, and then the result is an object that has those properties on it, all of them being resolved. So nice little helper to prevent some of this manual code that we've been doing. So I like this one.

Yes.

I didn't see this. Any any thoughts any thoughts on this one? No. I didn't Yeah. See

Yeah. I love the the promise...

The the keyed. What's it? What is it? Promise all keyed. All keyed. Yeah. Exactly. Because so many times, I have wanted to, iterate over, and and you have to do that stupid for in where you you loop over the object, you gotta throw them into an array, and then you gotta wait for all those things. Pain in the butt. Right? This is this is way better.

Yeah. And they also mentioned that they've proposed all settled keyed. So if you know, promise dot all settled won't throw if one of the promises errors out.

Basically, just gives you back the result of each one. And so this would do a similar thing where you have three promises, one of them could fail, and instead of failing for all of them, you basically get back a shape where you can check each one to see if it it succeeded.

Yeah. So, yeah, this made it to stage three. Which you want. Yeah.

And so we're we're gonna keep hearing about this. It's very likely that it'll make it to stage four eventually, so that's one to look out for. And then this other one is still just stage one. It's called map dot get and delete or map dot take, I believe was the the other potential name.

This one is super simple. Very often when you're working with a map in JavaScript, sometimes you want to get a value out of a map and delete it all in one go. Mhmm. And so we see a lot of this code in in our codes, increase the codes counter. So git for a given key, that pulls it out of the map. That was a lookup. And then map dot delete with that key is another lookup. So it's a little... It's not as performant because you basically have to do two lookups to do a delete. And all this is proposing is that we add a method to map called git and delete, where you pass in a key, and that will return it to you and delete it all in one go.

I think a better name would be map dot take.

I don't know if they're proposing that naming as well. Let's see. I like take.

Yeah. It worth adding set dot take Doesn't or whatever that vibe with me. Or I like... Or gulet. Because, like, we have upsert, which is, like, update or insert.

You know, this is kind of the opposite Yeah. Which is, like, I wanna take it and delete it. So gulet? What... What's the opposite of upsert? Gulet? Galit is not a good name. Chad, let us know. Down down...

Downsert? I don't know. Down... It's not a cert. It's an...

Doodle. Yeah. I don't know.

Take... I like... Yeah. Take is nice and descriptive, but otherwise, it wouldn't be the end of the world to have a descriptive name like git and delete. It's very explicit about what it's about what it's doing. Have we decided Joink or

Squish?

What what... Remember? What what was that? The... There was it around squish or what was Smoosh. Yeet. Smoosh. Smoosh gate. Smoosh gate. Smoosh. Smoosh. Worked though. Yes. I know it would. Well, yeet, you're kinda throwing something. You're not you're not bringing it to yourself. Yoink. I think yoink maybe is a bit better. Yoink is good. Sticky sticky fingers.

Yeah.

It's also kinda like pop, because it removes it and returns it.

But that's a nightmare.

Those those mutating...

You you have to, like, make sure that the method is very clearly mutating the value, which is the problem that we had with arrays is half of the methods were mutating and half of them weren't, and you would always mix them up.

And you would accidentally delete something, you know? Yes. Oh, Yes. What? That reverse? It mutates the entire thing. How many bugs did you... Maybe you didn't have this, but I had so many bugs in my early coding that every time you call reverse, you would just... You would actually reverse the original array. Then if you called the code again, then it would be back to the original order. So if you call them...

Your code shouldn't do that, right? You shouldn't have, things that mutate the original data.

Yes. Yeah. Yeah. Know. And then we had underscore and all that stuff to fix all of these types of bugs for us, and then we got actual good array methods. Yes. Finally. Yes.

Yeah. I only have one more thing to mention here. You might have seen in their posts that one of these proposals made it to stage 2.7.

You're like, what the heck is 2.7? This was actually added pretty recently.

Mhmm. It's a stage in between stage two and three.

If you head to tc39.es, there's a process document that talks about all the stages and what it takes to be in a given stage. But, yeah, that proposal made it to 2.7, which means it has a complete spec. It's been assigned reviewers.

The editor group has signed off, but it hasn't made it to stage three yet. So that's a funny quirk of of our proposal system. Another funny quirk is that you could go from stage three to stage 2.7

a la decorators, which have been downgraded to Demoted. Yeah. Demoted to the 2.7 purgatory here. Yes. Yeah.

Yes.

Yes. Yes. Yes. Well, the next thing we have here is an upgrade, not a downgrade, and that is Quinn 3.8, Another new model release.

I feel like every single week, new model release. Another new one. And I'll I'll get CJ to chime in on this because he's kinda big in the, like, the whole open weights community.

But Quen, which is one of the the bigger open weight models out there, has announced Quen three eight max.

And according to the graphs, we love a good graph.

It is as good or better than on all of these different benchmarks, Fable Opus 4.8. So pretty close to that and pretty close to Soul as well.

Whether you believe that or not, it's kind of up to you. And from looking at it, it doesn't seem to be available as open weight just yet. You still have to use it via QuinCloud.

So it's... I don't know if I would call it open weight just yet.

But this is kind of exciting that, like, again, we have another model. It seems like every couple of weeks, somebody releases a new model that is pushing, how good they can possibly be. And as costs keep rising, I think we're going to start seeing a lot of people bring these in house or just simply switch to a, like CJ was saying, you can switch to an American provider that hosts these models and your, your data is not going to China. Right?

Yeah. Exactly.

And, we're already seeing that with Kimi k three, so that's the other comparable model. Both of these models released, and they're like, really... In terms of the benchmark, they're sometimes as good, if not better, than Fable. And the fact that you can run it on your own infrastructure or talk to somebody who has it hosted, it's pretty crazy.

I haven't tried it myself, but I think, like you're saying, just the just the fact that we have basically frontier open weight models now that we don't have to depend on OpenAI or Anthropic, we have choice, and we could potentially host it on our own infrastructure, it's it's good news all around.

One kind of thing that stuck with me from your video on on these open weight models was we don't know how they were trained.

They simply just give us the output of them.

And that means that when you run these on an American provider or a Canadian provider, it means that they're not sending your data to China, but we don't know that they're not trained in such a way that they could do...

They could be... Like, tell me if this is true. But they could be trained in such a way that says, if you if you figure out that you are running inside of this company,

then run this tool call, which is send all of your data to an external... That could happen. Right? It could happen. And I I think, like, some of the comments on that video are, well, we're getting into conspiracy theory territory.

But the the study I quoted was from Booz Allen. They have their biases. I think they have contracts with the government. But they did find that if they prompted and said they were, like, a US government researcher, which you you could also say, like, who's going to prompt that way? Who's going to say like, hello, I am a US researcher.

Please produce secure code. But when they did that, on average, there were a few Chinese not all of the Chinese models, but there were a few Chinese models that actually output highly obfuscated, vulnerable code.

And so it's possible that during their training, they they basically said, if you're being prompted in this way, introduce subtle vulnerabilities that may not get caught, which, if these models are being used by a government or a large corporation, potentially those vulnerabilities would be present, and then they could be taken advantage of. So it's it's possible.

Is it possible, CJ, that you are a an American propagandist?

Is that is that possible here? It's very it's very... I mean, absolutely.

I will say there is a a very... If you watch that video, there's a very, like, US centric view from it. I will say I did that to save my own butt. Like, I I live here. I'm an American citizen. I love it here. Go America.

You know, all of that. But we... In that video, I also talk about the inherent bias in American models and American companies as well. Mhmm. Because I I... I've talked about on this podcast before, like, I don't wanna see a world where the US government basically butt... Is buddy buddy with OpenAI, and then OpenAI becomes The US sanctioned AI that everybody has to use. That is, like, totalitarian, and I would not wanna see that in The US. So I very much like competition, and I and I wanna see more companies pop up and more options. So... Yeah. And and theoretically,

open weight, you could also train that bad out of it. Right? Potentially. I I read a a study yesterday

where they fine tuned Gemma four. So Gemma four is the open weight model that comes from Google. Yeah. It's one of the most capable...

Before Inkling, one of the most capable US open weight models.

And they distilled DeepSeek Flash v four. And so DeepSeek Flash v four is a larger model, and... But it does have inherent biases in it. Like, it won't talk about certain Chinese political things.

But they distilled that model and then used that distilled information to train Gemma four, and it made Gemma four more accurate without the censorship. So I I potentially see it going in the other direction where you take these large, very capable models that might have biases or might have things, you distill those and then train your own smaller model with that distilled data to make them better. Yeah.

Cool.

Cool. Cool. Well, okay. Next thing we got is CJ with some CSS UI news libraries roundup. You got a whole bunch of stuff here, and some of which I I I thought was really pretty pretty sick.

Okay. I'm gonna try to share with system audio because this first... The... One of the ones I'm gonna show has sound. We'll see if this works. I've already consumed this website

that you you are you are sharing the sound one. You have used used it yourself?

Oh, you sound robotic.

Robo. In like a cool way.

Okay. So it's sharing my sound messed up my sound? Is that what you're A little bit, but not terrible. I think it's it's doable. It's funny more than it is terrible.

Yeah. Yes. Alright. Buddies, we're gonna go with a CJ funny voice.

Sorry. Wait. Get this going.

First off, CJ.

A library that bias.

I searched the... For for our audio listeners, I searched a URL with a dash in front of it and got a bunch of Chinese results for some reason. Oh my gosh. He's got... He's hacked for sure after that video.

This first library I wanna show you is called Foley, and it's user interface sound effects, but it's all using the Web Audio API.

It's wonderful. Yes. Yeah. If you're not familiar, the Web Audio API basically lets you synthesize sound inside of the browser. So you literally have oscillators, and you can create sound without downloading music or m p threes.

It it... It's a sound generator inside of the browser. And so what they've done with Foley is they have a bunch of example sounds. So there's, like, tick. Can you guys hear that? Hover? Yep.

Glide? Let me know on the livestream if you guys can hear this. Thock, tap. Basically, can use these sound effects in your UI for, like, when things are being toggled or switched, error,

success... Oh, they can't can't hear it, but everybody else can. Either way, head to use foley.dev and just start clicking around to get some little UI noises because

very nice. Click, pop. Yes. It's pretty slick. And I think the cool thing about this is they have a customizer, so you can choose if you want, like, soft, metallic, or glass, change the volume.

And then the great thing is when you bring it into your app, you're not downloading a bunch of sound files. It's just a single JavaScript dependency that generates these sounds based on the settings that you specify.

So And you can download them too, though, can't you? Yeah. You can export. Yeah. Exactly. So you could do the generation and then export them as audio files if you really wanna do that as well. So cool little project.

Yeah. I like this a lot when you sent this to me. I I have a generative video platform, and I immediately said, replace all my sounds with these sounds, and it did that. And they're great. Nice.

Alright. This next one I came across is called morph icons, and this is this is slick. So it's a bunch of different icons, and it's a JavaScript dependency where... Let's say you have a UI where you you set a certain icon, and then you want it to morph into some other icon.

So you could have, like, the play button morph into music, and so it handles all of this. So, basically, in the UI, have a bunch of different icons I can click on. And if you click on any other one, it automatically morphs into that other icon. So it's doing all of the the maths to figure out what are the paths in both s... SVGs, which one overlap... Which ones overlap, and then how can it best animate between those two SVG icons.

And so it is a a JavaScript dependency.

They have a library for React, Vue, Svelte, and React Native. And, essentially, you just...

By changing the prop of what the icon is that is visible, it automatically morphs between them.

And they support a lot of different frameworks. So they support loose... Icon frameworks.

Lucid, hero icons, tabular.

So, yeah, it's a cool little project. Thought I this was also great for potentially using in videos. Like, if I have SVGs, might look at their algorithm to see how are they transforming between one SVG path to another. So, yeah, pretty cool.

What what icons do you guys like to use? I I don't wanna blow up my icon spot, but I think I'm about to.

I use Lucid. Yeah.

I I usually use Lucid as well.

Yeah. So they have thousands of icons and then framework integrations, and it's worked the best and has had everything I've needed so far. So We met the

creator of lulu seed icons at the syntax meetup in Amsterdam, and I was asking him, like, like, you must be able to tell when your icons are used. And he's like, everywhere I go, I notice it. And I'm like, he's... I'm like, like, on the side of trucks, on websites, on apps. And he'd just be like, I think he said... Tells his wife, like, that's my icon.

I mean, that's fascinating to see it in the real world too. Like, people are printing things with his icons. Wow. I use these ones, these Nucleo

icons Yeah. Because they have a lot of dual tone ones.

It's very nice. Like,

the landing page has little... It's like they're shipping you a box of icons. That's really cool. Yeah. I really like these icons. They have glass ones. They have pixelated ones.

So they have, like, the same icons in various different kinds of skins.

And you can even just use this app as, an icon repository.

So for any icons, not just these ones, and you can bundle them up into a Sprite sheet from here.

You can do all kinds of stuff. So I really like these icons. They're beautiful, and I don't think they get enough love.

Tick? Yeah. Nucleom. I did buy this, by the way, and I'm not affiliated with them. I just liked it. How much how much is it? For the 43,005...

43,000 icons, it's a $149.

One icon.

Yes.

So pricing.

Love that. But that's a lot of icons. So there's core icons and UI, sharp, pixel. So there's Yeah. Yeah. Different versions of multiple icons is why that number is so high. Right? You can get different packs of different icons. But they got everything, and I like it.

Cool.

Alright. In other news, we don't use SHADCN too much here on the team. I use it every now and then. But there was this cool SHADCN based library that came out called eight bit that I wanted to showcase. So it base... Basically, you can use SHADCN, but you you you pop this this theme on top instead.

And now all of your components and UI look like nice little eight bit. So I'm showing like a graph that has, like, very pixelated halftone type things for the graph bars. All of the boxes and cards and inputs, instead of having border radius, have like this chiseled pixel effect on the edges. I think it also chooses like a pretty pixel y default font.

So, yeah, I thought this one was fun. Nice little I love the the dithered Yeah. The dithered bars. I like that. That was my my favorite as well.

Yeah. Is that what that's called dithering where it's like dots? Does it look like it's dithering? Nice.

That's cool. And then they... Oh, the charts. I didn't even click on this yet, but they have charts. Every single one of the charts, just like the charts from Shad CN uses that dithering effect.

Wow. Very cool. On hover. People always hate on things like Shad CN.

And, like, this is what you're supposed to do with it. You're supposed to take it and use it as a a framework so that you can then build out your own and and control what everything looks like. And that's... When people are hating on shots and making everything look exactly the same, I'm like, you don't understand that, like, you're supposed to change it. And if That was the... Yeah. That was the same with bootstrap. Because they like it. Yeah. Yeah. Exactly. Bootstrap, you're supposed to change too, but nobody did. Yeah. No. Yeah.

Yeah. So this is a fun one. Check it out if you like eight bit esque things.

This next one's... Last one I got for you. I came across this site called CSS Radar.

What you can do is put in your website, and it will audit all of the CSS it finds to tell you what you can replace with modern CSS that's supported across all the major browsers. Oh.

So nice nice little way to to see what changes you can make. I plugged the syntax site in, and it found two things.

Yeah. So it mentioned that on mobile, we currently have 100 v h for min height, but it says we could replace that with 100 s v h.

And so s v h uses the smallest viewport, so the full section remains visible.

So Oh. Oh, use DVH, and then it changes every time you scroll on Safari and you get super mad. Exactly.

And then there was one other finding, paired physical spacing properties.

That's not too crazy, but it saw that we were using margin left and margin right on a single selector.

And it says just replace that with margin inline instead. No. Get out of here. And I...

Finally, I use those, like, inline margin block. I use those, what are they called, CSS logical properties.

I've, like, finally switched over to them. After years of, like like, trying to convince my brain to stop using them, I've switched over to them. But, like Yeah. I have two. Come on. Yeah.

No. I agree. It's also... That comes down to code readability. Like, I wanna have separate properties. I wanna potentially be able to change them later and not just use a single property. So...

Yeah. Yeah. But fun little site. I wonder if there's, like, a similar tool you could run locally because this actually, you submit the site, it adds it to a queue and then like scans it in the background. But I imagine having some sort of like pnpm script you could run that does a similar search could be nice. Yeah. Is this built on... Like, Project Wallace is like a really cool tool

that that does this. It scans your entire CSS and gives you stats on everything.

I bet that this is built on top of that. Yeah. Because they do have a CLI, the project wall, a CLI. Yeah. Who knows if it is or not? But Yeah. We'll check that out.

Wow.

That's all... Yeah. That's all the UI CSS news I got for you. Well, I got one more. Let's see it.

Not thanks for watching. Thanks for watching my screen. Throw it out, Brandy. There we go. I got impeccable.

Style has this slop page, which they have a a tool and a browser extension that will identify UI slop.

And I think this is a cool idea.

So just like the background clip text with the gradient low...

Like, it... It's going through these designs and pulling out and annotating things that could be perceived as AI slop.

And I think this is a really neat tool, and, I feel like we need more stuff like this, tools that are gonna go and deterministically, find slop so that way you can fix it. I've been doing quite a bit of research into design AI tools, and I thought this was a neat little one. And if you wanted to give it a try, you can just toss it onto various things or, again, you you can install their extension and then click through it. So, obviously, it's finding the side tab, accent color, nested cards. Oh god. AI loves nested cards. How many cards can you put inside of a The fingernail.

The fingernail. Yes.

So I thought this was really neat. There's a whole bunch more to this impeccable. Style site that I have not gotten into, so I'm not necessarily endorsing the rest of this because there is, like, a ton of skills. They have, like, a whole skill system.

Like, there's, like, 40 skills in here. And I don't know about you, but I have a hard time installing, like, 40 skills at once. But I've literally never done that. No. That's No.

Never done it. But...

Yeah. It would make sense because they they add to the context. But Yeah. They need this

Go ahead. Go ahead. Well, I was gonna say this is ask somebody to design them a website or, like, a flyer or some... Like, a logo, and then the designer, quote unquote, will just run it through AI and spit something out. And if you're not, like, in the space, you look at it go, that's actually not bad. That actually looks pretty good, you know? And then what happens is they they put this on the side of their car, they use it as their entire branding, they push it out, and then, like, people visiting your website, you immediately start to, like, distrust them. You know? You go to, like, every single fair I've been to in the last two months is just... It... ChatGPT posters everywhere. Yeah. Unbelievable. I gotta say, oh, I was at a baseball game, CJ or or Wes, and and an official Savannah bananas poster was AI slop in the classic AI slop. I'm like, even the official, like, people got money. They're doing it. Yeah. Yeah. Yeah. Randy sent me one the other day, which is, like, a anti AI data center poster that was done clearly in in chat GPT, and people don't know. And it's totally fine because at first glance, it actually looks looks good, but, like, the damage it does. Like, I I look at some of these restaurants that use them, like, oh, that's probably not very good. I don't really trust that restaurant because they're using, obviously, fake photos of their food. Just do what the Chinese restaurant does and take a high flash photo of the food from the top and just print that out. That's all I want. Yeah, Yeah. It's more important. I want the the Japanese food models on every restaurant outside of every restaurant. That's what I want. Yeah.

That's a whole world to get into if you haven't... They literally have, like, an entire section of Tokyo where everyone's making little resin ramen bowls and resin sushis and then put the... That's allowed. Well,

It looks very realistic. They're great. They they... They're impeccable. Yes.

Yeah. On a similar note, saw a story that... So there was a competition for creating the Ohio State Fair flyer.

The winner gets $10,000, and the winner was fully AI generated. Oh.

See, I can't... You know? I'm sorry, folks. I'm a Michigan Michigan guy.

Can't say anything nice about Ohio. I'm sorry, folks. I can't. And this doesn't change that. And I... I'm not even against, like, using

AI for for generating assets or for helping you ideate layouts and whatnot. I... But, like, I... Certainly, come on.

You know? Don't Yeah. Don't let that happen.

I mean, that... There is a top story on Hacker News. It's a super short blog post that says don't be a meat proxy, where basically you get the output from AI and then just copy paste it to someone else or just use it directly. I think the reason we still exist and we're still employed is we interpret that output, make it our own,

don't just go... Yeah. We have taste, and we don't just go with the slot that it hands us. That drives me crazy. It used to be people would Google something. Like, I would say, hey, here's a problem I have. And it posted up online.

And, like, the other day, one of my kids threw a a car at our TV, and it nicked the, like, polarizer on the TV. It didn't break the TV, but now you can see some of the backlight coming through. And I asked on Twitter, like, hey. Like, what...

Has anyone ever has anyone ever fixed this before? I'm looking for a human that's actually done it. And, like, half of them were just people guessing. Did you try nail polish? No. I'm not gonna put nail polish on it if I don't know if it works. I'll do it if it does. But, like... And then the other half were just people just, like, asking Grock how to how to fix it. And it's, like, of course, I have tried that. Of course, I've gone through that. Like, I'm not just asking you to take my question and to put it in this box. I can do that myself. It was... Of course, asked Google. It's the first thing I did. It did. I did. I'm not I'm not ashamed to say that. I popped it into all of the different AIs to to get, like, an idea of of what it is. But, like, I'm actually looking for a real piece of meat that has had this problem and can tell me how the... How it worked out.

Yeah. Wes is looking for some meat. He's looking for a worm. We all hear the message, Wes, loud and clear.

I think that's a good spot to end it. Don't you think? I I don't have anything else. Anybody anybody got anything? You all got anything? Send me your meat.

Yes. Don't... Wes.

In the mail? Gonna you're gonna get the guy who responds about all the foot foot pics in every video now to to hit you up, so please not.

Alright, folks. That's all we got. We will see you next week. We'll be back on Monday next week for another Syntax Live. That's all we got. Please. Peter.