997: Rating and Roasting Your Projects

Scott and Wes dig into a huge batch of community-submitted projects, from JSON tools and CSS editors to AI agents, view transitions, and everything in between. It’s a rapid-fire showcase of what developers have been building, including picks like Arrow JS, Sugar High, Drift, and a whole lot more. Show Notes 00:00 Welcome to Syntax! Wes’ Bluesky Post Wes’ X Post 01:20 JSON-Alexander. 02:43 FFF - Fastest File Search. 04:44 View Transitions Toolkit. 08:06 Agentation and Svelte Agentation. 11:21 CSS Studio. 13:12 Peon Ping 14:26 Peekdown. 16:03 Dex. 20:22 Content Copilot. 22:16 Opencode Sentry Monitor. pi-sentry-monitor. 24:56 Arrow JS. 29:20 Comark. 33:19 Silly Software Club. 34:05 Sugar High. 36:04 Drift. 37:19 Fallow. 41:20 Edit Mind. 44:46 Clint. 47:18 Honorable mentions. 47:21 Artemisapp. 49:53 Open Screen. 50:14 CanvidHQ. 52:02 Proxybox Zero. Hit us up on Socials! Syntax: X Instagram Tiktok LinkedIn Threads Wes: X Instagram Tiktok LinkedIn Threads Scott: X Instagram Tiktok LinkedIn Threads Randy: X Instagram YouTube Threads

Speaker names marked ? are inferred from speaking time and the show’s known hosts — they are not voice-verified.

• 0:00Wes Bos?

  Welcome to Syntax. Today, we have a syntax highlight. This is where we're looking at your projects that you've been working on, either reviewing or roasting them, or just checking out cool stuff that people are working on. Everybody right now has a project. Everybody's working on something cool. And I think the most frustrating part about this stuff is getting people to simply care, simply getting people to check stuff out. My DMs are full of stuff where people are like, can you just check this out for me, Wes? You know? So I thought, let's do a whole episode looking at what everybody's working on. And man, there are so many cool things. I can't wait to get into it. My name is Wes. Obviously with me is always is Scott. How you doing, Scott?

• 0:43Scott Tolinski?

  Hey, I'm doing good. Michigan won the national championship in basketball last night.

• 0:51Wes Bos?

  Congratulations.

• 0:53Scott Tolinski?

  Oh, yes, I know. I did so much work playing basketball to win that game. And no, it's so cool to see that happen. Our kids went nuts and go blue.

• 1:03Wes Bos?

  Right on, right on. All right. So the way this is going to work is we're going to go back and forth and just pick ones that we found interesting and detail them and kind of dive into them. If you have something you'd like to share for the next syntax highlight, make sure you send it on over. You can reply to this tweet or skeet that I put out here. All right, I'm going to shamelessly show my own as the very first one. And this is a Chrome extension called JSON Alexander. And it simply is just a Chrome extension for viewing JSON when you're in the browser, right? I had been using one for super long and I realized that was like injecting some like random stuff into my DOM. And I looked into it. Turns out the author is, I don't know, he's going private with it, doing some tracking stuff in there.

• 1:48Wes Bos?

  And I was like, you know what? In this age, I don't need to use somebody else's Chrome extension who is inevitably going to start injecting ads and whatever into it. So I went and built my own. It's called JSON Alexander and it has everything that I've wanted, right? Like the ability to collapse all of the children, the ability to open at different levels, the ability to, one of the things I use all the time is I just want the JSON, the data to be in the, oh, is it not working right now?

• 2:22Wes Bos?

  All right, I have a bug here, but what should be happening is that the data should be available in the console so that you can sort of play with it and view it. And it's just my favorite JSON extension ever. So if you are looking, you can just clone it, install it yourself. I also have submitted it to the Chrome Store, so should be in the Chrome Store by the time you're listening to this.

• 2:43Scott Tolinski?

  All right, I got something really cool for you, and it is FFF, which is the fastest, most accurate file search toolkit for AI agents. Basically, this thing would replace any file search tools that your agents would be using. Instead, it would be using this tool, FFF, and it is very, very fast. And they're like their whole thing, the future of code searches, not redjects. So you can see just how fast it is directly in here. They even give you a nice little okay. So I just typed in static in here. I'm typing into a text box, audio listeners, and it is filtering things very quickly here. So I think this is a really

• 3:25Scott Tolinski?

  cool project. There's a whole bunch of different versions of this, like there's a Py plugin somebody made. There's a node version of this again, so you can just straight up use this, or you can bake it into tools that you are building, basically giving you live grep search modes, multi-select. It's pretty, pretty stinking fast. So check it out. FFF, yes, very cool project.

• 3:52Wes Bos?

  That's really cool, because honestly, my, one of the biggest problems I have with all of these projects that I'm working on is I simply forget what I called it, and I can't find it on my machine and/or I can't find the Git repo on my own personal GitHub, simply just finding. The amount of times I've opened up like a parent folder in VS Code to simply use that search, because the like OSX search sucks, it's like way too often.

• 4:19Scott Tolinski?

  Yeah, well, you know what, it's interesting about this, Wes, is really that it is largely discussed as being like something to make your agent tools work faster, right?

• 4:31Wes Bos?

  Yeah.

• 4:31Scott Tolinski?

  Because your AI agent tools are kind of constantly searching through your code. So this would be a faster process that would in turn pay dividends in your entire process.

• 4:44Wes Bos?

  Another one from Bramas. He works on the Google Chrome team and he's done a lot of the like Chrome extension work for view transitions and scroll-driven animations. And he's done a lot of the stuff around learning how this type of stuff works. And they are working on this view transitions toolkit, which looks like a JavaScript library you can install. And it gives you some helper methods for getting the different animations on the page, navigation, playback control, probably all of the stuff that's in that Chrome extension as well for scroll-driven animations. Because quite honestly, one of the hardest parts of working with all of this like

