underground, indie JavaScript APIs

Today we’ve got the CSS Electoral College, Vite without one mention of it rhyming with feet, and some open source Bacon.

Welcome to #146.

The Main Thing

When you spend your weekend upgrading your bundler

Vite 4.0 is here for the holidays

You know those days where you get hungry right after you eat breakfast, and end up eating lunch second breakfast at 9:30am? Well, that’s the same energy Vite has when it comes to major releases.

Just five months after their last major release, they released Vite v4 last week — and it didn’t feel very noteworthy at first. There are a few minor improvements like new support for SWC, but this release was mostly focused on upgrading to the latest version of Rollup to improve Vite’s internals.

The bigger story here is how Vite is now on its fourth major version in its first two years of existence. I know you need to break a few eggs in order to make omelets — but the big question for Vite is, was this upgrade worth yet another breaking change? Let’s examine.

The case against breaking changes:

• Migrations suck: Getting stuck in upgrade hell is like being stuck on a rollercoaster that you volunteered to get on but now it’s against social norms to complain because after all, it was free and the operator is just doing their best but also you’re not feeling well and someone in front of you just threw up while the person behind you is mumbling something about SemVer. If upgrading a build tool like Vite becomes too painful, developers will eventually stop upgrading or switch to something else.

• Ecosystem churn: When a tool like Vite makes a breaking change, plugin authors need to release updates, which churns the whole ecosystem. No one can escape.

• Kills momentum: Vite has gone from 1m weekly downloads to over 2.5m in the last five months. Breaking changes risk killing some of that momentum and stranding various projects on different versions.

On the other hand…

• The timing was right: Vite 4’s breaking changes were pretty mild, and they timed their release for that “my-PM-is-still-on-vacation-and-I-don’t-know-what-to-work-on” gap between Thanksgiving and Christmas. It’s the most wonderful time of the year to do a little upgrade maintenance.

• Go with the flow: The Rollup 3 release already has plugin authors thinking about how to upgrade, and since Vite exposes Rollup’s plugin API, the whole ecosystem upgraded without leaving anyone behind.

• Investing for the future: Given Vite’s explosive growth, this could be a good moment for them to take a breath and get their foundation ready for the long run.

Bottom line: We all hate breaking changes. But with frameworks like SvelteKit, Astro, Nuxt, and others all building on top of Vite, putting in a little bit of work on the foundation seems like a good idea to support this next wave of growth.

Our Friends
(With Benefits)

"You built all of this in an hour? Incredible."

FusionAuth is the holy grail

Trying to build authentication from scratch is like trying to hold in diarrhea while meeting your future in-laws — it’s painful, complicated, and you’re one wrong step away from a complete disaster.

That’s why we’re huge fans of FusionAuth.

They’re a complete auth solution that takes care of all the gross stuff like SSO, MFA, WebAuthn, user management, and security — and if you don’t know what one or more of these things are… you probably need it.

Their Free Community version is surprisingly robust (no credit card, no limits, and it’s free forever if you self host 🙏). That makes it great to learn with or use for side projects, but it also has a pretty seamless integration process for existing apps.

And if you ever get stuck, you can call their support line and talk to an actual engineer who really knows auth — instead of just typing your questions into a support chat box that no one will read (like some other auth companies I know).

Check it out and never worry about auth again.

The Job Board

	Senior Full Stack Engineer
	Remote friendly TS $160-210k
	Motion is looking for experienced TypeScript engineers to build the next generation of productivity tools. You'll inform key frontend architectural decisions that help Motion scale the next 2 order of magnitudes, create delightful user-facing features, and improve application performance. We are an ambitious team of 15 people distributed remotely across North America.

Pop Quiz

Sponsored by Sanity Studio

Sanity is offering a boosted free plan of their new studio product with increased API and bandwidth limits for all Bytes readers.

In what order will the logs below show up in the console?

console.log('First')

setTimeout(function () {
  console.log('Second')
}, 0)

new Promise(function (res) {
  res('Third')
}).then(console.log)

console.log('Fourth')

Cool Bits

1. The CSS Working Group wants you to help them chose the best syntax to use for CSS nesting. I’m a little surprised they decided to use the electoral college format, but I guess it makes sense that people in Florida and Ohio get to decide the outcome of every popular vote from now until the end of time.

2. If you’ve ever felt bogged down by the limitations of your CMS, check out Sanity Studio — an open-source, single-page application that you can fully tailor to your project’s needs using their new studio customization framework. And they’re offering a boosted free plan to all Bytes readers right now ✨[sponsored]

3. Evan Bacon (from the Expo Core Team) just open-sourced his own React Native MDX library for an upcoming Expo project. I just hope he was able to pull an Adam Neumann and sell the trademark back to Expo for a few million.

4. In JavaScript APIs You Don’t Know About, Juan breaks down some underground, indie JS APIs you’re probably not familiar with. I’m more of a mainstream JS API guy myself but to each their own.

5. Htmx is a library that allows you to access modern browser features directly from HTML, rather than using JavaScript. As an author of a JavaScript newsletter, sounds terrible.

6. Gautier Ben Aïm wrote about how he and his team rebuilt their whole email stack from scratch and rendered their emails with SvelteKit. Now that sounds like a fun company holiday party.

7. Marius Obert wrote a helpful comparison piece of JavaScript backend frameworks like Next, Nust, Nuxt, Nest, Nextest, and Nuxter.

8. Our friends at Remotion just launched Github Unwrapped, a site that generates a personalized year in review video based on your Github contribution history.

Pop Quiz: Answer

Sponsored by Sanity Studio

In what order will the logs below show up in the console?

console.log('First')

setTimeout(function () {
  console.log('Second')
}, 0)

new Promise(function (res) {
  res('Third')
}).then(console.log)

console.log('Fourth')

The answer is First, Fourth, Third, Second.

To fully understand this one you need an understanding of JavaScript’s event loop. Specifically, the Call Stack, Task Queue, Web APIs (for setTimeout), and the Job Queue. You could watch this video, which is perhaps the most famous JS conference talk ever given. Or you could just, not do that and enjoy your Monday instead - no judgement here.