last night, I was skimming TanStack Query docs and went down a rabbit hole on its server-side usage with Next.js. What I found is a total gamechanger for performance. @tan_stack 🤯
>it's a pattern that combines server-side prefetching with client-side hydration to practically eliminate initial page load spinners. When you pair it with Server Actions for mutations, your app feels insanely fast.
here's how it works, a Thread 🧵
(1/n) Comparison:
>the old way (Client-Side Fetching):
You go to a restaurant and sit down. Only then do you call the waiter, place your order, and wait for the kitchen to cook and bring you your food. That "waiting for your food" part is the loading spinner your user sees.
>the new way (This Pattern):
You pre-order your meal online. When you arrive at the restaurant, the food is already on your table, hot and ready to eat. No waiting! This is what we're giving our user an instant experience.
a thread 🧵
We will be correlating it with some real life example to understand it better.
In this case we will take a example of you visiting a restaurant to have some food.