REST Countries API built with Astro

What challenges did you encounter, and how did you overcome them?

While tackling this challenge, I made the decision to incorporate Astro’s transitions (morph) to enhance the user experience and give it a more app-like feel. To my surprise, the implementation worked exceptionally well, exceeding my initial expectations. However, this positive experience was limited to a scenario where I was working with a simple dataset that displayed only one region on the screen.

As soon as I attempted to fetch data for all countries, significant issues began to surface. The flickering between light and dark modes took nearly a second to resolve, along with delays in every other feature that relied on client-side JavaScript. In an effort to mitigate these problems, I explored various solutions. Unfortunately, none of my approaches proved effective in handling such a large volume of data.

Realizing that further attempts might lead to diminishing returns, I ultimately decided to remove the transitions altogether. Once I did so, everything functioned smoothly again.