Loading...
Loading...
Found 2 Skills
When building Next.js App Router pages with data loading, slow fetches, or Suspense, generate loading.tsx using shadcn/ui Skeleton placeholders for instant loading UI. Always install shadcn skeleton component first if not present. Use for dashboards, lists, profiles, forms.
Use when an SPA or SSR app flashes the wrong UI before client-side data resolves — an app-shell skeleton shown to visitors who get bounced to login, a results skeleton before "no results found", a light-theme flash before dark mode, a generic placeholder that swaps to something jarringly different. Covers resolving state at the edge/server, optimistic hint cookies, redirect-back (returnTo) flows, and how to test the loading window.