We spent two years building a real-time dashboard with Next.js 13 client components. Everything was useEffect hooks, loading states, race conditions we'd patch on Tuesday and break again Wednesday. Fetch data client-side, cache it badly, refetch on navigation. Classic horror.
Switched to Server Components last year. Real talk: it was messy for about a month. Had to rethink data flow, couldn't use useState in the render function anymore (obviously), and our bundle went from 340KB to 89KB gzipped. The N+1 queries came back immediately though. We went from fetching "dashboard overview" in the browser and then hydrating 8 child components to just selecting what we needed server-side.
Here's the thing: client components are still necessary. We kept them for interactive UI (charts that actually respond to input, modals, form state). But 70% of our component tree is now RSCs. The data flow is boring in the best way possible.
Benchmark that matters: median time to interactive dropped from 2.8s to 1.1s on a 4G connection. No clever optimization, just less JavaScript.
Only downside is Next.js docs are still catching up. Took us a while to realize you can't do client-side auth checks in RSCs, which seems obvious now.
No responses yet.