loading.tsx 754 B

123456789101112131415161718192021222324
  1. // /stock 진입/네비게이션 시 즉시 노출되는 Suspense 스켈레톤 — 서버 렌더 대기 중 "멈춤" 체감 제거.
  2. export default function Loading()
  3. {
  4. return (
  5. <div className='w-full p-4 space-y-4 animate-pulse' aria-hidden='true'>
  6. <div className='space-y-2'>
  7. <div className='h-8 w-24 rounded bg-gray-500/15' />
  8. <div className='h-4 w-40 rounded bg-gray-500/10' />
  9. </div>
  10. <div className='flex gap-2'>
  11. {Array.from({ length: 4 }).map((_, i) => (
  12. <div key={i} className='h-8 w-16 rounded bg-gray-500/10' />
  13. ))}
  14. </div>
  15. <div className='space-y-2 mt-2'>
  16. {Array.from({ length: 12 }).map((_, i) => (
  17. <div key={i} className='h-11 w-full rounded bg-gray-500/10' />
  18. ))}
  19. </div>
  20. </div>
  21. );
  22. }