• 5:24Wes Bos?

  view transition stuff is simply just debugging them and sort of diving into it. So this seems like a pretty nifty toolkit. I do have to say like Bramas, you gotta take this gradient text

• 5:36Scott Tolinski?

  off of it. Yeah.

• 5:38Wes Bos?

  Because it's like

• 5:38Scott Tolinski?

  The site does read.

• 5:39Wes Bos?

  As soon as I see that, like a lot of stuff we're looking at today is like vibe-coded and that is fine. But as soon as I see like this gradient right here, I immediately think not, I don't immediately think, oh, it's vibe-coded. I think it's old vibe-coded from like, from like six months ago, you know, because we don't get, fortunately, we don't get that gradient anymore.

• 6:01Scott Tolinski?

  Yeah, totally. And one of the coolest things in this package, Wes, is the playback control of view transitions. So you can pause, resume, view transitions, which I think is really neat, nice to have, especially when you're working with some of this stuff to not have to worry about that. There's measuring tools and stuff. So yeah, it's not just all compatibility and whatever stuff. There's some really, really interesting things coming in here. Also, like the automatically inject from name and to name view transition. So that way you can maybe control direction and things like that. Pretty neat.

• 6:39Wes Bos?

  You know what I was thinking the other day? You know, Remotion does like video from like React components? And like the one thing about Remotion, I think this is still the case, is that if you want like animations or whatever in your video file, you have to do your animations the Remotion way. And I was thinking that because it's kind of hard to like scrub animations. And I was like, I wonder, I was like, maybe now that we have all of this tooling around Being able to control animations, you know, like you can obviously scrub your animation with your scroll, but it looks like you can just scrub the animation here with like an input box. And the reason they needed that is because the way that reemotion works is that it just

• 7:22Wes Bos?

  takes screenshots of every single like millisecond of your video. So it needs to be able to scrub your explicitly scrub those animations to each thing. It's not simply just recording the screen and letting the animation play out. It might like, might spin up like 100 workers that will take 100 screenshots and then stitch those together. And then that gives you 100 frames, which will be, I don't know, maybe two or three seconds worth of code. So this seems kinda neat that may have an interesting use case of like generated video from browsers.

• 7:58Scott Tolinski?

  Yeah, yeah. And then all browser based instead of faking stuff, you know, with React or whatever. It needs stuff. Next one I have here is a couple of plugins, which is agentation. And then there's a Svelte version of this called Svelte agentation. Now, the thing, uh, agentation is really dope. So this thing allows you to essentially do feedback into AI agents from directly in the browser. There's even an MCP, there's a, that will connect directly to your AI agent. But the coolest thing about this is so you, you basically, you mark up

• 8:40Scott Tolinski?

  aspects of your site. So you could say, I'm going to click on this header and I'm going to tell it directly in the browser, like you're leaving a note or a feedback to say, make this red. And then I click add that note. And what it does is it basically creates all this little, um, what would you call those? Where they're, um,

• 9:01Scott Tolinski?

  Like little notes throughout, like when you're, you know, asking for revised changes, right?

• 9:07Wes Bos?

  Yeah, just like a feedback stickers or, you know, you put, you overlay these things on top of a, a design and say, yeah, this is not working.

• 9:16Scott Tolinski?

  So basically what you do is you mark up your document, you click the copy button and then it pastes in this whole thing where it says, all right, here's the hero demo, here's the location of the classes and the feedback is make this red. So instead of having to go into your agent and say, hey, in this file and this component in this class, make it red. Agentation just kind of like makes that whole process a little bit more streamlined. And then if you use their, if you use their tooling in here, like their MCP, it allows you to actually have this feedback conversation directly from the browser itself, instead of having to copy and paste it into an agent. So this is really dope.

• 9:56Scott Tolinski?

  And the first thing I was wondering when I saw this was like, why the heck is this just react? Because this is a react tool and that bugged me because it's like, okay, besides the, yeah, like what about it? Requires this to be react, this seems like it's like prime candidate for a web component that you could just drop in to anything, right? So I was annoyed that I couldn't use it first and foremost, because it looked dope. But then along came this felt agentation. What actually, I will say this, one of the reasons why agentation is react specifically, is because you can get information about the actual react component. So it's not just like, here are the classes, here are the files or whatever.

• 10:41Scott Tolinski?

  Here is the react component that has the issue. So it's directly tied to react. I, I just wish, you know, it could have been web components. But there's a svelte version of it as well, which is not done by the same folks, but copied in a lovingly way. So again, you can see, you can mark stuff up, you can leave your feedback. You know, whenever I leave feedback for these types of things and I'm trying to like come up with, uh, examples, Wes, my example is always make it red. I can't, couldn't possibly tell you why.

• 11:13Wes Bos?

  Make it bigger, make it, make it pop.

• 11:16Scott Tolinski?

  Yeah, make it pop, make it red. It's a neat little project. And again, something I wanted in my code.

• 11:21Wes Bos?

  On that same thing, this was launched this morning from, by Matthew Perry, who's the guy behind Motion. We've had him on the podcast and this is a design tool that works with your, your agent. So basically it's kind of a similar thing where you can just like click around your website. And then in this case, you could just change the properties. I don't know how I feel about this because generally when you're like, you're working with like a design. I don't know that you just want to like click the thing. I'm like, maybe, maybe like you, you give it feedback. Say make this a bit wider or whatever, but like very rarely do I want to like, like click on like, oh, this thing.

• 12:04Wes Bos?

  And then just like explicitly change the height or, or explicitly change the border. Like I'm trying to make reusable things and, and maybe, maybe this feedback then gets piped back into your agent. And then the agent says, ah, I see what you're trying to do there. Let me, let me make this into like a reusable component. But it also has support for Motion itself, where you can add like keyframes and whatnot. Quite honestly, this looks like a very good stab at like what a next generation dev tools might look like. So I'm curious to see how this, it's a paid product, Hunter Box. I'm curious to see how this sort of pans out for them. So props to Motion folks.

