darula-hpp/shimmer-from-structure

Health v2 · maintenance only

Adoption not part of the score

1112 stars · 19 forks observed · 2026-08-28

What it is AI-extracted, prompt v1, taxonomy v1, 2026-08-30, confidence not recorded

A structure-aware skeleton loader library that automatically generates shimmer loading states by measuring your rendered UI at runtime, eliminating the need to maintain duplicate skeleton components. It provides dedicated adapters for React, Vue, Svelte, Angular, and SolidJS.

Use cases

• generate skeleton loading states automatically
• add shimmer effect to components while loading
• avoid maintaining duplicate skeleton components
• show loading placeholders that match real layout
• skeleton loader for react vue svelte angular
• auto-detect border radius for shimmer blocks
• loading state for dynamic data components

When to choose

• you want skeleton loaders without hand-writing skeleton components
• your layouts change often and skeleton maintenance is a burden
• you use React, Vue, Svelte, Angular, or SolidJS and want a tiny bundle
• you need shimmer states that adapt to responsive layouts and dynamic content

When to avoid

• you need fully custom-designed skeleton screens with specific placeholder shapes
• your app doesn't use one of the supported frameworks
• you prefer static skeleton markup for maximum control or SSR-first rendering
• runtime DOM measurement overhead is unacceptable for your performance budget

Facets

library · maturity active

ui-components frontend-framework animation frontend web-development developer-tools browser cross-platform skeleton-loading shimmer-effect loading-placeholder react vue svelte angular solidjs typescript developer-experience nodejs

Member repositories

For agents

markdown · JSON · MCP: product_card(name="darula-hpp/shimmer-from-structure")