The People's Bundler

We are sad to announce that we fired our CEO this weekend after Mr. Bytens (the cat from Cool Bits) staged a boardroom coup — and not a metaphorical coup, like an actual physical coup that took place inside our boardroom. (There was so much blood.)

Today’s issue: Web libraries to revive your DJ career, tasty SVG sprites from McDonald’s, and one man’s quest to help you finally learn modern CSS.

Welcome to #241.

---

The People’s Bundler™️ gets an upgrade

The Vite team released Vite 5 on Thursday — but it didn’t get to enjoy the limelight for long before Twitter exploded with the OpenAI-fires-Sama saga.

Vite 5 didn’t pack quite as much drama as The Social Network 2.0, but it did include some key updates that help set the stage for The People’s Bundler™️ to continue its supersonic growth (4x YOY increase in weekly downloads and counting 🤯).

So if you missed the Vite 5 announcement because you spent the last 72 hours watching multiple YouTubers read the same OpenAI blog post on camera and pretend to say something insightful were busy, here are the highlights:

• Cleaning up the API — Vite 5 removes several deprecated features (like the CJS Node API) and closes various long-standing issues. This dirty work helps future-proof Vite, improves stability, and lays the groundwork for its upcoming “rustification” with Rolldown.

• Perf upgrades — The most notable one is upgrading to Rollup 4, which noticeably improves build performance. They also added some new options for improving your dev server performance.

• Minor DX changes — worker.plugins is now a function, dev and preview HTML serving are now aligned, and SSR externalized modules are simpler to work with.

Bottom Line: This release feels kind of like cleaning up your house before you have a bunch of people over for a party — it’s not the most exciting thing in the world, but we’ll probably be grateful for it once Vite starts adding in Rolldown and other major improvements.

Regardless, this focus on stability and performance should give us even more confidence that Vite is going to be around for the long haul.

---

Clerk gives you auth superpowers for React apps

That’s probably why it feels like every React developer talks about it non-stop on Twitter.

But Clerk gives you way more than just a few auth APIs — it gives you a set of customizable components with everything you need to onboard users and let them manage their accounts.

These components play nice with any tech stack, but they come with some uniquely powerful features for Next.js and React:

• First-class support for RSC and App Router, so you can use server actions and route handlers for your auth (see docs)

• Custom hooks for both the client and the server that let you read session and user data

• An authMiddleware() helper that makes it easy to integrate Clerk features through Next.js middleware

Check out their surprisingly generous free tier, to start mooching trying it out for yourself.

---

const getCapitalizedInitials = (name) =>
  name
    .trim()
    .split(" ")
    .forEach((name) => name.charAt(0))
    .join("")
    .toUpperCase()

---

1. In the 127th most exciting piece of AI news this week, you can now use GitHub Copilot in the CLI.

2. Ahmad Shadeed wrote an article about CSS Nesting, because he has sworn an oath to make sure that you personally understand how to use every new CSS feature. Don’t let him down.

3. CarbonQA created a high-quality QA services for dev teams that provides a team of dedicated, US-based QA testers, so you can always catch bugs before they break prod — without ever QA testing your own apps again. [sponsored]

4. The Chrome Team just released some new features for the Angular NgOptimizedImage directive. It might not be the catchiest name in the world, but it is a name in the world.

5. Bun v1.0.13 adds support for Vite 5, Rollup 4, and the "node:http2" module, which unblocks gRPC in Bun.

6. Libav.js is a compilation of the libraries that provide a pure JavaScript and WebAssembly system for low-level audio and video encoding, decoding, muxing, demuxing, and filtering. You’re officially out of excuses for not resuming your DJ career.

7. Jesse Pence created this in-depth series of articles and videos on React Server Components to help you understand how they work and what problems they solve.

8. Alex Anderson created svg-icons-cli, a command line tool for creating SVG sprite sheets and rendering them with a React Icon component.

9. Vladyslav Zubko wrote about why JavaScript Naming Conventions are Important.

10. Addy Osmani wrote about how psychological safety is the most important dynamic for effective engineering teams. That’s why I’ve reduced the number of times I prank my team members with an elaborate stunt based on their deepest personal fears to no more than once a month.

---

We’re treating forEach as if it returned an array, when it actually returns undefined. Instead, we want to use map, which works similar to forEach, but also creates and returns a new array.

const getCapitalizedInitials = (name) =>
  name
    .trim()
    .split(" ")
    .map((name) => name.charAt(0))
    .join("")
    .toUpperCase()