Front-End Fire

This episode kicks off with the new Deno 2 release candidate. V2 boasts improved dependency management, updates to the APIs and CLI, and improved CommonJS support because even though ESM is the future, so much good stuff in the JS ecosystem still runs on CJS. 

Web Components take a big step forward in terms of wider spread adoption with the adoption of the Declarative Shadow DOM by all major browsers back in August. The Shadow DOM (a Web Components standard) provides a way to scope CSS styles to a specific DOM subtree and isolate the subtree so the element can be reused without fear of script conflicts or unexpected CSS cascades. But it only worked on the client side. The Declarative Shadow DOM removes this limitation and now things like SSR, streaming data, and server rendering styles are possible.

Because the web development world can never be without some good drama going down, we now present for your viewing pleasure: the drama between WordPress and WP Engine.

News:

• Paige - Declarative Shadow DOM for Web Components
• Jack - Deno 2 release candidate
• TJ - Wordpress vs WP Engine drama

Bonus News:

• We’re on Bluesky now @front-end-fire.com! Follow us!
• Cloudflare AI Audit
• OpenAI departures
• State of HTML survey

Fire Starters:

• autocomplete attribute

What Makes Us Happy this Week:

• Paige - Stuff You Should Know podcast
• Jack - Actual typewriters at The Type Space store
• TJ - Detroit Tigers

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 Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire
• Follow us on Bluesky @front-end-fire.com

Tanner Linsley, creator of TanStack Query and TanStack Router, continues expanding the Tanner-verse with a new TanStack Start framework. It’s a full-stack React framework powered by TanStack Router, Vinxi, and Vite, and boasts all the mainstays of a JavaScript framework today, including SSR, streaming, server function support, RPCs, and more. 

With the release of the new Apple operating system, iOS 18, comes new updates to the Safari browser and its WebKit rendering engine. A couple notable highlights for Safari 18 are “distraction control” where users can hide distracting items on web pages like sign-in banners, cookie preference popups, and newsletter signup overlays, and iPhone mirroring and remote inspection.

And the Astro team is at it again with the release of Astro 5.0 beta. This new release introduces the Astro Content Layer, a flexible, extensible way to interact with content in Astro, no matter where it comes from. 

And for the Fire Starters section of the show this week we learn more about the writingsuggestions attribute. 

News:

• Paige - TanStack Start
• Jack - Astro 5.0 Beta Release
• TJ - WebKit Features in Safari 18.0

Bonus News:

• Next.js SaaS starter

Fire Starters:

• writingsuggestions attribute

What Makes Us Happy this Week:

• Paige - Bad Monkey show and Carl Hiaasen books in general
• Jack - iOS 18 and Sony Alpha 7C II - Full-frame interchangeable Lens Hybrid Camera
• TJ - Bookshelves 

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 Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

Big news this week when it’s announced that OpenAI, the company behind ChatGPT, has moved ChatGPT from using Next.js to using Remix. While both metaframeworks rely on React under the hood, Remix seems a bit less opinionated about how teams might want to structure their projects to best suit their unique use cases and needs.

TypeScript has also released v5.6, and amongst the many improvements is one many day-to-day TS users will benefit from: disallowed nullish and truthy checks. Although the name sounds impressive and confusing, what it boils down to is: if TS identifies an if statement that will always evaluate to true or false because a dev forgot to actually invoke a function or misplaced parentheses or [insert many, many ways we introduce bugs into our code], TypeScript will now throw an error. 

Because the JavaScript gods demand at least one new framework or meta-framework each week, this week’s tribute is HonoX. We previously discussed new framework Hono back in episode 32, when it debuted as a lightweight framework built on web standards and able to run on any JS runtime, and now it’s back with meta-framework HonoX.

And the team introduces a new segment this week called Fire Starters. Each week we’ll try to find a more obscure bit of HTML, CSS or JS info from around the web, and talk about it so we can all learn something new. The first topic is CSS property initial-letter.

News:

• Paige - HonoX meta-framework
• Jack - OpenAI moves ChatGPT from React to Remix
• TJ - TypeScript 5.6

Bonus News:

• OpenAI o1-preview
• Vinxi is another alternative RSC server

Fire Starters:

• initial-letter

What Makes Us Happy this Week:

• Paige - The Offer miniseries
• Jack - The Lord of the Rings: The Rings of Power series 
• TJ - The Perfect Couple limited series

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 Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

Kicking off the discussion is the release of Vue 3.5. Although it’s not a major release, Vue 3.5 packs some great new features and optimizations like: reactivity system improvements (up to 56% less memory usage for apps than before), reactive prop destructuring stabilization (it’s simpler to declare props with default values), and SSR improvements like lazy hydration for async components.

