✨ ELA LABS - SMART SKELETON✨
A collection of smart, reusable components focused on real-world performance and UX.
Installation •
Usage •
How it Works •
Examples •
Documentation •
Contributing •
License
🧪 About
ELA LABS is an open source initiative to create lightweight and intelligent UI components.
We aim to bridge real-world DOM behavior with developer ergonomics — making things that just work across devices and layouts.
🚧 Work in Progress
This is just the beginning. More components are coming soon!
💡 Components
🦴 SmartSkeleton
The SmartSkeleton
is a smart skeleton loading component that adapts to the real DOM structure and styles.
It’s designed to balance performance, reusability, and compatibility, using:
getComputedStyle
for style extraction
getBoundingClientRect
for size measurement
- A style cache (via
WeakMap
) for performance
- Dynamic event listeners (
resize
, scroll
, mutation
) when in responsive
mode
- Simple shimmer via
skeleton-shimmer
class
📚 Documentation
📦 Installation
Each component in the ELA LABS collection is published independently, allowing you to install only what you need.
To install a specific component, refer to its individual installation guide in the documentation.
📘 Full docs available at: https://ela-labs-react.vercel.app
For example, to install SmartSkeleton:
pnpm install @ela-labs/smart-skeleton
npm install @ela-labs/smart-skeleton
yarn add @ela-labs/smart-skeleton