Shimmer From Structure: a JavaScript library that generates skeleton loaders by analyzing your component's runtime structure.
The library measures your actual component DOM and creates matching shimmer effects automatically. This eliminates the need to build separate skeleton components and keep them synchronized with layout changes.
Key features:
- Works with React, Vue, and Svelte
- Measures components at runtime through DOM analysis
- Detects CSS border-radius automatically
- Injects template data for dynamic components
- Independent loading states per section
The library exports dedicated framework adapters that hook into component lifecycles.
Each adapter measures visible elements through getBoundingClientRect and generates absolutely positioned shimmer blocks that match your layout.
Check it out if you need skeleton loaders that adapt to component changes automatically.
π Blog Post
π GitHub Repo
Top comments (0)