The Real Pricing of LLMs

Syntax| 00:52:40|May 6, 2026
Chapters10
Discussion of GitHub Copilot and other AI services moving to usage based billing and the economic pressure on high token usage.

Usage-based pricing for LLMs is accelerating costs, pushing developers toward smaller, targeted models and smarter tooling.

Summary

Syntax’s potluck episode tackles the real cost of AI: billing shifts to usage-based models with Copilot and Claude, how that affects daily workflows, and what it means for tooling choices. Scott and Wes break down why big AI subsidies are ending and how multipliers (like Claude Opus 4.7) can spike daily token spend dramatically. They also vent about the push toward API-based billing, the lure of cloud-only access, and the need to adopt smaller, specialized models for cost control. The discussion broadens to practical topics: Node version management with Vit plus, corepack for cross-package-manager consistency, and the practical trade-offs of native HTML/CSS versus heavy UI component libraries. They also touch on security scares, interview strategies in an AI era, CSS linting projects, and a future where browser-native primitives gain traction as AI tooling evolves. Throughout, the hosts emphasize focusing on outcomes and real problems over chasing every new AI gimmick. Finally, they invite audience questions via syntax.fm/potluck for future episodes.

Key Takeaways

  • GitHub Copilot and other AI services are moving from flat subscriptions to usage-based pricing, which can dramatically increase monthly costs for heavy users.
  • Claude Opus 4.7’s tokenization increases per-prompt cost, with a reported 27x multiplier versus earlier models, underscoring how model changes impact budgets.
  • API-based billing is likely to persist, pushing developers toward smaller, task-specific models instead of one giant model for every need.
  • Vit Plus (V+) offers a unified way to manage node versions and package managers (npm, PNPM, Bun) across projects, simplifying local development environments.
  • Corepack helps projects declare their preferred package manager, easing cross-project consistency in environments where npm, PNPM, or Yarn are used.
  • Native browser features (HTML details/summary, customizable selects) can reduce JS bloat; component libraries add complexity, so consider native primitives where possible.
  • Synthetic security incidents and recruitment scams underscore the growing risk surface in AI-enabled tooling and the importance of skepticism and verification in interviews and code access.

Who Is This For?

This episode is essential for JavaScript/TypeScript developers, frontend engineers evaluating AI tooling in daily workflows, and DevOps folks balancing cost and capability in AI-enabled environments. It’s also valuable for interviewers adapting to AI-era assessment strategies and researchers tracking the shift toward native browser primitives versus heavy UI libraries.

Notable Quotes

"GitHub sent out an email saying like we're moving to usagebased billing rather than these like all you can eat subscriptions."
Introduction to the pricing shift under discussion.
"the multipliers which is basically like if you're using these different models here is how much faster you're going to be using it right and like claude opus 46 the multiplier was three the new one is 27"
Illustrates how model changes can explode costs.
"And I think they're sort of looking at how much they're losing on these is not just GitHub but like anthropic had they were testing removing cloud code from the $20 plan"
Points to broader monetization pressure in AI tooling.
"One model does one thing very specifically. It costs way less."
Advocates for smaller, targeted models and modular tooling.
"Focus on the results first and then work backwards from there."
Advice on staying productive amid AI hype.

Questions This Video Answers

  • How does usage-based pricing affect daily AI development costs for small teams?
  • Will Claude Opus 4.7 and similar model updates permanently increase token costs?
  • Should I rely on API billing or look for cloud-only AI access in my projects?
  • What are practical benefits of using Vit Plus for Node version management in multi-project environments?
  • When should I adopt native HTML/CSS primitives over UI component libraries to reduce JS workload?
