Loading states (skeletons, nav progress)
Generated from
mcp/patterns.registry.json— do not edit by hand; change the registry and runbun run patterns:build.
Index card — the docs below are the canonical explanation; deep-tier pattern pages additionally carry invariants and emulation notes.
Category: App Shell & Navigation · Tier: light · Risk: low — structural pattern, no external services
Defines visual feedback for initial load, navigation, data fetch, action, and streaming states using skeleton screens and a navigation progress bar.
When to use: Reach for it when a page or component needs perceived-performance feedback while data or a route is loading.
Docs
Code
src/lib/components/primitives/skeleton/(GitHub · GitLab)src/lib/components/shell/NavigationProgress.svelte(GitHub · GitLab)
Machine-readable record: app-shell-loading-states in mcp/patterns.registry.json.