• 12:44Scott Tolinski?

  It's an interesting thing and I think we're going to see more visual tools like this pop up. I do think that is that you've speculated a little bit on that in recent episodes about what the future of IDEs look like and things like that.

• 12:56Wes Bos?

  Yeah, some, there's some, someone's got to figure out this whole design with AI type of thing, you know, where somebody still with good taste is able to like control this thing and give a good feedback. And I know there's lots of people working on stuff like that right now.

• 13:11Scott Tolinski?

  Yeah, word. Um, I have a fun one for you, Wes. Have you ever played Warcraft, Warcraft?

• 13:18Wes Bos?

  Like World of Warcraft?

• 13:20Scott Tolinski?

  No Warcraft.

• 13:22Wes Bos?

  No, I've not, I don't think I've ever played a video game before. No.

• 13:25Scott Tolinski?

  Okay, well, this might not tickle your fancy as much as it does mine. But peonping is basically giving your AI agent a character voice. It's very funny. If you've ever played Warcraft III specifically, you'll know that when you're like ordering peons around, they're like, work, work, ready to work, something you're doing. Like they're, they have these like little sayings that they do. And this is so funny. Oh, it is so stupid and it's hilarious. So now, when you're working with your Claude code and it's like thinking it's going to like use the actual audio files from Warcraft III. It's super funny. They also actually have the human peasant.

• 14:09Scott Tolinski?

  They have the Soviet engineer from Red Alert 2, a battle cruiser from Starcraft. So if you're, if you're a, a fan of RTS games and you want some fun audio when you're, when you're using any of your AI agents, peonping.com is very funny.

• 14:26Wes Bos?

  Uh, I've got one called peekdown.app and this is simply just a quick view plugin for like, you know, when you have a file on your Mac, you push spacebar and you want to do a quick view. For markdown files, you can just simply view them as a rendered. I have one that will highlight them and, and show them to me as code, but I've, this is kind of cool where it will actually render them out. I don't know, markdown, what do you think? When you push space on a markdown file, do you want to see the actual markdown itself or do you want to see the rendered version of it?

• 14:59Scott Tolinski?

  I want to see the markdown itself. I think I want to see the markdown itself. Yeah. Or I want to see a rendered version that I can edit as markdown. Like Notion.

• 15:10Wes Bos?

  Yeah, like, yeah, like, like, or like, like Obsidian, right? Where like, because Obsidian kind of does both of those, right? I want to see the images, but I kind of also want to see like the markdown as well. So, kind of a neat project, peekdown.app, check it out.

• 15:24Scott Tolinski?

  Yeah, very neat. I like QuickLook plugins, man. I feel like that's something that is underutilized.

• 15:29Wes Bos?

  I went a little overboard on the QuickLook plugins a while ago. And I kind of regret it. And now I have all, I'm looking forward to getting a new computer. So I could start, start fresh again, you know? And like, I know I can like wipe my computer and start again. But now I, I have these QuickLook plugins that don't work great all the time. And I don't know where they are and I, I brood installed them at one point. So.

• 15:53Scott Tolinski?

  Yeah, I installed a bunch of stuff on my computer. The hard drive filled up, so I have to get a new one now.

• 15:59Wes Bos?

  That's what happens.

• 16:00Scott Tolinski?

  Just so it's the name of the game, disposable computer. I have one that is from David Kramer at Sentry, which is Dex at dex.rip. Many people have heard of the tool Beads for working with AI and giving them tasks and to do lists that persist, save into your repo and stuff like that. Kramer built Dex and I like Dex because it's less heavy, less invasive. It's more simple in terms of like the actual repo and code. It makes like, I feel way better running this instead of Beads based on what I'm trying to do. That's it. It largely does the same thing.

• 16:42Scott Tolinski?

  What it does is it creates epics and tasks and subtasks. And like, you can have tasks blocked by other tasks and things like that in your codebase. And it lives in just a JSON file. So there's no database or anything like that. It lives in just a JSON file, which means you can commit it directly to your repo, which means your entire org can work off of the same to do list or Dex tasks. And then of course, there are Dex skills here so that you can tell a AI agent to build out an epic of detailed tasks. Now, I use this in place. Of having AI write like markdown files with detailed to dos and stuff like that.

• 17:25Scott Tolinski?

  Because this feels way more deterministic and that like you can have them explicitly blocked by other ones. And running the Dex CLI commands, you can say like, hey, get the next ready task and things like that. So before I do any work with AI, I'm always telling it to create, you know, detailed epics and things like that. So that way it has an actual to do list to work off of. Now I understand that like, you know, all of the tools have their own built in to do lists and stuff. But I find they largely suck. They are like at the whim of whether the agent actually wants to use it at that time.

• 18:06Scott Tolinski?

  There sometimes the agent does the work and then doesn't actually check off the things and the actual thing. And again, you can't commit it. It's, it's not like, it's not a, a thing you take with you.

• 18:17Wes Bos?

  Yeah, I, I find that with the, the cursor plan mode, when I want to do something that is larger than simply implementing two or three features, like I find it like it wants to get going. And then I find it hard to create a plan that is like, I, I sometimes want to spend like three hours working on, on a plan for specific features because I want to really get into it. Because the, otherwise it, it, you let the thing rip and then it doesn't implement all how, how you really wanted it to do. And, and at that point, it's easier just to kind of sit there and just do it feature by feature. So I much prefer something that I can just make a very, very long plan and then just let it rip for hours on end.

• 19:03Scott Tolinski?

  See, what I've been doing, Wes, is not necessarily even that. What I've been doing is I, I, I work really deeply in plan mode, planning. And sometimes maybe I'm having it write out specs and MD files. And then I have the agent convert that to Dex Epic with, with individual tasks. Those task descriptions might even reference what files need to be worked on or what the scope is.

