මම Next.js 14 App Router පාවිච්චි කරලා "Dashboard" එකක් හදනවා. ඒකේ User ගේ Profile එකේ දත්ත පෙන්වන්න මම useEffect සහ fetch පාවිච්චි කරනවා. හැබැයි මට ප්‍රශ්න දෙකක් තියෙනවා: පිටුව Load වෙද්දී දත්ත එනකන් මුකුත් පේන්නේ නැහැ, ඒක නිසා User ට හිතෙන්නේ App එක වැඩ කරන්නේ නැහැ කියලා. සමහර වෙලාවට මට "Hydration failed" error එකක් එනවා මම Client-side එකේ විතරක් තියෙන දත්ත (LocalStorage වගේ) Render කරන්න හැදුවොත්. මගේ දැනට තියෙන Code එක: 'use client'; import { useState, useEffect } from 'react'; export default function Profile() { const [user, setUser] = useState(null); useEffect(() => { fetch('/api/user') .then(res => res.json()) .then(data => setUser(data)); }, []); // දත්ත එනකන් මේක හිස්ව පේනවා (Empty screen) if (!user) return null; return <div>Welcome, {user.name}!</div>; } මට දැනගන්න අවශ්‍ය දේ: දත්ත එනකන් User ට ලස්සනට "Loading State" එකක් (Skeleton Loader එකක් වගේ) පෙන්වන්නේ කොහොමද? Next.js වල Suspense පාවිච්චි කරලා මේක මීට වඩා හොඳට කරන්න පුළුවන්ද? Server-side එකේදීම මේ දත්ත ටික අරගෙන පෙන්වන එක (Server Components) මීට වඩා හොඳද?