JS One Liners

In this Hasty Treat, Scott and Wes talk about some Javascript one liners that speed up your coding experience in one line.

Sponsor - Linode

Whether you’re working on a personal project or managing enterprise infrastructure, you deserve simple, affordable, and accessible cloud computing solutions that allow you to take your project to the next level. Simplify your cloud infrastructure with Linode’s Linux virtual machines and develop, deploy, and scale your modern applications faster and easier. Get started on Linode today with a $100 in free credit for listeners of Syntax. You can find all the details at linode.com/syntax. Linode has 11 global data centers and provides 24/7/365 human support with no tiers or hand-offs regardless of your plan size. In addition to shared and dedicated compute instances, you can use your $100 in credit on S3-compatible object storage, Managed Kubernetes, and more. Visit linode.com/syntax and click on the “Create Free Account” button to get started.

Sponsor - Sentry

If you want to know what’s happening with your code, track errors and monitor performance with Sentry. Sentry’s Application Monitoring platform helps developers see performance issues, fix errors faster, and optimize their code health. Cut your time on error resolution from hours to minutes. It works with any language and integrates with dozens of other services. Syntax listeners new to Sentry can get two months for free by visiting Sentry.io and using the coupon code TASTYTREAT during sign up.

Show Notes
  • 00:24:12 Welcome
  • 01:24:11 Sponsor: Linode
  • 02:11:02 Sponsor: Sentry
  • 03:54:18 Twitter ask for One Liners
  • 04:24:05 Math random const getPsuedoID =() => Math.floor(Math.random() * 1e15);
  • 05:43:09 Random color
  • Paul Irish random color '#'+Math.floor(Math.random()*16777215).toString(16);
  • 06:41:06 Console.log as an object. console.log({ dog, person }); VS Marketplace Link
  • 08:29:17 Edit anything document.designMode = "on"
  • 10:15:15 Temporal date export const today = Temporal.Now.plainDateISO();
  • 11:44:05 Console(log) const myFunc = (age) ⇒ console.log(age) || updateAge()
  • 13:26:13 Remove a prop const { propToRemove, ...rest } = obj;
  • 15:29:01 PHP style debugging preElement.innerText ={JSON.stringify(val, '', ' ')}`
  • 16:31:00 First and Last Destructure var {0: first, length, [length - 1]: last} = [1,2,3];
  • 17:34:17 Speed up audio video document.querySelector('audio, video’).playbackRate = 2
  • Overcast
  • 19:44:15 Sleep function let sleep = (time = 0) => new Promise(r => setTimeout(r, time))
  • 20:26:00 If statements on one line If (!thing) return 'something'
Tweet us your tasty treats

Oppdag Premium

Prøv 14 dager gratis

Prøv gratis
Arrow Right

Episoder(898)

898: Every Developer Needs a 3D Printer

898: Every Developer Needs a 3D Printer

Wes and Scott talk all things 3D printing—from fixing every day items to organizing tools, printing gadgets, and even teaching their kids entrepreneurship. Show Notes 00:00 Welcome to Syntax! 03:34 Brought to you by Sentry.io 05:03 Practical uses of 3D printing 07:34 Creating tools for organization Gridfinity 10:33 Improving and adapting everyday items Underware 14:34 The benefits of printing something vs buying it 15:32 Choosing the right 3D printer Bamboo Lab Elegoo Prusa Flashorge 25:26 Projects and ideas Multiboard 31:33 Filament types and their uses 40:05 Finding affordable filament Deal Forager 46:07 Where to find 3D models Maker World yeggi Printables Thangs Thingverse 48:08 Creating your own 3D models Fusion Shapr3D Onshape 53:00 Modifying existing 3D models 54:30 Coding in 3D printing Bento shards ManifoldCAD Hunyuan3D-2mv-Turbo Mecagent 01:01:25 Sick Picks + Shameless Plugs Sick Picks Scott: Alaska Bear Organic Silk Sleep Mask Wes: BLV - AMS Riser Shameless Plugs Syntax YouTube Channel 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

30 Apr 1h 5min

897: Making Your App Feel Faster Than It Really Is

897: Making Your App Feel Faster Than It Really Is

Scott and Wes break down the tricks and techniques for making your app feel blazing fast—even when it’s not. From optimistic UI to preload-on-hover, it’s all about perception, not just performance. Show Notes 00:00 Welcome to Syntax! 01:12 Brought to you by Sentry.io. 02:34 Mousedown or pointerdown events. 06:00 UI animations should be fast. 08:00 Animations should not block interaction. 08:20 Animations should be cancellable / reversible. 10:50 Optimistic UI. 12:37 Local Data. 13:36 Delay loading indicators. 14:40 Page loading indicators. 15:47 Preload on hover. 17:13 Calculate mouse trajectory. 18:51 Full page spinner on every change. 20:04 Pixelated spinners. 20:23 Skeleton loaders. 23:43 Photo frames. 25:52 Search on input instead of search on click. 26:46 Progress loaders than move in between steps. 27:31 Community submissions. 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

28 Apr 35min

896: Do I Still Need To Know JS/CSS/HTML with AI? × How To Sell An App × Is React Context Bad? × More

896: Do I Still Need To Know JS/CSS/HTML with AI? × How To Sell An App × Is React Context Bad? × More

23 Apr 53min

895: React Server Components: Where are we at?

895: React Server Components: Where are we at?

Scott and Wes break down the current state of React Server Components — what they are, how they work, and why they’re so controversial. From framework support to bundling complexity, it’s everything you need to know about RSC in 2025. Show Notes 00:00 Welcome to Syntax! 01:01 Brought to you by Sentry.io. 01:55 What exactly are React Server Components? 02:18 Server components rendering. 03:17 Server components are async. 03:45 Server components can be suspended. 05:05 Server components send RSC payloads to the browser. 06:08 This feels like HTMX? 06:54 Client components are still server rendered. 07:58 Server Functions. 08:52 useActionState. 09:12 Frameworks and React Platforms. 09:16 NextJS. 09:42 Waku. 12:26 candycode.com Daishi Kato 14:23 React Router. Michael Jackson Tweet. 19:29 Vite. vite-plugin-react-server 20:54 Tanstack. Syntax Ep 833. 22:39 Bun. 23:01 DIY. 23:39 Why so much hate? 25:28 I want it my way. 27:46 React Server Components lock-in. 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

21 Apr 30min

894: Open Source Matters w/ Chad Whitacre

894: Open Source Matters w/ Chad Whitacre

Wes and Scott talk with Chad Whitacre, the newest member of the Syntax team, about all things open source—licenses, controversies, economics, and ethics. Chad breaks down what most people misunderstand, and how companies can support sustainable software development the right way. Show Notes 00:00 Welcome to Syntax! 00:39 Meet Chad Whitacre 03:39 Chad’s retro headphones Retrospekt 05:00 Chad’s role at Syntax https://syntax.fm/oss Open Path 09:41 What do people get wrong about open source? 11:11 Why is open source so divisive? 13:01 The evolution of open source and free software 17:55 Single vendor vs. community open source 20:22 How do people build businesses off of a GPL license? 24:40 What’s the most pure version of open source? 26:55 Fair source licensing explained 30:30 Brought to you by Sentry.io 33:09 Should you be concerned about dependencies in your app in relation to licensing? Fair Source 35:16 What’s the most interesting/unusual open source license? Beerware License 40:00 What is Open Source Pledge? Open Source Pledge 45:41 Choosing the right open source license 48:31 Wes’ most popular open source project wait 49:39 Interesting open source projects Mercedes-Benz embraces Open Source Porsche Open Source Platform 51:33 Licensing for educational content 53:46 The beauty of open source Plausible 56:12 Scott’s various open source projects 56:44 The importance of contributing to open source projects 59:16 Sick Picks + Shameless Plugs Sick Picks Chad: Save The Cat! Shameless Plugs Chad: Coming soon 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

16 Apr 1h 1min

893: Everyone Is Talking About MCP

893: Everyone Is Talking About MCP

Scott and Wes break down the Model Context Protocol (MCP), a new open standard that gives AI agents secure, tool-like access to your dev environment. They cover how it works, why it’s a big deal for AI coding workflows, and real-world use cases like GitHub, Sentry, and YouTube. Show Notes 00:00 Welcome to Syntax! 00:49 The lore of ICP. Wes MCP Shirt. 03:09 Brought to you by Sentry.io. 03:33 What is MCP? 05:06 The steps of AI coding. 07:11 MCP hosts. 07:28 MCP clients. 07:35 MCP servers. 08:24 Why you might want to do this. 10:39 How this works in VS Code. 14:10 Wes built an MCP server. SVGL. 14:57 Playwright. 17:24 Sentry’s implementation. Building Sentry’s MCP with David Cramer. 18:54 YouTube implementation. 21:19 DaVinci Resolve implementation. Smithery. 23:02 Postgres. 24:40 Transport protocols. 24:49 STDIO. 25:19 SSE. 25:32 Streaming. 26:24 Writing you own MCP server. 26:28 FastMCP. 27:00 Cloudflare. 28:01 Data validation. 28:47 Standard schema. Episode 873. 29:27 Other parts of MCP. 29:35 MCP resources. 30:37 MCP prompts. 30:48 MCP roots. 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

14 Apr 33min

892: The History of Syntax

892: The History of Syntax

Wes and Scott talk about the origins of Syntax, sharing how a friendly course name conflict led to a mastermind group, then a podcast, and eventually a full-blown media brand. They also reflect on key milestones, from early episodes and sponsorships to joining Sentry, expanding the team, and what’s next. Show Notes 00:00 Welcome to Syntax! 00:51 How Wes and Scott met Scott Tolinski & The Origins of LevelUpTuts LevelUpTutorials WesBos.com 09:31 How Syntax got its name Episode 001: React Tools 15:30 Getting sponsors Delicious Brains FreshBooks 18:53 Hasty Treats and expanding the show 22:36 Adding interviews to Syntax SVGs with Sara Soueidan 23:38 Syntax’s first live show Live at JAMstack_conf 27:58 Brought to you by Sentry.io 28:34 Acquisition by Sentry 600th Episode! Major Announcement and Swag Giveaway! 33:56 Hiring a producer Randy Rektor 36:39 Transitioning to video and growing the team Rating and ROASTING Coding Desk Setups CJ Reynolds Kaitlin Bloom 41:47 Launching the merch store Sentry.shop 46:01 The future of Syntax 47:23 Sick Picks + Shameless Plugs Sick Picks Scott: Crucial X10 Pro 4TB Portable SSD Wes: MONVICT Cordless Glue Gun Shameless Plugs Syntax YouTube Channel 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

9 Apr 55min

891: Light and Dark Mode

891: Light and Dark Mode

Light mode? Dark mode? Scott and Wes break down the best ways to implement theme switching in CSS, from prefers-color-scheme to manual overrides. Plus, tips on handling shadows, icons, and the dreaded flash of dark mode! Show Notes 00:00 Welcome to Syntax! 01:05 Brought to you by Sentry.io. 02:06 Light and dark mode, things to consider. 02:31 Light and dark mode from scratch. drop-in.css. 04:41 Calculations vs assigned color. 05:32 color-mix and relative color. 08:15 Foreground and background variables. –tint-or-shade: color-mix(in oklab, var(–fg), transparent 95%); –tint-or-shade-harder: color-mix(in oklab, var(–fg), transparent 90%); 09:13 Setting color scheme. 12:38 light-dark function in CSS. 15:48 Manually setting dark mode. 18:43 The challenges with shared caching. 19:33 Tailwind CSS implementation. Tailwind dark-mode. 19:52 Shoehorning in dark mode. 22:25 Other things to consider. 22:28 Color contrast. Lea Verou contrast-color. 24:39 Logos. 25:22 Icons and images. 26:20 Accessibility. Polypane. 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

7 Apr 27min

Prøv gratis for å se alle episoder
Arrow right

Reklamefrie Premium-podkaster

Hør populære podkaster som Storefri med Mikkel og Herman, Ida med hjertet i hånden, Krimpodden og mye mye mer

Skap din egen podkastboble

I appen skaper du ditt eget bibliotek med favoritter, og vi gir deg også anbefalinger til podkaster du ikke kan gå glipp av.

Prøv 14 dager gratis

Dersom du er ny Podme-bruker får du 14 dager gratis prøveperiode når du oppretter abonnement

Podme Premium

kr 99/mnd

  • Tilgang til alle våre Premium-podkaster
  • Alle podkaster fra VG, Aftenposten, BT og SA
  • Premiuminnhold er alltid uten reklame
  • Ingen bindingstid. Avslutt når du ønsker
Prøv 14 dager gratis

Historiene og stemmene du vil høre

Ubegrenset tilgang til alle dine favorittpodkaster

Les mer
Arrow Right