• 19:26Wes Bos?

  Yeah, that's exactly what I need. Yeah.

• 19:28Scott Tolinski?

  But when I work in it, I say, hey, start this epic, go through each task individually. When you complete a task, do not commit, do not start the next task. Stop and wait for me to review the code and then I will tell you if you can commit and continue to the next one. And I find that for me, that has been reducing the amount of dogshit code that gets added to my repos. Because I'm actually, even if the task is just a few lines of code or whatever, I'm inserting myself into that and I still move fast, but it just like gives me that ability to say, did you really need this third effect in this code? Like this shouldn't even be a side effect in the first place. And now

• 20:12Scott Tolinski?

  you've added three of them to one component. Like, what's your deal?

• 20:15Wes Bos?

  Scott in the loop. That's what everybody needs. That's your new project. Scott in the loop.

• 20:21Scott Tolinski?

  Sloop.

• 20:22Wes Bos?

  Alright, so we asked on Twitter for people to submit theirs. Floran Pop, who I know he listens to the show, he submitted his content copilot.com, which is a find out what's going viral, know exactly how to replicate it. We scan thousands of Instagram reels in your niche, select the ones blowing up and show you exactly what to do. So this is like a huge promise for people that are like in social media, just trying to figure out what content should I create and what are other people doing right now? And seems interesting. But then I'm gonna roast you Floran. I went to his own Instagram and doesn't seem like

• 21:01Wes Bos?

  it's working. It's got 500 views on most of his stuff. So this is something that you see a lot. People think AI is going to solve where you, if you can just cheat the system and use AI to figure things out for you, of course it's good for research, then you're gonna, you're gonna absolutely blow up. And I have yet to see a case where that is, that is it, right? Like we saw it with SEO people. They're like, oh, if I can just get AI to write 20,000 articles, my website's gonna blow up. Or if I can create this like, like

• 21:40Wes Bos?

  a faceless YouTube channel where I just crank out 20,000 videos a day for five different accounts. That stuff I don't think is ever going to, to work. Especially now, people who watch social media are like their bullshit detector is starting to go off. When it's just like, oh, you're just recording this because you think it's going to do well, not because you want to share something interesting with me. So no shade to like Florian, this seems like a cool research tool as well, but obviously it doesn't work.

• 22:15Scott Tolinski?

  Yeah. I got one here from me. You did one from you, so I'm going to do one from me, which is my open code sentry monitor. So sentry has, and this is simultaneously both an ad read and a plug for my package here. Sentry has a really cool agent monitoring feature that you might not have known about where you can monitor both like the cost usage, but the duration, errors, LLM calls, tool calls, token usage. You can dive into just how performant and how good all of your... Yeah, sorry. There's a lot of data here. My computer is running like total garbage right now in case people are wondering.

• 22:59Scott Tolinski?

  So you can see a whole bunch of information. It's basically AI span. So you can see right down to every single tool call that was done. If you're looking to optimize your agents, how they're working, how much you're spending, how much time they're taking, where some of your tokens are being taken up in and like how effective things are. And so I built an open code sentry monitor plugin, which uses this tool. So you can connect your sentry agent monitoring to open code and you just install it as a plugin. You pass in your DSN as a config file and then you have a full on logs and traces for your AI agents.

• 23:41Scott Tolinski?

  One thing that I think is really cool about this was beyond seeing like, all right, models and whatever usage.

• 23:47Scott Tolinski?

  Actually, the given project you're on, it has that as an agent. So it'll tell you which project you're on and everything. So you could run it all, all of your projects in one monitoring. And I even have a pie version of this, but mine isn't very good. So I know Serge has made a pie one that I will link his up because I'm not confident in mine. I'll tell you that. I am using it, but I'm not confident in it. And here it is, my pie version of this thing. So I, I'm going to say shout out to the sentry agent monitoring in general, because I think this is a really neat stuff, something I've been using a lot of.

• 24:22Wes Bos?

  I, man, I need this on, on there as well because like you often like build something and you think, hmm, how much, how much did that cost? Or like if you're on a, if you're on like an unlimited plan or whatever, how much would that have costs? Or how many tokens did that use? That's really interesting stats to get, get your hands on.

• 24:42Scott Tolinski?

  Yeah. And even just getting to dive into like the tool calls and stuff like that, I find to be really interesting. Like, why is this, you know, uh, doing these tool calls when it shouldn't have to? And, and maybe you could get into like hyper optimizing things. So, yeah.

• 24:56Wes Bos?

  Next one is Arrow JS. And I stumbled upon this when I was looking into the CloudFlare Dynamic, what are they, Dynamic Workers? Which essentially is like allowing you to run untrusted code in a CloudFlare worker. Um, and one of the demos I did with the untrusted code was I asked an agent for, to generate some, some code that would then output HTML. And then I needed to render that HTML like in like a chat box. Um, but the, the sort of the problem with rendering unknown HTML, um, right now is that like, you probably shouldn't just be injecting, um, random HTML, CSS and JavaScript into your user's page.

• 25:38Wes Bos?

  That, that's sort of the problem that OpenAI and all these like chatbots have right now, where they're trying to solve that with MCP and MCPUI. Um, and I don't know where MCPUI is with this right now, but like one of the downsides to it, when I was like looking into it was that you would have to like make all the interfaces upfront. And, and quite honestly, I think the killer feature for a lot of these agents is simply let the agent generate the UI for you, you know, like if you say like, ah, give me, um, the ability to, I don't know, order a pizza as a stupid example. That's all we, we always say, or, or show me these things on a map or, or whatever. The agent is, is pretty good at coming up with some UI for that.

• 26:23Wes Bos?

  Um, and then the way that they often have to do it is they have to throw it in an iframe and there's a bunch of limitations to that. But I stumbled upon this Arrow JS, which Does its rendering not in like a, like an iframe and it injects it straight into the DOM, but then it renders it inside of a WebAssembly worker and simply just streams all of your clicks and interactions back and forth to the worker. So it is sandboxed in its rendering and then you're simply just streaming everything back and forth. And it is on top of that is a full like UI framework where you can give an agent the docs and the framework and say like, here are

