# 0xgf/boneyard **Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/0xgf-boneyard).** 5,970 stars · 235 forks · TypeScript · MIT ## Links - GitHub: https://github.com/0xGF/boneyard - Homepage: https://boneyard.vercel.app/ - awesome-repositories: https://awesome-repositories.com/repository/0xgf-boneyard.md ## Description Auto generated skeleton loading framework ## Tags ### User Interface & Experience - [Build-Time Captures](https://awesome-repositories.com/f/user-interface-experience/skeletons/build-time-captures.md) — Captures real UI layouts at build time to generate pixel-perfect skeleton placeholders for any framework. - [Skeleton Framework Integrations](https://awesome-repositories.com/f/user-interface-experience/component-utilities/ui-frameworks/component-libraries/ui-framework-components/multi-framework-integrations/skeleton-framework-integrations.md) — Ships framework-specific skeleton components for React, Preact, Vue, Svelte, Angular, and React Native. - [Layout Captures](https://awesome-repositories.com/f/user-interface-experience/css-framework-integrations/build-time/layout-captures.md) — Captures exact rendered UI layouts at build time using headless browsers to produce pixel-perfect skeleton data. - [Skeleton Placeholders](https://awesome-repositories.com/f/user-interface-experience/list-views/skeleton-placeholders.md) — Displays automatically generated skeleton screens that match the captured layout, scaling bone positions to the user's font size. ([source](https://cdn.jsdelivr.net/gh/0xgf/boneyard@main/README.md)) - [Loading Skeletons](https://awesome-repositories.com/f/user-interface-experience/loading-skeletons.md) — Generates pixel-perfect skeleton placeholders by capturing real UI layouts at build time for any framework. - [Skeleton Components](https://awesome-repositories.com/f/user-interface-experience/phone-number-inputs/multi-framework-components/skeleton-components.md) — Provides framework-specific skeleton components for React, Preact, Vue, Svelte, Angular, and React Native. ([source](https://cdn.jsdelivr.net/gh/0xgf/boneyard@main/README.md)) - [Incremental Build Caches](https://awesome-repositories.com/f/user-interface-experience/skeletons/incremental-build-caches.md) — Provides incremental build caching that hashes skeletons and recaptures only changed components. ([source](https://boneyard.vercel.app/overview)) - [Multi-Framework Generators](https://awesome-repositories.com/f/user-interface-experience/skeletons/multi-framework-generators.md) — Creates skeleton components for React, Preact, Vue, Svelte, Angular, and React Native from a single capture pipeline. - [Vite Capture Plugins](https://awesome-repositories.com/f/user-interface-experience/skeletons/vite-capture-plugins.md) — Provides a Vite plugin that automatically captures skeleton bones on dev server start and HMR updates. - [Build-Time Captures](https://awesome-repositories.com/f/user-interface-experience/structural-layout-skeletons/build-time-captures.md) — Opens a headless browser or scans a device to snapshot real layouts for pixel-perfect skeleton data. ([source](https://cdn.jsdelivr.net/gh/0xgf/boneyard@main/README.md)) - [Live Layout Captures](https://awesome-repositories.com/f/user-interface-experience/ui-components/feedback-overlay-components/loading-indicators/loading-placeholders/placeholder-generators/live-layout-captures.md) — Captures actual rendered UI layouts at build time to generate pixel-perfect skeleton placeholders. ([source](https://boneyard.vercel.app/agent)) - [Skeleton](https://awesome-repositories.com/f/user-interface-experience/appearance-customizations/skeleton.md) — Controls bone color, animation style, stagger delay, and fade-out transition per skeleton instance. ([source](https://boneyard.vercel.app/features)) - [Skeleton Integrations](https://awesome-repositories.com/f/user-interface-experience/component-architectures/suspense-boundaries/skeleton-integrations.md) — Replaces a Suspense boundary's fallback with a captured skeleton that renders while the async query resolves. ([source](https://cdn.jsdelivr.net/gh/0xgf/boneyard@main/README.md)) - [Skeleton Name Resolvers](https://awesome-repositories.com/f/user-interface-experience/component-name-resolution/skeleton-name-resolvers.md) — Provides a name-based resolver that maps skeleton components to their captured bone data at runtime. ([source](https://boneyard.vercel.app/)) - [Build Configuration Detections](https://awesome-repositories.com/f/user-interface-experience/responsive-breakpoints/build-configuration-detections.md) — Scans the running development server and Tailwind breakpoints during a build command to produce responsive skeleton data. ([source](https://boneyard.vercel.app/)) - [Runtime Adaptations](https://awesome-repositories.com/f/user-interface-experience/responsive-breakpoints/runtime-adaptations.md) — Captures skeleton data at multiple breakpoints and uses ResizeObserver to display the best-matching placeholder. - [Appearance Customizations](https://awesome-repositories.com/f/user-interface-experience/skeletons/appearance-customizations.md) — Controls bone color, animation style, stagger delay, and fade-out transition per skeleton instance. - [Auto-Resolving Registries](https://awesome-repositories.com/f/user-interface-experience/skeletons/auto-resolving-registries.md) — Ships an auto-resolving registry that maps skeleton components to their bone data by name. ([source](https://boneyard.vercel.app/)) - [Responsive Adaptations](https://awesome-repositories.com/f/user-interface-experience/skeletons/responsive-adaptations.md) — Captures skeleton data at multiple breakpoints and adapts to viewport changes at runtime via ResizeObserver. - [Responsive Skeleton Placeholders](https://awesome-repositories.com/f/user-interface-experience/skeletons/responsive-skeleton-placeholders.md) — Captures skeleton data at multiple breakpoints and adapts placeholders to viewport changes via ResizeObserver. ### Part of an Awesome List - [Live Layout Captures](https://awesome-repositories.com/f/awesome-lists/devtools/skeleton-screens/live-layout-captures.md) — Snapshots rendered component layouts at build time to produce pixel-perfect skeleton screens. ([source](https://boneyard.vercel.app/)) - [Skeleton](https://awesome-repositories.com/f/awesome-lists/devtools/animation-and-transitions/loading-animations/shimmer-effects/skeleton.md) — Applies pulsing or shimmering animations to skeleton placeholders to indicate ongoing loading activity. ([source](https://boneyard.vercel.app/demo)) ### Development Tools & Productivity - [Skeleton Build Caches](https://awesome-repositories.com/f/development-tools-productivity/build-tooling/build-performance-optimization/build-optimizations/incremental-build-caches/skeleton-build-caches.md) — Provides incremental build caching that hashes skeletons and recaptures only changed components. - [Skeleton Build Commands](https://awesome-repositories.com/f/development-tools-productivity/cli-build-tools/skeleton-build-commands.md) — Runs a build command that auto-detects the dev server and Tailwind breakpoints, then writes responsive skeleton data as static JSON files. ([source](https://boneyard.vercel.app/)) - [Skeleton Components](https://awesome-repositories.com/f/development-tools-productivity/framework-agnostic-component-scaffolding/skeleton-components.md) — Provides a unified skeleton component that renders captured bone data identically across React, Vue, Svelte, and more. - [Live Layout Captures](https://awesome-repositories.com/f/development-tools-productivity/page-skeleton-generators/live-layout-captures.md) — Captures exact rendered UI layouts at build time to produce pixel-perfect skeleton placeholders. ([source](https://boneyard.vercel.app/demo)) - [Incremental Build Caches](https://awesome-repositories.com/f/development-tools-productivity/build-tooling/build-performance-optimization/build-optimizations/incremental-build-caches.md) — Hashes each skeleton and skips recapturing unchanged components so only modified layouts are re-processed. ([source](https://boneyard.vercel.app/overview)) - [Incremental Build Optimizers](https://awesome-repositories.com/f/development-tools-productivity/incremental-build-optimizers.md) — Hashes each skeleton during the build and skips recapturing unchanged components to speed up subsequent runs. ([source](https://boneyard.vercel.app/)) - [Document Structure Skeletons](https://awesome-repositories.com/f/development-tools-productivity/page-skeleton-generators/document-structure-skeletons.md) — Hashes each skeleton and recaptures only components whose layout has changed, keeping incremental builds fast. ([source](https://boneyard.vercel.app/overview)) ### Networking & Communication - [Skeleton Data Captures](https://awesome-repositories.com/f/networking-communication/programmatic-api-interfaces/skeleton-data-captures.md) — Provides a low-level JavaScript API to snapshot bone data from DOM elements and render skeleton placeholders. ([source](https://boneyard.vercel.app/agent)) ### Web Development - [Auto-Capture Plugins](https://awesome-repositories.com/f/web-development/next-js-development/vite-plugins/auto-capture-plugins.md) — Integrates with Vite to automatically capture skeleton bones on dev server start and re-capture on every HMR update. - [Skeleton Captures](https://awesome-repositories.com/f/web-development/next-js-development/vite-plugins/skeleton-captures.md) — Automatically captures skeleton data on dev server start and re-captures on every HMR update without a separate CLI. ### Data & Databases - [Build Cache Hashing](https://awesome-repositories.com/f/data-databases/hash-tables/incremental-hashing-utilities/build-cache-hashing.md) — Hashes each skeleton component and skips recapturing unchanged layouts during rebuilds for faster builds. ### Software Engineering & Architecture - [Build Configuration Detections](https://awesome-repositories.com/f/software-engineering-architecture/auto-configuration-mechanisms/build-configuration-detections.md) — Scans the running dev server and Tailwind breakpoints during a CLI command to generate responsive skeleton data. ([source](https://boneyard.vercel.app/overview))