LLM pricingUsage-based pricingGitHub CopilotClaude Opus 4.7API-based billingVit PluscorepacknpmPNPMBun tooling**? (bun)**; Node version management; CSS linting; CSSKit; browser-native UI primitives; HTML details/summary; accessible UI components; Sentry (observability); security in AI tooling; AI interview strategies; AI agent workflows; UI libraries vs native HTML/CSS
Full Transcript
Welcome to Syntax. We got a Pollock episode for you today. We're talking about everybody is getting hacked. We're going to talk a lot about that. The new LLM usagebased pricing. I think the free lunch is over and the GitHub co-pilot is now 27 times the cost for some of these models, which thousands of dollars, right? Uh the best way to manage your node and package manager versions, we got a little tip for you. You have to get rid of node version manager for good. Why is nobody using standard HTML and CSS over these UI component libraries that ship 16 megs of JavaScript? And finally, a new CSS llinter is on the way. We're excited to hear about it and we're going to detail what we hope and and what that looks like it'll be. Let's get into it. If you have your own questions, we would love to answer them. Please submit them. Go to syntax.fm/potluck m/potluck or just click on potluck in the navbar and you can submit your question or or link or whatever you want us to talk about and and we will cover it on an upcoming website. Keep them coming cuz we love hearing about it. What's up Scott? Good to see you here. Oh, hey man. Uh good to see you as well. It's a it's a fine day. Fine day this morning. Fine day. Lot of stuff's been going on lately. Got lots to talk about. Let's just jump into the first one here, which is a question that says, "What do you think about Copilot's new usagebased pricing?" So, if you didn't see this, you probably got an email about it, but uh GitHub sent out an email saying like we're moving to usagebased billing rather than these like all you can eat subscriptions. And and I think we're starting to see this not just with with GitHub Copilot, but we're seeing it with a lot of people is they didn't nobody realized how much we are going to be using these models, right? Like initially it was like you just type you have tab completion or you you type in the box and you get an answer back and then you copy paste and apply it to thing and now people are just like agent maxing running like 30 at a time. You have all these like sub things going. You're using it to simply people are just using it to simply like ask it to get commit you know like unreal usage that people are using. Yeah. And unfortunately change the background red. Yeah. like yeah change the background but unfortunately this stuff is is very very expensive and for the last I don't know year two years whatever we've been we've been getting heav he heavily subsidized AI models for us and I I think they're sort of looking at how much they're losing on these is not just GitHub but like anthropic had they they were testing removing cloud code from the $20 plan they're really tightening down how much you get on a $200 plan. And and that's not because they're being greedy. It's simply because they're probably bleeding money. They're probably bleeding thousands and thousands of dollars on single people every single day. And the VCs are are sort of picking up the bill for a lot of the stuff right now. But eventually things are are going to have to be paid for. And I know that like I don't know what do you think the computers do you think that the stuff will get cheaper eventually? You know, like computers always get better and and cheaper. Yeah. Yeah. You'd think I mean you'd think so, but it is interesting to see, you know, you know what is it the uh it's not necessarily you could call it a rug pull of sorts, but like I think anybody who's been paying attention could have seen this coming given the progressive movement of all of these companies moving in this direction. And and I remember people talking last year saying, you know, the $200 a month quad code max plan and codeex plans that exist like that as well. Like those aren't going to be here forever. This is like I I saw people saying spend your tokens now because they're going to cost a lot more in the future. And I I mean I think that's really what we're seeing. I don't know if I mean I'm yes obviously uh computing will improve uh we'll be able to use these things for cheaper but better models are going to continue to come out um we saw most recently with the latest Claude Opus 4.7 because of how they're tokenizing it's like using a ton more uh per general prompts and because of that it's not just that the bottle is more expensive or whatever. It's like the actual amount of tokens you're using is more. So therefore, you're going to be spending more. You're Yeah. Anybody who's worked in this stuff will see like the transition into API based billing and that API based billing, that usagebased billing. Yeah. It gets expensive quickly. Yeah. Holy cow. I sometimes I run the numbers on like the tokens that I've used in a single day and I'm like that would have been like 300 bucks in a day you know which is crazy for what you know yeah it's it's nuts and like so GitHub released their like what's it called their multipliers which is basically like if you're using these different models um here is how much faster you're going to be using it right and like claude opus 46 the multiplier was three the new one is 27 so they're saying like this is essentially like multiple times more expensive than than it actually was. And it's absolutely crazy. And I I think one other thing we're going to see with this type of thing is the model providers just simply either making API access unaffordable or just cutting it off entirely because they don't like I don't think anthropic or open wants you using it in a different product. They want you using it in in their product. And we've already seen this like 11 Labs. I love 11 Labs, but like the all the like good features, they've like now locked it into you have to have like a $20 a month plan and then they give you a certain number of credits. I hate that. Like just let me pay for what I'm using and I want to do that because I'm some months I might use $20 and some months I might use none and then I have to like uh Midjourney also like this. I I subscribed to Midjourney again a couple weeks ago just cuz like their image stuff is fantastic and the tooling around transforming or whatever and like Midjourney has no API, right? There's you can't just simply pay. I needed to generate like a whole bunch of backgrounds. I was playing with my green screen. Um and they do the best at like matching the light that's coming on my face. So, I was like, "Oh man, like wouldn't it be cool if I could just like I don't mind paying like $50 to generate a whole bunch of backgrounds once, but I don't want to have this like ongoing thing and then you you're the subscription is over and then you lose all of your images from the the past." I but unfortunately I think that's the way it's going to go. Like I bet we're going to see a cloud in the future where you you simply just cannot use it via an API. You have to you only use it via cloud code. Well, that is pretty much how the the cloud code max play. I I I mean I think the API paying on a token base I don't think that's going away. I think they want you to use that because the way that they've set this up is that if you're paying the $200 a month subscription plan you can only use that in the claude app or claude code whereas before you could use I mean it was always kind of against the terms of service but they weren't enforcing it. You could use that subscription in open code you could use that subscription in pi and and then therefore openclaw and then they they blocked all of that. So now they're forcing if you want to use Claude with those tools, they're forcing you into the API based billing which costs a ton more. So I I think they want you because that's probably the path for them to not be bleeding money on this stuff. You got to think that Microsoft is working on their own model because you can see like cursor is coming out with their own model own model because I bet at some point like cursor is going to not be friends with anthropic anymore and they're going to pull the that model from cursor and then cursor would suck without without that, right? So now they're working on their own own models and you got to think Microsoft is doing that as well. Here's what I think is going to happen. And I think we're all going to get better at using smaller models in more targeted workflows. One model does one things very specifically. It costs way less. It needs to do way less. And we're going to move on from opening up one app and just being like, can you please do this and commit this and then run my checks and do this? Like because you don't need Opus 4.7 to run your test suite. You don't need it to uh run get commit or create a commit message. You can use much smaller models than that. And I think we're going to start to see systems pop up that allow and are based around the idea a really good auto mode some of these tools have. Yes, I like that. Here's a fun question just about syntax. Yeah, y'all seem to have stopped doing the clever ad transitions. Now I hear is that jarring sound bite that introduces the pre-recorded syntax ad. Why did you stop doing these? Does it save time? Was it something syntax preferred? Did y'all get bored of thinking of them? Uh, did you want to make them easier to skip? Because all the ads are the same for the same company now. I may be in the minority, but I really enjoyed and miss the clever transitions. They sometimes made me chuckle and smile on a bad day. Some of my favorite podcasts are the ones with playful ads and ad transitions like uh the climbing podcast on the Enormo cast. I've never heard of it. But yeah, you know what? I'll tell you why. We still do these uh for Century, but we're owned by Century and we don't have any more sponsors. So that's why there's no more different ones. Now, why we don't do maybe fun ones into Sentry often because we're we're we're just kind of forgetting um to even do it. We we want to make sure we mention Sentry. We don't want to be annoying about it and we don't want to insert it into odd spots in each episode, but we do try to do it in a way that is more organic, I feel like. But I think because of that, there's less opportunity to be like, "Oh, we need to do two ad reads an episode. Let me think about this ad read. When am I going to throw it in here? Okay, now you know it just feels different for me for some reason. But DK Donkey Kong, thank you for uh We'll get them in there. You know what? We also have it in there. Scott was always the pro at the transition. I was never very good about it, but I uh I'll get it in there. What do you think our our top issue um number of events is in Sentry right now for the syntax website? Oh, for the syntax website. Yeah, I bet my guess is something with the transcriptions anthropic API key. That is one. So, we had at one point we had had an old version of anthropic summarizing them and it turned out that they when we implemented it was not very good and we need to like just bump it to a better model and maybe make a better prompt and that's that'll be part of the new site. But at that point, we just we stopped doing it. And one of our top errors is invalid request error. Your credit balance is too low. So, we just didn't put any money in the in the machine for that type of thing. And then there's another one. Invalid username password for upsting. Invalid. Wait, is that one When was the last time that one went away though? When was the last time that one triggered? about three minutes ago. Three minutes ago. Okay. I did rotate. It just popped up keys. It came back. You can see in our sentry that it it popped up maybe last week. Looks like you probably fixed it within the last week, right? Well, no. Here's what happened. Uh, you got a regression and sentry is telling us. Well, you know, Verscell got pawned. Um Oh, yeah. And they said to rotate your keys. That was one of the keys. Wes, I have some linear tasks for you to rotate the keys on the providers that you have access to. So, you should probably do that. I rotated my upstression. I got a regression. So, that means something's wrong there. So, I got to fix it. The good news is the fallback for when that's not working is that it just doesn't use the cache. So, hey. Oh, interesting. I think if I'm looking at my Sentry dashboard and looking at the URL that this issue is happening on, it's actually happening on preview URLs. So, I bet that this is not happening. This is probably happening on an older preview URL which has not yet been updated. Maybe it was built with the old keys. That's probably what it is. there we go. Solve the problem in Sentry. Thank you, Sentry. Go to centry.iosax io/s syntax and solve your problems. All right, I want to talk about this. Adib Hana, he posted this crazy story about how he almost got hacked by like a recruiter. So basically, he says, "I had an interview with a crypto recruiter. We talked about 40 for 40 minutes and they asked me to look at some code. Their first instruction was to clone the repo. I didn't. They seemed surprised." So I told him I and I waited a moment to check whether it was safe or not. I ran a quick analysis with Claude. Turns out the code had a back door that would have copied my environmental variables and sent them to the remote server. The recruiter was speechless and ended the call pretty quickly. Be careful. And then he goes on to like post the actual code of like what happened and simply by like cloning this thing and I think it was like a pre-commit but basically it was an Axios call that spread process enven. I thought you had to know the actual key for it. Like I know you can't use object.keys on process.env. Maybe you can, but yeah, it's crazy. There's a little base 64 encoded string which turns out to be like a versell um hosted IP checker. Like it looks like it looks like it was just simply um sending a call to check what your IP was to get the country and to come back, but really it was just an app that was just like logging absolutely everything. And what a crazy crazy story. Um, so certainly be very careful. It feels like this stuff's getting crazier uh in terms of just the amount of things we got to worry about these days in terms of attacks in this regard. And like man, this one is wild in particular. I for a job interview, I don't know if I would have saved myself from this. Um, just because there's like the legitimization of it being a job interview can put you into a backfoot where you are kind of inherently more at ease and trusting because you are asking something of these folks, you know, their time for a job. What's crazy is that the like the guy used his like full face and camera and like all that stuff like not even trying to hide it. Yeah. Oh, that's true actually. Yeah. I mean the ability for bad people to like make things like previously to do bad things on the internet you also had to like know how to code or or employ some people that also wanted to do bad things. But now the bad people can simply just boop boop boop in the box. So careful installing even a lot of this like like Mac, you know how like there's like this like Mac app community, you know, there's Reddits or whatever like check this app out. It like does this thing on the whatever. I just don't feel good about any of these apps that are new in the last like year or 6 months. Like I almost always like look and see like was has this app been around for longer than this? cuz I I don't feel good about these new apps that are vibe coded because somebody can simply just say like here's let's make something useful but also throw a back door in there there and I'm so cuz I am I've been a longtime subscriber to whatever that Mac apps Reddit is and same thing I had to unsubscribe from it lately because of just how many clearly vibecoded apps are there and it's not like I'm inherently like against the idea of somebody using AI to make a desktop app. But in the same regard, it's like there's a lot of people just pushing stuff out and like if you're not installing from the Mac App Store for your I mean, even if you're installing from the Mac App Store, you don't know what's going on, but like you you have to say yes, I approve of this. I accept the risk of installing insecure, potentially insecure software, and you do that because you're so used to apps like that being signed and somewhat trustworthy. But another one that I see is people forking projects that are unmaintained and like like I'll tell you one right now. I use this app called DeskPad and it gives us a virtual monitor and we can use it to record like a smaller screen when we're doing our things and it's it hasn't been maintained in a while and there's one feature which is you can't rotate the virtual display. So I went into the issues, looked for it and then somebody says, "Hey, I am now maintaining this and I I forked it and I I did all these things and probably that was fine." Probably some that was was somebody that did things fine, but I'm just like, do I trust this? You know, I don't I don't necessarily know. Yeah, it feels like it feels like the security thing has gotten really crazy lately. I mean, like everybody lots of stories of Yeah. Yes. Next one from Max. Hey, Scott and Wes. Huge congrats on the 10,000th episode. Thank you, Matt, doing the doing the Apple. Thank you. Thank you. Uh, I still remember listening to the first episode 9 years ago when I was like 15. Thanks for inspiring me to become a web developer. My question, I have always been an early adopter who tries out new tech the second it drops. For example, I was an early cursor and AI chat simple agents in the editor user when they dropped. Recently, I took a gap year and left my home country, Germany, to travel around Australia. I totally unplugged from coding. My only connection to the webdev world was listening to your podcast. Well, thank you. Now, I'm getting back to work and it feels like the landscape has completely shifted. The whole AI agent space exploded while I was gone. Every see, everyone seems to be talking about open code and building these ultra complex agent setups. But not just that, it feels like the whole ecosystem has moved forward a lot. From the first time in my life, I genuinely feel left behind. How do I get back to that cuttingedge state quickly? What is your advice and the best way to catch up on these new workflows to figure out what's actually worth learning? Thanks and greetings from Dan and this is like a whole thing. I actually just gave a keynote on this today about staying up to date with stuff in this world because as we as we march on and every single person that you know is creating an AI agent orchestrator like everybody is like I'm going to I have this really novel idea of creating an agent orchestrator you know something that's never been thought of and uh the thing that often gets ignored is that like browsers are still shipping stuff Like just yesterday, Firefox shipped the ability to use light dark function without Oh, hell yeah. Cuz light dark was just colors and now you can use it with images, too. Man, that feels like exciting to me. And it's so easy to lose track of all of that that progress that's happening in native APIs because we're all built we're all like exploring this whole new world of AI and it's exciting. And I think at the end of the day, you know, you got to like think about what it is that you're actually care about working on. Do you care about working on this AI stuff or do you care about building great experiences for the web? And you need to focus your time and energy on the tools and techniques that will get you to those results rather than worrying about the tech. Worry about the results. And I I think that's something that people really lose in this stuff. And then they lose motivation because it's so overwhelming. There's this new harness or this new model or this new thing and it's like what are we actually building? Are you building anything? Like sometimes I I spend a whole week working on something that is just a tool as a tool for a tool rather than actually building anything useful. And like that that sucks to feel that way. Like wait a second, what am I actually building here? Right? What am I actually need to focus on? So I I would I would say focus on on the results first and then and work backwards from there. Yeah, I think I think that's really important is focus on using this new tech that we have to get you better results. A lot of people are simply just focusing on the harness and whatever that we actually use to to write code. And the frustrating part about that is in in two months a lot of that is unnecessary because it's just been rolled into the the models are just are good at it. One thing I often think about is that so many times there's like, oh, we should have a feature for X, Y, and Z or there should be a button for this. Like I I even went into the cursor um chat and I was like, hey, like it would be nice to have a button for X, Y, and Z. I I forget what it was. And their answer was just ask it to do that. And I was like, oh, damn it. Yeah, you're right. Like don't even need to build that feature because you can simply just ask it to do that. So, it's kind of frustrating that it moves so fast and and what you're excited about one day is is totally gone. And I agree with Scott where you should focus on how do you use this tech to build something that you are excited about or something that you previously couldn't do, something that would that that has interested you in a while. Like the other day, I I found this little Budweiser cup at a thrift store and it has like a little Bluetooth thing. It connects to your phone and it lights up when your team scores and it's like it's like 12 years old or whatever. So, I was like, I bet I can hack this. And I couldn't figure it out because it wasn't standard Bluetooth stuff. I've done quite a bit of web Bluetooth stuff, but I just couldn't crack it and couldn't figure out what commands to send to it. So, I was like, why don't we try like like decompiling the Android app and then so I found it, I gave it to Opus, and it decompiled it. And I was like, that was that was really fun. like that was I I don't think I would have been able to do that without without this or at least in this amount of time. Um so just keep pushing into the different areas that you're excited about. Last thing I want to say about this is I think like everybody is going to be good at using AI because it's you're simply just typing into the box and and it it gives you what you want and and everybody who has these like secret prompts and tricks and lists of skills and all this BS, you're not going to like get ahead in in your career by being that person. I don't think I'm gstacking, man. I'm gstacking. Yeah, exactly. Like those. those things are not like any sort of competitive advantage for this type of thing. My agent my my agent skill says make it good though. Yes. Exactly. You know, that's so frustrating. So like like where you will have have a competitive advantage is is just being able to figure out how to be creative with these things and and figure out how you can actually solve problems with this tech rather than just like I don't know crank out another slopcoded vibe app cuz I've certainly I've built many many of those and then once it's done you feel good in the moment right yeah I'm making something I can't believe I can do this and I often think about how exciting that is for people who can't actually code. If I'm this excited about what I'm building right now, people that have always wanted to build something but couldn't because they couldn't code, that's even even more exciting. But that will wear off eventually. And like the table stakes of being able to build anything is sort of on the table there. Now it's up to you figuring out I don't know what I'm trying to say here. I'm I'm kind of rambling here, but you know, you know what I mean? Like Yeah, we should get Courtney on to talk about this. the psychological damage that some of these dopamine kind of I'm doing something. I'm doing something, you know, like that that man, it really like plays on me too because I really do feel like I'd be doing something sometimes where like I need to take a step back and really think about what I'm actually doing. So, next question from Steven Greg. He says, "I'm interested in your take on using React UI components versus native browser solutions." A specific example base UI's accordion component versus HTML details summary. I'll throw in another example is just like drop downs, customizable drop downs. We now have that in customizable select in the browser, right? It's a select. You can make it look like however you want. I understand that the base UI version is fully battle tested and covers all possible accessibility concerns, but to me it feels like accordion battle tested. It's true though. Sometimes there there's there's edge cases with with accordians. To me, it feels like I'm adding unnecessary JS overhead. I like leaning on native browser behavior when possible. And I generally assume native browser behavior would have no accessibility holes, but this may not be the case. And he goes on to sort of give one example. I think the native browser stuff is is currently being slept on because like Scott said earlier, everybody is so hyped on all this AI stuff. People are not realizing that see we have CSS anchor and customizable select and like we have there's like we we've talked about this on the podcast every week. There's like 30 new things in the last year or so that absolutely nobody is using. You know, like I saw apple.com using CSS anchor and um scroll snap for one of their things. I was like this might be the first time I've seen like a big website actually using a lot of this new native stuff. And it's I think it's made made worse by the LLMs not giving you those things by default. I have to explicitly ask and know I want to use ESS anchor. I want to use customizable select. I want to use a details box. Don't just make your own version of it. Um, you have to explicitly go and ask for all of those things. I think it will get much better once these types of things are sort of they make their way into the the component libraries. I don't think we're going to get rid of component libraries. probably will we won't have a need for some of the components here or there but generally what I think what will happen is we'll get rid of a whole bunch of extra JavaScript and then the shad CN implementation of a lot of these things is simply just going to be some HML with some classes and maybe a little bit of JavaScript here and there um to fill in different interactions that you want. Yeah, I'm going to share my screen for a second. So audio folks uh I'm sorry I'm just warning you this is a quick thing. I just want to ask people what would they rather have in their codebase. This is an accordion mind you this which is what like 15 lines of code for a single accordion or this like what are we doing here? Like the the one is four lines using a details in summary and I get it. Details and summary maybe not the most advanced API. It's an accordion. This base UI drives me nuts. And it's not just because the the guy who does base UI didn't like my tweet that this button could have been a class or this this this component could have been a class. He didn't like that. Uh because apparently we need eight components to do a stinking accordion. Accordion.root accordion item. Accordion header accordion.t trigger. Like I don't know. Is this garbage? No. What is this? But like that those are just like it's composable, right? Like you can if you were to do that compose the accordion trigger outside of the accordion uh route. Why? Like why do we need all of these individual pieces? Because like if if you were actually wanted full customization over the accordion that you just showed me, you would just add more elements, right? And I agree that that's that's where we should be. But you would be adding spans and divs and and all kinds of stuff to make it look like you actually want. And that's why basy has all these different pieces so that you have no the composability. But it I agree it drives me nuts that like this is I have to now know about these 18 different items here cuz these are just like rappers. Accordion.panel but inside of that is the actual HTML. So it's not even taking care of that. Accordion header trigger. Yeah. I mean like yeah I get it. But at the same time that's not for me man. I don't I don't need no I I you know give me give me a link with a class of button verse a button that is a component wrapped up with a class of button or styles baked in whatever I don't know so many of these problems are just like complexity for the sake of it and I don't think they're actually you really think people are sitting around being like you know what I'd like to do super complicated accordion doing that spend my life's work no it's there's a need for for that type of thing or there was at least And and now that we have the primitives in the browser, we don't necessarily need a lot of those or behind the under the hood, that's something we say a lot under the hood, that primitive is should be or hopefully will just be HTML details and summary was added to the browser in 2011. What? Yes. Okay. But it wasn't animatable for the long time. You know, there's all these like uh gotchas where it's like uh it doesn't exactly work that way or you want to open like two at a time or when you open one the other one closes and like those things have been added non 2011, right? We got we got animatable um detail summary in like the last year or so. Sure. That's But even even though I think my biggest rub is less of the fact that it's a React component doing something that HTML can do because that's not a problem. It's that the APIs for these things aren't looked as being streamlinable. Like the APIs are so overly baked. I I I don't for me it's like it just the the what you're getting out of it does not match what you're putting in. And sometimes they're set up to handle every single possible use case under the sun when you may not need that. You can make your own accordion component with details and summary in about 15 seconds, you know. Oh yeah, I agree. Maybe somebody who's an accordion expert send us like a just a problem statement or a design or something like that. I think that'd be a fun video where we try to go off and build it. I probably would like to do the native stuff as well cuz like yeah, it's some of this stuff, especially like when you get into it, you're like, "Now, how do I change this thing?" And you have you're like, "Why am I reading docs for a a glorified div with a click handler on it?" Uh shout out to uh JS Nation and ReactSummit. I'm going to be out there in Amsterdam this summer and my talk is all on well my talk at ReactSummit is uh going to be largely based on this Wes is is is you're going to get shot Scott going to React Summit. No, it's you don't need React for this. You you know hey React is great. It does so much it does so much stuff. does so much good stuff. But this component could have been a div. How about that? Yeah, that that should be the name of it. This component could have been a div. I love it. Hey, I love it. Next one here from Bart Venamman uh of Project Wallace. Hey, web master of project Wallace here. Love it. Web master, thanks for the shout out on episode 9998. Just wanted to let you guys know that we are working on a big style lint plug-in pack for exactly the reasons you guys mentioned on the podcast. Deterministic output, sensible defaults, and more agent ready tools with Wallace related tools. Now, my question, Scott, Clint seems nice. Clint was my little uh CSS linting project I I threw together. Have you looked into CSSKitrs yet? It aims to be a sort of OXC but for CSS. The maintainer The maintainer is Keith. Oh, Keith, I'm so sorry. Is it Circle or Kirk? Uh, C I R K E L. Sorry, Keith. Uh, he works on the Firefox browser. It uses the same CSS parser as Lightning CSS. He also wants to incorporate linting into CSS kit. Looks like you are both in the same boat. Anyways, want to let you know I have not heard about this Bart and I really sincerely appreciate this. I ultimately don't want to be the one who makes this. So if Oh, this is this is a cute little website. So if Keith is working on this, it looks like there is linting. CSS kit lintstyles.css. Very similar based on lightning CSS as well. Analyze for D. Yes. Uh shout out to Bart. Shout out to Project Wallace. One of the coolest CSS projects out there. For those people who don't know, Project Wallace does a great job of analyzing your CSS in all kinds of ways, both as a CLI, but also as a cool little website. So, yeah. Um, no, I haven't seen this, but I love this CSS kit. Two people I want working on this. It's definitely Bart and Keith because these guys I don't know Keith teach. Oh, yeah. Yeah, Keith is I think he he writes a whole bunch of the specs. anytime I ask anything about any future spec, he comes in and and chimes in with it. So, he knows CSS specs super well. Um, okay. Do you know how to pronounce his last name? No. No, I don't know how to pronounce anybody's name. I probably can't pronounce my own name. Oh, I recognize I recognize his face here. Okay, I am. Yes, I know Keith. Sorry, Keith. Uh, I didn't recognize your last name here. Yeah, I'm excited. I'm I I think this is awesome that they're working on it. We We very much need this type of thing, especially as these LM starting to crank out all this slop. We You need these guard rails and these tools that will stop them from adding text, what letter spacing uh 0.2 em to literally every single selector. Background color white. I know white div already. Can we add a um a style lint where it doesn't do that? It doesn't do a a border dash left on on a card when you also have a border radius. You know that little fingernail that the AI puts on everything. There's so many funny AI tells like the little the boxes with the icon and the text. It's like okay, we get it. You said here are my features and it made a little section of the six features that it pulled out of there. Next question from Jay Dog. We've heard a lot of questions about how to best prepare for interviews, especially now with AI age. However, we haven't heard from much from the other perspective. Occasionally, I have to do an interview to vet new potential hires. I was It was never an easy ask to assess someone's skills in a 1-hour technical interview, and now it's even harder. Do you have any thoughts on what to look for as an interviewer and how to assess skills? Yes, we we kind of covered this on a previous episode, but I'll say it again. Um, there's a really good post by someone that said, "Use Composer 1 or 1.5 or use a model that is fast but not very good." Meaning that like you you want to gauge how somebody thinks and tackles and approaches working on a codebase with these tools, right? Because like quite honestly, whether you like it or not, that's that's a skill in itself. But you also don't want them just to simply just like copy paste the requirement, paste it into the box and then sit there for while it while it generates, right? So with with a faster or lower power model, whether it's like composer or Kimmy or something like that, you can get an idea of like people's feedback loops um going back and forth. It doesn't write all of the code for you. So you'll have to kind of jump in there and do do a lot of that type of stuff yourself. I think that that's such a good use case like here here's the model that you're allowed to use. here's the thing that I want you to build. Um, now go at it and I kind of want to see you working on this type of thing because I I don't think you can anymore. I don't think you can judge. Go and do this thing and here is the output. I was thinking about that even with like design design Twitter lately just everybody's ripping everybody off, you know? Everyone's just copying everybody's designs and like you think about that like if you're looking for a designer and you look at their portfolio, like is this something that they've they've come up with? Um, is this a UI that they thought like here's a problem and here's how I solved it with this UI and and here's something beautiful that I made or did they just find something that was was similar, pipe it into some machine and come up with something that is looks kind of similar and is is impressive. So, if I was interviewing a designer, I would almost have to like I don't know. What do you do? Do you you maybe the Figma history? in schools they're doing that now too. You have to write your essay in this one app because they want to be able to like scrub back and forth and see that you actually typed it. Yeah. You didn't just copy and paste it. So, I think that's probably a good one. I also would ask a lot more like um like architectural questions. Um Yes. Because like that's so much of the job now is just like how would you tackle this thing? How would you set this up? How would you do queuing? How would you manage concurrency? uh you know all of those kind of higher level questions which is like how do you design this system so it's not going to fall over in a little bit. How do you how do you build something? Here's another thing that I've been thinking about a lot lately is like how do you how do you build these tools that you can access it on the CLI and in the browser but also maybe make an MCP server, you know, like what's the best way to build like core functionality API and then surface it via these different mediums. Yeah. You know what? You know, I think that is really the the kicker because like coding interviews have always been tough from the start because you're often handling someone's ability to not work in a real environment. It's like, oh, I'm writing this code. I got to, you know, potentially solve a problem that maybe I haven't solved before because I haven't had to encounter those APIs or now I got to think about what those APIs are and maybe I haven't even actually used them before. and and is that going to actually truly determine if I know how to code or if I understand the bigger choices. So to me, like I think a a skilled interviewer can learn so much about someone and what they actually know just diving into those architectural questions or like talking it through more than just being like, "Here, code up this thing." Because like if somebody is BSing you, if they're BSing you, you should be able to determine like, "Hey, I know that's BS. I know it." Right? Like I to me, if you're if you're a skilled interviewer and somebody like has a surface level understanding of something and you're asking them to explain why they would make those choices and get deeper into that stuff. And to me, I don't know if maybe it's just cuz I have a good detector of that, but I can tell when somebody is just like, I read the the cliff notes here and I I haven't actually done it. I've never been in that uh say. Yes. Yeah. It's hard. It's hard because also like there's part of the skill where we do like stumped where it's just like I we know obscure TypeScript facts, but like does that translate into building good web products? No. Sometimes. Yeah. No. No. I say no. I say straight up no because I'm bad at it. I'll say no. You're bad at building web products but good at facts. I'm bad at memorizing facts like that. Like little things here and there. Yeah, I'm better at concepts. Next one here from Neils. Hi Wes and Scott. Still love the show. Well, thank you for still loving the show. I'm the same person that asked the question yesterday about how to handle FOMO. Here's one more. Queezy. Queasy. Okay. Queezy as in like a quiz or queasy as in gross. Yes. Question. It's probably Australian. Quzi. I know that's a bad Australian. Okay. Do you have any best practice suggestions for how to manage your version dependent JavaScript development environments? In particular, I mean node, npm, pnpm, bun, or any other tooling that comes with different versions. I thought we the community had settled on nvm, node version manager, but that manages node together with npm. While it looks like PNPM should be preferred these days, all of my research so far has just left me puzzled with options and a little concrete solutions. Should I just globally yolo install node and PNPM and then fix problems as I might run into them? That's kind of what I do. That's kind of That's kind of what I do, Neils. I just fix them as they they fall in front of me here. Uh I deeply hope the answer is not dev containers piece. Yes. Oh man. Uh I deeply hope that too because all of that stuff just seems like a lot. So for me, what do I do? I uh before I I I you know, it's pretty much P and PM for everything with me and that's just how I manage things. NVM always just has like almost always given me grief at points where I'm like I don't know version is correct and it's telling me it's not a cross pro you know just like little things where I get frustrated one error with npm that it's like something regressed in this version of npm and you have to run this like schmod command and that'll fix it and like it it just comes back all the time and it drives me nut like what's happening here yeah I know so for me but more recently I have been just using VIT plus for everything. Uh, but again, I haven't really gotten into Node version management. It's so funny because so many of my projects I'm just like whatever, use the latest version of Node, use the latest LTS, and then I don't have to worry about it because even though I have a lot of projects, I get to be in control of that and I don't end up having that many Node version issues using older versions of Node. So, I am not the right person. Wes, what do you do? Yes. So, Node has something built in for the package manager aspect of this. It's called core pack. Um, and essentially in your package JSON, you define if you if you ever npm something or PNPM install something, you'll notice that PNPM adds a little package manager property to your package.json. And corpac is this idea that when you have a project, corpac will figure out oh or knows that that project is using npm, pmppm or yarn. I think those are the three that it supports. Yeah, I remember there's a lot of controversy when that first drop. Yeah. Whether that should go in there. Yeah. So those are the the big three, right? So core pack is is kind of a solution to that. But quite honestly, I don't use it, but I do like it when projects ship the support for core pack because it's just like, oh, it it uses yarn. Good. Figure it out. Install the version of yarn that you need and figure out the weird command that you need to run and I don't want to have to like anytime there's a project that's yarn, it's like just yarn start. I'm like I'm dead. I don't it's not going to work. Guaranteed it's not going to work. But if you use Corpack, it kind of just like does that for you, which is really nice. So there's that. But quite honestly, I don't use Corpack all that often. What I use is I use one called N, which is you just go to npm.imn, you can find it. FNM is like the new Rustbased one that seems to everybody is using. We looked at that in the state ofjs episode. It seems like everyone's everyone's using that. But honestly, the V+ is is where you want to be because V+ manages both your environment. So, which version of node do you do you want to use and it manages like your package manager, which is great because you simply just need to type vp start or vpde dev or vp run whatever and it will actually run it for you or vp install. You don't have to think, oh, this project uses npm to install and like that's another weird thing is if you npm install on like a on a pmppm package, it like hangs forever. You don't have to think about any of that. It simply just translates the command to whatever package manager that is using. So, unfortunately, the answer to all of these different tools is just like one tool that like sits on top and and puppeteers all the things. And then it also will change your node version as well. But it will also change the node version just for a specific project which is so good if you have like I often have like my own course thing which needs a specific version of node but then I want to try a lot of the like cutting edge node features so I have to switch in between them as like a global node version and that's annoying because it takes forever. It has to like copy paste pseudo it has to do all those things. So, I've been absolutely loving Vit Plus for for this type of stuff. So, I would say use V+ and that covers almost everything except bun and maybe they'll have bun support in the future. Yeah, I think that's that's as good as an answer as there is. I just stick the version numbers in your package JSON both for your engines, like which node versions you support and your package manager. All right, let's get into some sick picks. I got a sick pick for you, Scott. This is a little amaran light. Um, I know you have a couple of these as well and that's why I initially got my first one. Um, but I have the like big amaran 150C which is just this like the sun monster. And it does different colors and everything like that. And I needed another one that was just like much smaller. Um, just for like kind of like a little bit of sidelight right here. Let me see if I can actually turn it on. There we go. You can hardly see it in there. I need to repoint it a little bit, but this is the Emiran Halo 100X. And if you just need like a slim, it's a couple inches thick light that still takes standard attachments. I think they're they're called like a Bowden mount or something like that. That's what you need because so many people when they're like getting like, "Oh, I wish my webcam was a little bit better." And you go on Amazon and you buy some like newer thing or whatever. those are are okay lights, but they're not like they don't have take standard attachments. They don't have standard inputs. They don't have standard hooks. Um, and then when it comes time to like, oh, I want to add like a little soft box to this, you know, like maybe a tiny little soft box or I want to diffuse it a little bit, then there's like no solution for whatever it is that light that you bought. So, buying, again, I'm a big standards guy. Buying stuff that is standard space is was really important to me. So, I got this little Amaran Halo light and it it does just warm and cool. It I don't think it does colors and it has like a nice little Bluetooth app. That's the one thing I don't like about it is the Bluetooth on my desktop app. I have to restart the app all the time to connect to it. But I really like it cuz you can you can change it warm, cool, you can match the color on your camera, all that type of stuff. I like that. I've never heard of that. They make great lights and I do love my massive one right here. and we've been doing more lighting setups. Well, I don't know if you've seen this, but in Courtney's podcast, Wes, we now have like a multicam setup. And so, I've been like having to really get into lighting and multicam setups now cuz we started doing video for that. So, that's been a whole thing. I got like back lights and side lamps and yeah, it's uh it's a whole thing. Um, I'm going to sick pick a neat a neat a cheap little hack here that I have for keeping my computer screen clean, but also my glasses cuz I'm I'm I you see me I probably fix my hair a whole bunch. I touch my face all the time. I touch my glasses. I'm just kind of a a fidgety guy like that. And uh my glasses get all dirty but also my screen does because I'm always touching it. So I bought this Zeiss lens cleaner. It's a glasses lens cleaner. It's really really uh it's like non-alcohol based. It's water, proprietary detergents, and preservatives. So, who knows what's in this thing, but uh for 12 bucks, you get two of these giant bottles that you will absolutely never run out of. Never. And like I I've been using this thing for so long and it's like not even, you know, 3/4 of the way or like it's still 3/4 of the way full. And I use it to clean my computer screen all the time. I use it to clean my keyboard, wipe it down, but uh trackpad, whatever. And I'm not I'm not going to be the person that says to just use it on your screen cuz who knows if that could remove, but I've been using on my screen now for like 2 years and I have never had any issues with the screen, whatever that what with the uh the screen texture or whatever getting wiped off the nano coating. So either way, screen cleaner, clean your dang screen. Your screens are dirty. And uh I found this stuff works really well. Google to make sure that it's safe for your computer screen, but I I've been using it for my computer screen for years now. So, I have like the Logitech MX Master 3S. Um, and the biggest complaint with this mouse is that it gets like disgusting. Like the the rubber coating on it like disintegrates. And somebody posted that theirs was doing this. I was like, "Yeah, mine's starting to do that, too." And then I like looked at it closer and I was like, "Oh, it's actually just disgusting from me." So, I like grabbed a baby wipe and like cleaned it. I was like, "Oh, this looks so much nicer now." I just assumed it was breaking down, but it was like Cheeto dust and like like bok and all kinds of so bad. Yeah, it's disgusting. People's computers are so great. I used to when I worked doing like a boot camp, like that's all I did all day was I typed on other people's computers and it's just like some people's computers are just so nice and like dialed and other people it's just like what were you eating like sardine oil before you gave this to me? You know, why are your keys like piano black? Yeah. Oh yeah. Okay. So, shout out uh also the uh creator of I believe let's see the creator of better touch tool has a an app called keyboard clean tool that makes it so your keyboard does not register presses. So, what I do is I spritz a little of this on my little microfiber here. I turn on the keyboard clean tool and I and I scrub it down and then my uh keyboard is nice. I try to do that once a week because yeah, there's nothing crazier than seeing some of these nasty piano black disgusting. Yeah, I don't like the way it feels. I get like weird sensory stuff from them. I'm like, All right, that's it for today. Thanks so much for tuning in. Make sure you submit your questions to syntax.fm/potluck and we'll answer on our upcoming Peace. Peace.

Get daily recaps from
Syntax

AI-powered summaries delivered to your inbox. Save hours every week while staying fully informed.