• 27:04Wes Bos?

  the pieces, you know, like I built all of these pieces. Here's a button. Here's a card. Here's, here's everything that you're used to. Use these pieces to make me a new UI. So I thought this was pretty cool. ArrowJS.com.

• 27:20Scott Tolinski?

  Yeah, that's very interesting. The sandbox stuff is getting a lot of conversation right now in various ways that I haven't quite figured out personally, like what it all means for me. Like, what, yeah.

• 27:35Wes Bos?

  Man, the whole sandbox thing is, is so tricky because you want everything to be safe, but you also want everything to have access to everything you want. And we saw this before agents as well with Dino. So Dino, by default, you have to opt in to the potentially sensitive APIs that you want, right? If you want your script to be able to access the network, or if you want your script to be able to access your file system, or if you want your script to be able to send data to certain URLs, you have to sort of approve them one by one. And now we see it with Claude Code. And in reality, people just go, I want it to have access to everything. This is too hard.

• 28:17Wes Bos?

  I don't want to sit here and approve every single LS that you have. So I'm just going to dangerously run permissions. And that's why OpenClaw blew up as well is because there, there was no security on it. So I don't know, it's going to be a hard thing for people to figure out of the balance of security and ease of use.

• 28:39Scott Tolinski?

  Yeah, it is. It's a, it's all, I feel like things are going to be changing in that. There's going to be some, something that becomes a new de facto something at some point here. Right now, it feels like there's a lot of new tools coming out.

• 28:51Wes Bos?

  I think the models will eventually get smarter at like, is this actually a sensitive thing, you know, like, oh, you're reading a file from my file system. I'm, I think that's okay. You know, I think the models will eventually get to a spot where you'll be able to mostly trust them to run tool calls. But again, not always. We're still going to need things like, like running a sandbox in Wasm.

• 29:20Scott Tolinski?

  Hey Wes, I got something real cool for you here, which is called Comark. Comark is a streaming ready markdown parser with component support for Vue, React, Svelte, HTML, and ANSI terminal. This is basically, you have markdown here, but then there's this interesting syntax where you have the double colons, and then you can pass in essentially props, and that turns it into a component renderer. You can think of something like MDX, only MDX is just like a React thing. But here, again, we can use the same syntax in Comark. And then when you render it, like, so the mark, it's always markdown that you're

• 30:03Scott Tolinski?

  writing, but you're rendering Vue, React, or Svelte all from the exact same markdown syntax. So, pretty stinking neat, especially since markdown has turned into such a thing here.

• 30:17Wes Bos?

  Okay, so you essentially, like, similar to how we were just talking about your, your agent returning markup, but it's likely that your agent would be returning markdown, but also you want to return like rich components inside of that. So, this is a thing that will allow you to stream back and then render out components from app like?

• 30:43Scott Tolinski?

  Yeah, yeah.

• 30:44Wes Bos?

  React or Svelte?

• 30:45Scott Tolinski?

  MDX, right? MDX, you can just drop in a React component directly.

• 30:50Wes Bos?

  Or a JSX component. It's not just, MDX has nothing to do with React. It's JSX.

• 30:55Scott Tolinski?

  I'm only using the React context. JSX is React to me, folks. I'm sorry. And, but this, you can use anything. You can, you can have just straight up HTML. You can have view output, React output, Svelte output, or Svelte components directly inside of Markdown. And you're all using the same syntax and there's streaming support. So really super neat.

• 31:22Wes Bos?

  Why wouldn't they just return the component itself instead of this weird syntax?

• 31:32Scott Tolinski?

  Why wouldn't they use the, like, why wouldn't you import the component itself is what you're saying?

• 31:38Wes Bos?

  Well, I'm thinking like, there, now you're coming up with this new syntax, which is this colon, colon, alert. And then you're passing in props type of info. And, and I'm wondering why you wouldn't just ask the agent to return the alert component itself. And is the answer to that because it's an agnostic way to return components and it could be rendered in any framework?

• 32:05Scott Tolinski?

  Yeah, that's, that's kind of what I'm thinking.

• 32:07Wes Bos?

  Okay.

• 32:08Scott Tolinski?

  Yeah, to me, it's like you have one syntax now that is used for all of the frameworks. And the only thing that's different about them is the plugin that you're using to, you know, process the Markdown.

• 32:24Wes Bos?

  Oh, to rent your, your, oh, I see, I see. So your render layer is up to you. This, and this, this isn't just, like, this could be in terminals, right? Or this could be like a, like a native implementation of it. I see, I see. That makes sense because like, I mean, as much as I hate when we have another Markdown standard, it, it does make a lot of sense where you will need some sort of more rich way to return it. But then why don't we just use HTML?

• 33:00Scott Tolinski?

  Because Markdown is

• 33:02Wes Bos?

  Yeah, Markdown is good.

• 33:04Scott Tolinski?

  Yeah, Markdown is good.

• 33:05Wes Bos?

  That's true. And

• 33:07Scott Tolinski?

  It's only getting better too. I mean, people love Markdown nowadays.

• 33:11Wes Bos?

  Everybody loves Markdown. All right, I'm in. I'm in. Co-mark.

• 33:17Wes Bos?

  Skeptically in. Another one, Silly Goose Software Club. This is just a listing of projects that are silly. And if you're feeling, I've said this many times on this podcast, if you're feeling burned out at all, especially all this stupid AI stuff that we won't stop talking about, there's a whole other side to it of people building really cool, fun stuff. And if you're feeling burned out, I highly suggest you check out a, uh, build something, build something fun, build something silly that is simply just there to make you laugh and then oops, you accidentally learned something along the way. So sillysoftware.club has a listing of everybody's silly projects and you'll have a good laugh.

