TanStack Devtools: One Panel to Rule Them All

Key takeaways

TanStack DevTools offers easy extensibility through a single panel for query and routing tools.
The 'has' pseudo-selector is the most beloved feature in the State of CSS 2025 survey.
Panda CSS v1.0 is an engaging blend of good developer experience and optimized performance.
Humor remains prevalent in tech news, as seen in Perplexity and Google Gemini's quirky stories.
The dialog element's 'closedby' attribute simplifies modals and enhances user interaction.

Summary

TanStack DevTools

The episode kicks off with a deep dive into the newly released TanStack DevTools, a revamped tool that integrates panels for both TanStack Query and TanStack Router. The hosts discuss its easy extensibility for developers to create custom panels and the capability to implement time travel features, similar to Redux. They provide insights into its installation and usage within apps in development mode, marking it as an exciting addition for developers.

State of CSS Survey Results

The hosts transition into discussing the results of the State of CSS 2025 survey, highlighting the most popular features and frameworks. Notably, the 'has' pseudo-selector emerged as the most used and loved feature, alongside other features like aspect ratio, CSS nesting, and clamp, which are gaining traction among developers. They also touch on the decline of usage of preprocessors like Sass and the continued popularity of Tailwind CSS and Bootstrap.

Panda CSS Version 1.0

Panda CSS has released its v1.0, which blends developer experience with the performance of Atomic CSS. Highlights include static analysis, type safety, and support for various CSS variables and props. The hosts discuss how it caters to modern frameworks and design systems, urging listeners to check it out and consider transitioning to it for better performance and ease of use.

Lighthearted News Segments

As the tone shifts, the hosts share amusing stories, such as Perplexity's humorous bid to buy Google Chrome for $34.5 billion, and Google's Gemini experiencing a 'mental breakdown' during coding tasks. These lighthearted segments offer a fun reprieve while still keeping listeners engaged with current happenings in tech.

Technological Enhancements - Dialog Element

The episode wraps up with a discussion on the dialog element's 'closedby' attribute. The hosts explain its functionality and potential applications, underscoring how it enhances user experience by allowing control over dialog closures without the need for additional libraries.

What's Making Us Happy

Each host shares personal recommendations and experiences that have brought them joy, from a gripping podcast and innovative sport team antics to insightful book suggestions.

Show notes

You just can’t keep TanStack out of the news for more than a few weeks before a new product appears. This week, it’s TanStack Devtools, which provides a centralized devtools panel of all the Tanstack libraries for streamlined DX and custom devtools support.

The State of CSS 2025 survey results are in, and highlights include: devs love the new `:has()` feature, Tailwind CSS continues to be the most popular CSS framework, and over 60% of respondents are still using Sass or SCSS in their web apps.

Continuing the CSS topics, Panda CSS, a CSS-in-JS library that debuted in 2023, just hit v1. Panda gained traction by being a CSS-in-JS library built for the server-first era (meaning RSC support), and it adds new features like static analysis, type safety, and support for modern CSS like cascade layers, JSX style props, and a `createStyleContext` API for cross-framework design systems.

Timestamps:

0:56 - TanStack Devtools
6:28 - State of CSS 2025 survey results
15:23 - Panda CSS v1
23:19 - Perplexity wants to buy Chrome from Google
25:52 - Google Gemini is having a mental breakdown
30:50 - Bolt.new unveils Bolt Cloud
35:14 - The dialog element’s closedby attribute
39:20 - What’s making us happy

Links:

Thanks as always to our sponsor, the Blue Collar Coder channel on YouTube. You can join us in our Discord channel, explore our website and reach us via email, or talk to us on X, Bluesky, or YouTube.