RedwoodJS is also out with a new version, and 8.0 packs a wallop. It makes RedwoodJS the third framework to support React Server Components behind Next.js and Waku.

The shadcn CLI has gotten an update as well where it can spin up a brand new Next.js app with shadcn and Tailwind configured and ready to go. Additionally, shadcn has integrated more tightly with Vercel’s v0 AI code generator, and now every shadcn component is editable on v0, so users can customize the components in natural language and paste it into their apps afterwards. Pretty amazing!

The TC39 Committee responsible for evaluating what new features get added to the JavaScript language has added a new intermediate step for proposals: step 2.7. By the time new proposals reach step 3, they must already have full test suites to support their implementation, and if, for any reason, they must go back to step 2 to rethink things, a lot of that work can be for naught.

News:

• Paige - Vue 3.5 is out
• Jack - RedwoodJS 8.0 and shadcn CLI updates
• TJ - JavaScript Standard Gets an Extra Stage
  • List of ECMAScript proposals on GitHub

Bonus News:

• Laravel raises $57 million series A
• SSR benchmark wars update (author Matteo is the Fastify lead maintainer)

What Makes Us Happy this Week:

• Paige - House of the Dragon season 2
• Jack - Raspberry Pi 
• TJ - Linkin Park is back!

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 Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

We’ve got a good show for you today! It’s chock full of new build tools, better date handling in JavaScript, and SSR benchmarks to prove which framework is truly the fastest.

The rust-ification of JavaScript build tools continues, as next generation build tool Rspack hits v1 and claims it’s ready for primetime. Rspack boasts (almost) complete compatibility with the webpack API while also being 10x faster.

JS dates are about to be fixed thanks to the new Temporal API proposal, which is currently in stage 3 of the TC39 process of adding new features to the JavaScript language.

A new benchmark war has erupted online: this time benchmarking which JavaScript SSR frameworks are the fastest. Benchmarking results are dubious at best because everyone’s application is different, and has different requirements, but this one got a lot of heat due to the author using an LLM to generate the code to run in these different frameworks (React, Vue, Svelte, Solid, Fastify, etc). 

Finally, the CSS Survey 2024 is out now! Fill it out, be amazed at how much more there is to CSS than you previously thought, and write in Front-end Fire in the podcast section of the survey if you like our show. We greatly appreciate it!

News:

• Paige - Rspack v1.0
• Jack - The SSR benchmark wars of 2024 begin
• TJ - Temporal Dates Coming to JavaScript and temporal polyfill

Bonus News:

• CSS Survey 2024 — write in Front-End Fire!

What Makes Us Happy this Week:

• Paige - Photoroom photo editing app
• Jack - 1password password manager
• TJ - Bench power supply

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 Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

On this week’s episode, a new software licensing term has emerged in the development world: Fair Source Software (FSS). 

The error and exception tracking software company Sentry added some legal protections to their Codecov product last year (they are a business trying to earn money, after all), which technically meant it was no longer open source. In order to keep sharing its code with the community, Sentry created a new “Fair Source” licensing category that shares similar values to open source, but also allows companies to enforce non-compete clauses to protect its business interests.

In other news, even though the React Native framework is already 10 years old, the team just launched v0.75. While this isn’t a major release, it lays the groundwork for v1 by reporting that the “new architecture” required for support of new React 18+ features like Suspense, synchronous layouts, and concurrent rendering is now stable.

News:

• Paige - React Native reaches 0.75
• TJ - Fair Source Software (FSS) license

What Makes Us Happy this Week:

• Paige - Origins Crisp Citrus Hand Cream
• TJ - Risky Business Podcast

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 Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

AI is the main topic of conversation for this week’s episode. Between continued advancements in the technology and governments trying to put safeguards in place to prevent a Terminator-style future, there’s plenty going on.

OpenAI has introduced a new feature of its API called “structured outputs,” which essentially lets developers pass in a valid JSON schema that guarantees the model will always generate responses that adhere to it. No omission of required keys, no extra values you weren’t expecting, no need for strongly worded prompts to achieve consistent formatting.

On the flip side, the European Union has introduced the first legislation to develop safe and trustworthy AI within its borders. This legislation includes a 4 tier risk classification system for all AI products ranging from minimal risk to unacceptable risk, and a 3+ year timeline for companies developing AI products to comply with these new regulations.

The React core team announces the changes to Suspense will delay the release of React 19 for a bit longer than originally planned, but should ultimately lead to a better end user experience for devs and library authors alike.