• 34:02Wes Bos?

  So need more of this on the internet.

• 34:04Scott Tolinski?

  Yes. Uh, I'm going to go with another one here called Sugar High, which is, uh, my last one was Markdown, something that I hate working with in, uh, you know, in my projects. But the other one would be, uh, syntax highlighting. I hate syntax highlighting plugins. They're all such a PIA. So, uh, Sugar High is a super lightweight syntax highlighter. A tiny, it's a super tiny, super lightweight, super tiny, super lightweight, uh, about 1KB. Uh, works with any JavaScript, JSX, uh, even React flavored JSX, Wes. And, uh, basically allows you a couple of CSS properties to configure this thing and it is just nice.

• 34:48Scott Tolinski?

  It's just nice. So, uh, again, I, I really just, I, I hate working with, with, uh, syntax highlighting overall. So I think this is a nice little option for you. There's even a Remark plugin if you're already using Remark, so.

• 35:02Wes Bos?

  Remark, re, man, my own, my own personal website, I had to like go down the whole Remark, re-whatever. I have such a crazy setup and, uh, Yeah, that's, that's a hard thing to do. I had to get the syntax highlighting going as well. What's the one from Antfoo that everyone uses? That's what I'm using. Antfoo syntax.

• 35:25Scott Tolinski?

  Shiki.

• 35:25Wes Bos?

  Highlight. Shiki. I'm using Shiki myself, but as, as with everything, I wanted like the Wasm version so I could server render it and then pain, pain all the way down. I couldn't get it to work. And then I like, wanted it to work on Cloudflare, which is like another hard on hard mode.

• 35:44Scott Tolinski?

  I.

• 35:44Wes Bos?

  So I ended up getting it going.

• 35:47Scott Tolinski?

  Installing Remark plugins. I'm just gonna, I'm gonna stop. I'm just gonna say.

• 35:51Wes Bos?

  I wrote my own. I wrote a walker for some of the stuff on my website.

• 35:54Scott Tolinski?

  I did two, Wes.

• 35:57Scott Tolinski?

  For demos. I did it for demos. Uh, now I can just use a Comark. So shout out Comark.

• 36:03Wes Bos?

  There you go. Um, this one's called Drift from Fiberplane and essentially it allows you to bind specs to code and check for drift. And your vibe code and all this slop, what tends to happen is either your documentation or your like, your skills or whatever, like you have to, to document your actual code and the code itself drift, right? And this, that's, this is a big problem because the agent will go in and read the documentation and just say, ah, that's, that's not good. So I, I've opted to doing a lot more of my coding in like my documentation directly inside of the code.

• 36:44Wes Bos?

  Um, because like, I hate that. It just generates all this freaking markdown of, of how it works and explains it all. And bleh, I don't need that. Um, but in many cases, you, you do need docs, right? You do need specs and for how these things work and you would need to make sure that they do not get out of sync. So it seems like a cool project written in Zig. You know, it's probably awesome then to make sure that it does not drift apart.

• 37:10Scott Tolinski?

  People have been hyping up Zig, Zig-a-Zig. Uh, yeah, I don't, I don't know if Zig is just one of those things I haven't had to use for, but people have been talking big talk about Zig. I have a project in Rust here, which Wes, I want you to keep that drift in mind. We're going to do an episode on deterministic tools for AI. So I want, if you, if you can dive into that a little bit, or I will, because I want to see a little bit more of that. Maybe I'll, I'll do some deep dives there because one of the things I've been really getting into is like you mentioned, like these, there's so much drift that happens, but there's also just like cruff that builds up when working with AI.

• 37:46Wes Bos?

  It gets out of control so quickly.

• 37:48Scott Tolinski?

  Yeah. So like, what tools can I add in my tool chain that help reduce this? I had a video come out a couple of weeks ago about AI Slop and one of the tools I mentioned in that video was Fallow. Docs.fallow-tools is a codebase analyzer for TypeScript and JavaScript. Unused code, circular dependencies, code duplication, complexity hotspots, and architectural boundary violations can be found in seconds. It's Rust native. There are 84 framework plugins, so it works with Svelte, React, and any of the stuff you use, it works with. This thing rips and you can run Fallow dead code and it will find dead code or circular dependencies, code duplication.

• 38:33Scott Tolinski?

  And that code duplication stuff, you can like really dial in to say, all right, I only want this to return code duplication that is, you know, this many lines of the code are duplicated before it gets triggered as like, okay, so minimum tokens per clone. The default is 50. So for something to be determined if it's a clone or not, 50 of the tokens would have to be cloned and then it would be registered as like a duplicate line of code. So you can set minimum lines, threshold, or tokens for you to be able to say like, what is actually in my mind duplicate code and what is not? And the coolest, there's auto fix mode and stuff. There's a nice report.

• 39:18Scott Tolinski?

  You can have your AI agents just like scoop this up and then suggest changes. I built this directly into all of my quality gates and stuff like that. I'm using this thing like crazy and the best part is it is live. So fast.

• 39:33Wes Bos?

  I I needed this the other day. I know. I know. You're showing me this the other day and I was like, we don't need all these tools.

• 39:40Scott Tolinski?

  You're on.

• 39:40Wes Bos?

  Then like, like a couple hours later, what had happened is I had that Chrome extension and somebody sent in a PR for Firefox and they said, here is Firefox support for it. And I go, oh, that's weird. Like I, I thought Firefox just supported Chrome extensions now. Like, why do, why do I need to do this? But what the, the PR was basically just like duplicating it, creating output files for the Chrome version and for the Firefox version. It had TS config inputs for the Chrome version and the, like, basically duplicate for every single thing, because now there is two versions. There's a Firefox version and there is a Chrome version. And I was like, all right, it looks good. You know, merged it and whatever. And then I was just like, like, why, why do we need this? There's so much extra garbage in here.

