Enhancing your Static Sites with React Server Components

It was around that time when I was preparing to go to bed, I got a mail in my inbox from the React Alicante team with a subject hinting that my talk had been selected for React Alicante 2024 conference. I was overjoyed as I was patiently waiting for this outcome!

I knew how good React Alicante was. Having seen the quality of talks, speakers, and the wonderful city of Alicante where this conference is held, I was extremely grateful for the fact that I got a chance to present my talk at a conference with such high standards. If you told me 3 years back that I would be speaking at such a conference outside India so soon, I would’ve called it impossible! But as I’ve seen over the years, the web development community is extremely welcoming. (Victoria, if you are reading this, thanks for making it happen!) ❤️

The entire conference was a journey I’ll never forget. From preparing for the travel and my talk, reaching Spain, nervously getting on the stage and presenting my talk fearlessly thanks to the lively audience, and all the places I explored in Alicante with my speaker friends! Thanks to everyone who made it memorable.

About the talk

This talk covered how React Server Components fit in the world of static sites. Nobody in the React community seems to be talking about static sites anymore. With React “server” components, Next.js and Remix going all in on server-rendered sites, and the inactivity of the Gatsby framework, it feels like React is no longer a library of choice for building static sites.

Having played around with React server components in some of my side projects and building multiple static sites(my portfolio is a static site!), I could instantly see how RSCs solved one of the most annoying problems faced while building static sites – data fetching before UI is even sent to the client! Every framework has its own way of dealing with this, and each has its downsides. The way all web UI frameworks converged on abstracting UI as components, we haven’t seen such a rock-solid abstraction yet for data fetching outside React that seamlessly works with React.

React server components in a nut-shell is a way to run async logic before UI is sent to the client. This async logic can be anything from data fetching to heavy computations, build-time processing, and more! What’s interesting is that a lot of what React server components unlock is closely related to what the static site community has been wanting for years. React Frameworks like Next.js and Gatsby had their solutions for data fetching and build-time processing but they always had quirky limitations of being restricted to page-level components, or in the case of Gatsby one occurrence of useStaticQuery() hook per file!

Do give the talk a watch and share your thoughts with me on Twitter.

Post-conf thoughts

As I mentioned at the start, the entire conference was a memorable experience for me. I loved how the audience was very supportive and keen to listen to the talks even when they were right after a break. It was rare to find anyone outside the conference hall when a talk was going on and believe me, this is immensely motivating as a speaker! ❤️ The other talks that I attended were top-notch and I learned a lot not just from the presentations, but also from the way they were presented. Presenting a talk is an art of its own 💯

Alicante is such a beautiful city and it was great fun exploring its beaches and castle with my friends Nikhil and Shivay. I loved learning about Spain and its culture from Daniel during lunch while having Paella – A Spanish dish that I really liked 🇪🇸. The streets of Alicante are so pretty and I had a great time there with all my speaker friends while enjoying some nice street food. The conversations we had were quite insightful and I look forward to meeting them again!

Here’s an extremely small collection of pictures from the conference.