And the news rounds out with a game of “guess the CSS usage statistics” compiled by Chrome’s anonymous usage statistics. Ever wondered what percentage of websites are styling scrollbars, or how many set height? Not to mention the amount of CSS properties we’ve never heard of before: font-synthesis-small-caps, anyone?

News:

• Paige - EU rolls out first-ever legal framework for AI
• Jack - OpenAI Structured Outputs
• TJ - Chrome CSS usage statistics

Bonus News:

• React 19 release delayed

What Makes Us Happy this Week:

• Paige - Deadpool & Wolverine movie
• Jack - Facebook Marketplace
• TJ - The Lord of the Rings film series

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 Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

This week’s episode kicks off with an announcement that Node 22.6 has experimental TypeScript support! 

What you might not realize unless you read the fine print though, is that this isn’t the sort of TS support you might assume. Instead, the feature strips type annotations from .ts files, allowing them to run without transforming TS-specific syntax.

Tauri, a competitor to Electron for building cross-platform desktop apps, just released a stable release candidate of Tauri 2. Tauri promises lower memory usage and CPU usage by taking advantage of a system’s native webview on the frontend and using Rust on the backend.

A new acronym is sweeping the JavaScript world: e18e - or Ecosystem Performance. E18e is focused on improving JS package performance, by removing redundant dependencies in old packages or replacing them with more modern alternatives, improving the performance of widely used packages, and building modern alternatives to outdated packages.

News:

• Paige - e18e initiative
• Jack - Node 22.6 with experimental TypeScript support
• TJ - Tauri 2.0 RC

Bonus News:

• Courts rule Google is a monopolist in the search world

What Makes Us Happy this Week:

• Paige - Charisma towels from CostCo
• Jack - The Old Man TV series and Bad Sisters TV series
• TJ - A Good Girl’s Guide to Murder TV series

Google is making headline news once again as it reverses course on a decision to block third-party cookies in its Chrome browser. After years of testing, planning, and delays, Google scrapped a plan to turn off third-party cookie tracking by default like Safari and Firefox already do.

In other news, the annual CSS Working Group meeting wrapped up recently, and some of the exciting features the group will be focusing on this year include: the if() statement for conditional styling, cross document view transitions without the need for a JavaScript library, and (perhaps the most anticipated feature) cleaner, easier CSS anchor positioning. 

Vercel introduces feature flags in Next.js and SvelteKit with Vercel’s Flags SDK. The Flags SDK works with any feature flag provider, and sits between the application and the source of the flags to help devs follow best practices for using feature flags, while keeping websites fast.

And finally, Reddit has doubled down on blocking search engine crawlers from surfacing new posts and comments in recent weeks, and as of now, Google is the only mainstream search engine that’s made a deal that will allow it to index new search results when users search for posts on Reddit.

News:

• Paige - Exciting new CSS features coming out of this year’s CSSWG meeting
• Jack - Feature Flag Support from Vercel
• TJ - Chrome’s is no longer removing third-party cookies

Bonus News:

• Reddit is now blocking all non-Google search engines and AI bots
• All the video talks from React Conf 2024 are available

What Makes Us Happy this Week:

• Paige - Apple Watch SE
• Jack - 3D printing (Autodesk Fusion 360 program)
• TJ - 2024 Paris Olympics

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 Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire

Web development survey results season is upon us, so this week’s episode covers two of the newly released survey results: the State of React survey 2023 and Stack Overflow Developer Survey 2024.

Just over 13,000 developers filled out the State of React survey, and the results were quite interesting. React devs are fans of component libraries like MUI (Material UI) and shadc/n, state management libraries like Zustand, and data fetching libraries like TanStack Query. They gripe about well-known Hook footguns like useEffect(), useMemo(), and useCallback(). And features like React Server Components and the use() Hook are still largely untested by the community, although many devs have heard of them.

The more all encompassing development survey from Stack Overflow received 65,000 responses this year, providing some very cool insights about the larger developer world beyond the bounds of React.

It’s fascinating to watch the trends starting to catch on or die down in the web development space year over year, and we highly encourage everyone to take a look at the survey results. There will probably be some surprise in store.

News:

• State of React Survey 2023
• Stack Overflow Developer Survey 2024

What Makes Us Happy this Week:

• Paige - NeilMed Sinus Rinse Kit
• Jack - Logitech Spotlight Presentation Remote
• TJ - Electric fly swatter

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 Tweet us on X @front_end_fire.

• Front-end Fire website
• Blue Collar Coder on YouTube
• Blue Collar Coder on Discord
• Reach out via email
• Tweet at us on X @front_end_fire