• 40:26Wes Bos?

  And I like, like, went through it and there was one line of code on Firefox's manifest that JSON that was required and Chrome simply just ignored that. So I just nuked the whole thing, added that one line in there. And like, that's the perfect example of an, an agent being like, oh, I'm going to now do the same thing for Firefox. Let me allow, re-implement the entire tool chain for Firefox. When it's just like, come on, like,

• 40:57Scott Tolinski?

  Yeah.

• 40:58Wes Bos?

  Think for two seconds and or even like the person that pull requested it as well. Like, think for two seconds.

• 41:05Scott Tolinski?

  I know. It's so funny how like inefficient these tools can be. So I, I'm, yeah, I, for me, it's like, the tools that I'm wanting to add are the more deterministic tools, not the less deterministic ones, right? The ones that are actually analyzing things. So.

• 41:20Wes Bos?

  That's great.

• 41:22Wes Bos?

  This one's from Ilya Hadid and he sent me an Instagram DM the other day about this thing that he's working on and it's called EditMind Local Video Knowledge Base. Essentially, you can give it some video and you get from that, you can get like transcription, frame analysis, embeddings. And I thought this was kind of nifty because like I was working on something similar for the syntax transcripts as well, where like I want to be able to like search the syntax transcripts for X, Y, and Z. And the way that we do that right now is like we can vectorize each of the utterances, which is two or three sentences that were said. And then maybe we grab a sentence before and it's a sentence after.

• 42:06Wes Bos?

  And that's, that works well for like transcripts, but there's like, there's also a lot to do in, in video as well. And I think about that with my courses as well, where wouldn't it be nice if you could like search your courses for some code that was on screen, right? And there's probably you could OCR that and whatnot, but, or maybe I want to search my video for when Wes showed an icon of George Costanza, you know? And there's, there's a new Google embedding model, which embedding will, will take like something like text or, or like a screenshot or a photo or whatever. And then it will, it will turn it into a bunch

• 42:49Wes Bos?

  of numbers that somehow describe the things that are in that text or video or, or image. And then you can run vector querying on it. You can do a whole bunch of kind of neat stuff once it's been turned into numbers. I was, I was doing that with the syntax thing. So we could like maybe group the shows together or come up with tags. And I've done a lot of stuff in that area. And he's working on one where he's doing like video analysis as well. So you can search inside of videos for specific things. I think that is really cool. So I thought I would give a shout out and, and check it out. I haven't used it myself yet, but it seems like he's working hard on it. It's called EditMind.

• 43:25Scott Tolinski?

  Yeah, I want this for just straight up even like organizing my video files. Cause I have like, what now, like 15 years of tutorial videos that sometimes I gotta say my organization just kind of what like, I had some months where I was just like tossing my video files into a folder and you know, now it's like, what do I gotta do? I gotta watch those videos again to see. Also, do I actually even need them? That's a whole nother conversation, you know, at this point, but. Yeah.

• 43:52Wes Bos?

  It's kind of neat, or even like, um, like video camera. Like, I would love to have all of my security cameras. And I would love to be able to search the security cameras. And I know that there are things like that, or like video editors. Like, I would love to go back in the like 1,000 episodes of Syntax and be like, where did Scott wear a funny hat? You know, be able to search the video itself.

• 44:18Scott Tolinski?

  Well, the episodes, there'd be too many of them where Scott wore a funny hat.

• 44:22Wes Bos?

  A funny.

• 44:24Wes Bos?

  You know what I mean? No, like, it's, that's so cool that we can start to build these things. And they're very expensive. I think the Google one was like, like, 2 cents if you're running like 24 frames a second. So 2 cents per minute, but you probably could drop the frames way down. It's probably still expensive. So local models were things that just simply run slowly on your machine are probably a good use case for this.

• 44:46Scott Tolinski?

  Yeah. Okay, I got one from me to wrap this up, Wes. And you might not even know that I've been working on this. I've been working on a Lightning-based CSS linter. So Lightning is the CSS parser project from, um, Devin?

• 45:03Wes Bos?

  Yeah, Devin Gova. He's the guy behind, um,

• 45:06Scott Tolinski?

  Parcel.

• 45:07Wes Bos?

  React, uh, yeah, Parcel and React Aria and like literally everything. The guy's, the guy's a straight up genius.

• 45:15Scott Tolinski?

  Yeah, so he made Lightning CSS, which is a parser, uh, built in Rust. And man, StyleLint is one of those tools that I really rely on, but I've just been finding it like, to just be kind of a bloated and not like, there's, there's too much there. And it's also, it's not as fast as I would like it. So the idea here, and this is, I just want to say first and foremost, the idea here was for just an experiment here. But, um, I made a CSS linter, which the idea is really inspired by the folks over at Void Zero for their work on Veet Plus and OxLint and those types of things where it will have the smartest defaults

• 45:59Scott Tolinski?

  of the things that I feel like are important. Important in general CSS and it outputs like that. The whole thing is built in Rust. It is a CSS linter, again with smart defaults. I just renamed it from CSS lint to Clint because uh there's a project named CSS lint. I just don't want to step on their toes. But by default, the default rules are no unknown properties, no invalid values, no duplicate selectors, duplicate declarations, empty rules, legacy vendor prefixes, overqualified selectors. Um, there's no global leaks, no deprecated features and you can configure all of these things. It is again, uh, just a nice little CLI tool that I've been working on. It is still rough.

• 46:43Scott Tolinski?

  Um, one of the things Wes, I was trying to do with this was actually bring in a number of the the tests from styling into this project. Now, not all of them, but I brought over some of the styling tests and have adapted them to this. So that way, using their, their test suite in a slop fork type of way. I was able to at least have a basis for things to test while I was working on it. So, uh, check it out. I, I've just been working on a little bit here and if that's something that's interesting to you,

• 47:17Scott Tolinski?

  come help out, that'd be fun.

