There’s something oddly beautiful about squeezing every drop of performance out of a web app, especially when you know it’s going to be used in places where devices aren’t flagship, networks are flaky, and every kilobyte matters. That’s the context I was dealing with.
But this isn’t a sob story about limitations. It’s a love letter to Preact — the tiny framework that punched far above its weight when it mattered most.
💭 The Crossroads: React, Angular, Vue… or Something Else?
At first, I did what most devs do: I reached for the usual suspects.
- React? Familiar, powerful, a massive ecosystem. But a bit… heavy.
- Angular? I’m actually pretty well-versed in Angular. But even I can admit it’s more of a battleship than a kayak.
- Vue? Elegant, but still not quite featherweight enough for what I was about to build.
I needed something faster. Leaner. Closer to the metal — something that didn’t assume high-end devices or blazing-fast networks. That’s when I stumbled (again) into Preact.
And this time, I didn’t just kick the tires — I hit the gas.
⚡ Preact: Like React, But on a Diet (The Good Kind)
If you’ve never tried Preact, it’s like React’s minimalist cousin who drinks cold brew, runs marathons, and never seems to sweat.
The entire runtime is just 3kB gzipped. No joke. That’s smaller than most people’s CSS resets.
And yet, Preact is:
- Component-based
- Supports JSX
- Has a solid hooks API
- Works with Vite like a dream
- And best of all, it’s basically React-compatible (enough for 90% of use cases)
It took me less than a day to get productive with it. My mental model from React transferred over almost perfectly. But the performance gains? Tangible.
🧪 Real-World Edge: Where Preact Shines
The app I was building (can’t say too much about it yet) had to run:
- On mobile browsers, including older iPhones and low-cost Androids
- Offline, with local machine learning inference
- With zero noticeable lag and minimum power drain
I couldn’t afford React’s bundle size or Angular’s lifecycle overhead. I needed something surgical. And that’s where Preact made me smile.
Startup times were snappy. Memory use was low. The app felt native — even when running on underpowered hardware.
🤝 The Dev Experience: Surprisingly Smooth
You’d expect trade-offs, right? But honestly, 90% of the time, I forgot I wasn’t using React.
- With Vite + Preact, hot reloads were instant.
- Tailwind CSS plugged right in.
- shadcn/ui took a bit of wrangling but worked beautifully once paths were sorted.
There were a few moments where I had to double-check if a library was truly compatible with Preact (some aren’t). But for a greenfield project, I had full control. And the payoff? Totally worth it.
🧠 What I Learned
- Less can be more — especially when you’re building for everyone, not just modern desktops.
- Familiar tooling + lighter runtime = better performance without worse DX.
- Preact is not a compromise — it’s a very conscious design decision.
🎯 Would I Use It Again?
For this kind of project? In a heartbeat.
For a heavy enterprise dashboard with 40 third-party libraries? Maybe not. But for apps that demand speed, responsiveness, and mobile-first sensibility, Preact is an ace up the sleeve.
TL;DR: If you’re building for the edge, or just want to feel like you’re cheating physics a little — give Preact a spin. You might be surprised how far 3 kilobytes can take you.
Leave a Reply