The debate between “traditional” JavaScript frameworks like React and emerging HTML-centric approaches like HTMX has been heating up in recent months. Rather than adding to the noise with abstract comparisons, I decided to build the same interactive component using both technologies to see how they really stack up in practice. The Toy Project: An Interactive Syntax Highlighter For this comparison, I wanted something more interesting than the usual todo app, but still focused enough to make a fair comparison. I settled on creating an interactive code syntax highlighter with the following features: ...

Introduction When building real-time web applications, WebSockets often grab the spotlight. They promise robust, bidirectional communication and are frequently the default choice discussed in architecture meetings and tech talks. Meanwhile, Server-Sent Events (SSE) sits quietly in the corner, a powerful but frequently overlooked standard that deserves more serious consideration than it typically receives, especially for specific, common use cases. I recently worked on a analytics project where the initial requirement was “real-time updates, so we need WebSockets.” It’s a common refrain. However, after digging into the actual need… streaming analytics updates to the browser with absolutely no requirement for client-to-server messages over that channel, we pivoted to SSE. The outcome? A noticeably simpler backend, less resource consumption, and a more straightforward codebase to maintain. ...

With the Bun reached 1.0 last year and recent release of Bun 1.1, JavaScript developers have a lot to be excited about. Windows support is a big headline feature, but there are several less-heralded improvements that make daily development significantly smoother. Today, we’ll explore two standout features: the built-in SQLite database and the Bun Shell API. To showcase these features in action, we’ll build a simple coffee consumption tracker. It’s a toy example that demonstrates how these tools simplify everyday development tasks. ...

Introduction When building full-stack applications with Next.js, one of the architectural decisions we’ve been grappling with lately is choosing between Server Actions and API Routes for server-side logic. With Server Actions becoming stable in Next.js 14, I’ve been experimenting with both approaches across different projects. I thought I’d share some observations from my recent experiences. Your mileage may vary, and I’d love to learn on how others are approaching this decision! ...

The Evolving Nature of Web Vitals For web perf professionals, ones become familiar with Google’s Core Web Vitals. These metrics have fundamentally changed how we approach performance optimization, shifting focus from technical measurements to metrics that better reflect real user experiences. As real-world usage patterns evolve and browser capabilities advance, these metrics need to evolve too. That’s the role Interaction to Next Paint (INP) plays. Announced earlier this year, INP is Google’s experimental metric designed to better measure a page’s overall responsiveness to user interactions. More importantly, it’s positioned to replace First Input Delay (FID) as a Core Web Vital next year, so understanding it now will give you a significant head start. ...