• 47:18Wes Bos?

  I know you said, but I gotta, I'm gonna speed run my last couple. Um, Daniel says he's working on a Reddit client in React Native. I thought Reddit clients were done, you know? I thought there was, there's no API. So I was like, how are you doing this?

• 47:33Scott Tolinski?

  Yeah.

• 47:34Wes Bos?

  Are you, what, what are you using? I'm using the stupid native one and I hate it.

• 47:38Scott Tolinski?

  The native one sucks. I'm using Narwall and the problem with Narwall is that it is paid. It's like, I, it's not expensive, but it's significantly better. And I use Reddit enough that I'm like, you know what? This native app absolutely sucks. I, I cannot, I cannot use this. So I am paying for Narwall and it's good.

• 48:00Wes Bos?

  Man, so he sent me a DM on how he's doing this. And I don't know if I'm supposed to say this, but I think it's really interesting. He says, it's sort of an open secret in the React Native community where you're able to do things that are not possible in a typical web app. For example, if a user logs into a site using a React Native web view, technically you have access to their cookies and can make requests on their behalf.

• 48:29Scott Tolinski?

  I didn't know you could do that.

• 48:31Wes Bos?

  And that that's essentially just like running a headless agent browser on on behalf. So he's probably reverse engineered a lot of the Reddit APIs. Or he's probably running the like request as simple, just like clicks or visits to simple URLs and then parsing out either the data payload or the HTML something like that.

• 48:51Scott Tolinski?

  I should do this for my tonal, my tonal app. Tonal customer, because that that would be the same thing. You just get hmm, yeah.

• 49:02Wes Bos?

  Man, he says, once you learn this is possible, it really makes you question if any apps are using this in bad faith. Probably.

• 49:10Scott Tolinski?

  Oh, yeah, yeah.

• 49:12Wes Bos?

  Yeah, so like any, basically, you can make a React Native site that has a web view that opens up a web view and then that your React Native app can then talk back and forth to that web view and like program, you could like bot it, right? You can programmatically do things.

• 49:30Scott Tolinski?

  Yeah, I'm installing this right now.

• 49:32Wes Bos?

  You could do that as long as tonal has like a like a website, right? Is there a

• 49:35Scott Tolinski?

  They do.

• 49:35Wes Bos?

  Yeah, yeah, yeah. There's a mobile thing. Man, that Apple's for sure gonna shut that down.

• 49:44Scott Tolinski?

  No, don't, don't, Wes, let's not speak that into existence. I just installed Artemis.

• 49:50Wes Bos?

  Yes, okay. Well, that's really cool. I'm glad it is. A couple of people said they're working on like Screen Studio alternative competitors. This is one called Open Screen has been popping up. Everyone's like, you don't need to buy Open Screen. And then like you read the comments and people like I, I use Open Screen or I use Screen Studio and this is not nearly as good. But there's lots of people working on like little cool video editing tools. Can vid HQ seems to be another one.

• 50:19Wes Bos?

  Blowing my mind that everyone's building video editors in JavaScript these days.

• 50:23Scott Tolinski?

  Video editors in JavaScript. Hey, you know what? I think the video editor is ripe for change. You know, I saw a post that was like, you know, the AI first video editor tool. And I was like, oh, sick. I'm so stoked to see what this looks like. And then it was just like an AI editor that you could generate. Video inside of like all you could let's generate some AI video slop inside of a shittier editor. I'm like, okay, but the amount of comments that said the same thing led me to believe like people are there's there's gonna be a shakeup here in in terms of because everyone was like saying the same thing like you can't just say it's an AI video editor like people are like reach it like wanting something new there.

• 51:04Wes Bos?

  Yeah, I want some sort of tool that will

• 51:10Wes Bos?

  like actually be good at editing my videos and not just take these same like the the remotion like skill is probably the closest I've seen to that type of thing, but even after like a couple of weeks, you start seeing the same videos over and over again. It's like, oh, you just had examples of things that were done before. And you're just kind of copying those over and over again, you know, and I tried to get them. I tried to make something that would like edit my like talking head videos and like it gets it like 63% of the way there. But I think these the tools are just going to be tools that are baked into like like a Photoshop AI tools are a really good example of it.

• 51:50Wes Bos?

  And I'm sure we'll start seeing a lot of that stuff hit our like DaVinci and whatnot eventually. Not there already is some, right?

• 51:59Scott Tolinski?

  Yeah, DaVinci's got some interesting stuff going on, but yeah.

• 52:03Wes Bos?

  Proxybox, this is cool. Just it basically it's it's the only hardware one that that someone replied to, and I think that this is really cool. Being able to make your own PCBs and like model out your own hardware has never been more accessible to anybody. There's lots of companies out there where you can get PCBs made. But the PCB way is one that sponsors every single YouTube channel out there, and I've looked into it and it's like several dollars to get your own custom PCB made, which is mind blowing that that you can do that. So this guy has something where you can just plug in like a like a printer or something that that doesn't have access to the internet and you can just make it to have access to the internet.

• 52:43Wes Bos?

  And it it does like proxying similar to like CloudFlare tunnels or what's the one that you're everyone else is using that you're using?

• 52:51Scott Tolinski?

  Tail scale.

• 52:52Wes Bos?

  Tail scale, you know, something like that where you can like simply just now connect to these devices in a neat way. That's all we have here. Man, there's probably 300 more replies that we got there. Send us what you're working on. It's really exciting, energizing to see what people are working on, and I'm pretty excited.

• 53:13Scott Tolinski?

  Yeah, me too. There are endless amount of stuff, and if you have projects, feel free to share those with us because, man, it would be nice to do one of these once a month or something. There's just so much going on all the time, and I love finding out about new stuff. And in this episode already, I feel like I've gotten a bunch of stuff to go research more on. So thanks, Wes, for bringing what you brought.

• 53:33Wes Bos?

  All right. Peace.

• 53:35Scott Tolinski?

  Peace.