Innovative Skeleton Loaders for Enhanced User Experience

Skelly provides skeleton loaders that intelligently adapt to your UI. Unlike traditional methods, skelly measures your actual DOM structure at runtime and remembers it. This ensures that subsequent loads display a skeleton that precisely matches your real layout, eliminating guesswork and the need for manual regeneration.

• No Build Step Required: Integrate skelly seamlessly without any build process modifications.
• Runtime Measurement: Skeletons are generated based on your live UI, ensuring accuracy.
• Automatic Regeneration: Skelly automatically re-learns and updates skeletons when your markup changes, preventing staleness.
• Framework Agnostic Core: The core library is vanilla JavaScript (2.1 kB gzipped) with thin adapters for popular frameworks like React, Vue, and Svelte.
• SSR and Streaming Support: Deliver skeletons from the first byte for an instant perceived load time, without hydration flashes.
• Visual Options: Choose from various loading animations like 'Shimmer' (GPU-composited sweep) and 'Pulse' (quieter animation suitable for dense tables).
• Accessibility: All animations respect the prefers-reduced-motion setting.
• Developer Productivity: Streamline your development workflow by replacing hand-rolled, often out-of-sync, placeholder components with a single, adaptive solution.

Skelly is designed to improve perceived performance and user experience by providing accurate, dynamic skeleton screens that feel instant and require minimal developer effort.