Vue.js: Custom Elements and Reactivity Polish Party

Transcript

Hey there, Vue developers! Welcome back to another episode of the Vue.js podcast. I'm absolutely buzzing this morning because we've got some fantastic updates to dive into from March 9th, 2026. Grab your favorite beverage and let's talk about what's been happening in the Vue ecosystem.

So we've got a really exciting release today - Vue 3.5.30 just dropped, and wow, what a productive day it's been! We're looking at 10 merged pull requests and 10 additional commits. That's the kind of momentum that makes my developer heart sing.

Let me tell you the story of today, because there's definitely a theme emerging here. If I had to give this release a subtitle, it would be "The Custom Elements and Reactivity Polish Party." About half of our merged PRs are tackling custom elements, which tells me the Vue team is really doubling down on making Vue play nicely with web standards. And honestly, that's exactly what we want to see.

Edison is absolutely on fire today - they've got their fingerprints on several major fixes. The biggest one that caught my attention is this custom element styling fix. You know how frustrating it can be when component styles don't inject in the right order? Well, Edison tackled that head-on with PR 13374. They've implemented a whole new system that tracks per-component insertion anchors to make sure child styles come before parent styles. It's one of those fixes that sounds simple but required touching four different files and adding 237 lines of carefully crafted code.

But Edison didn't stop there. They also fixed this gnarly SSR issue where watchers were firing after async setup - you know, one of those edge cases that can drive you absolutely bonkers when you're trying to debug it. The fix was elegant though, just 18 lines of new code to preserve and restore SSR setup state correctly.

Now let's talk about some community love, because we've got some fantastic contributions from folks who are clearly paying attention to the details. Inottn caught this subtle bug with the reduce method on reactive arrays. You'd expect your reactive arrays to stay reactive even after reducing, right? Well, they weren't always, and now they are. It's exactly the kind of fix that makes Vue feel more intuitive.

And speaking of reactivity - and this is where it gets really interesting - we had two separate contributors, shengxj1 and Edison, working on Set-related reactivity issues. These aren't the flashiest fixes, but they're so important for making Vue's reactivity system rock-solid. When you're dealing with Sets that contain reactive values, there were some edge cases around duplicates that could trip you up. Not anymore.

The custom elements story continues with lejunyang contributing two really thoughtful fixes. One handles shadow DOM scenarios better - because let's face it, shadow DOM can be tricky - and the other ensures that custom elements patch their props correctly. These are the kinds of improvements that make Vue custom elements feel like first-class citizens in any web application.

Oh, and here's a nice quality-of-life improvement from cyrilf - Vue will now warn you if you try to use a negative number in v-for. No more mysterious "Invalid array length" errors in your console. Sometimes the best fixes are the ones that help us catch our own mistakes earlier.

What I love about today's activity is how it shows the Vue ecosystem maturing. We're not just adding flashy new features - we're polishing the rough edges, making TypeScript integration smoother, and ensuring that Vue works beautifully with web standards like custom elements.

Today's focus should be on exploring these improvements if you're working with custom elements or complex reactivity patterns. If you've been hesitant to use Vue custom elements in production, this might be the release that changes your mind.

That's a wrap on today's Vue update! Keep building amazing things, keep contributing to this incredible ecosystem, and remember - every bug fix makes Vue better for all of us. Until next time, happy coding!