React

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 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! ...

I wasn’t expecting this post to be this long when writing it, but I think it reflects that it’s been a surprisingly thorny challenge of generating unique IDs for HTML elements in React. What looks trivial on the surface “just create a unique string” becomes a complex problem when you factor in (streaming) server-side rendering, (partial) hydration, and accessibility requirements. With React 18’s release, the team finally shipped an official solution: the useId() hook. ...

React 18 launched as a stable release in March, bringing the long-anticipated concurrent rendering engine to production environments. After spending several weeks experiencing it across multiple projects, the performance improvements and developer experience enhancements are visible. What was theoretical in the alpha and beta releases has now proven its worth in real-world applications. Concurrent Rendering: From Theory to Practice In my previous coverage of React 18’s alpha release, I explored the shift from “Concurrent Mode” to “Concurrent React” and the theoretical underpinnings of what makes concurrency special. Now that we’re using it in real applications, let’s see how these concepts translate to practical benefits. ...

Last month, I was working on a client’s React application—a fairly typical dashboard for managing customer information in a marketing services product—when we discovered something alarming. Personal customer data was silently making its way into our Sentry error logs. This discovery kicked off an urgent investigation that revealed some non-obvious ways React applications can leak sensitive data to monitoring tools. Sharing this experience because the it could happen to any team, yet serious enough that it deserves attention. ...