Skip to content
Get Started

Benchmarks // reproducible evidence

Measure what we can prove.

Velora does not publish fixed FPS marketing. This page tracks objective integration metrics and documents the methodology for future frame-time studies. Showcase UI scripts (inspector, matrix) are tooling — they do not drive motion.

Numbers below come from /data/benchmarks.json — built with @velora/css dist, not marketing FPS slides.

Verified today

Objective claims

Table hydrates on scroll — compare Velora motion-core (0 KB animation runtime) vs typical JS runtimes in the Evidence column.

Metric Velora motion-core Typical JS runtime Evidence
Loading generated metrics…

Methodology (draft)

Before any FPS claim

Integration cost is measurable today; frame-time studies need the pinned scenario checklist below.

@import "@velora/css/motion-core";
/* shipped pages: vl-* only — no animation runtime JS */
Required

Hardware profile, browser + version, display refresh rate, pinned scenario URL, scroll distance, warm-up passes, and trace export (Performance panel).

Compare

Same DOM scenario across Velora CSS, vanilla CSS, IntersectionObserver choreography and GSAP + ScrollTrigger — identical content, identical scroll length.

Metrics

Transferred JS, animation-specific JS, main-thread scripting time, long tasks, dropped frames (trace), memory — not headline FPS alone.

Distribution + harness

Generated evidence

Metrics load from /data/benchmarks.json (built with @velora/css dist).

Reproduce locally: pnpm verify:contract && pnpm test:e2e — then inspect packages/css/dist/manifest.json for bundle sizes.

CDN snippet (after npm publish):

<link rel="stylesheet" href="https://cdn.example/@velora/css/motion-core.css" />
<!-- optional: @velora/css/theme for Skins -->

Publish checklist: docs/project/PUBLISH.md · Run: pnpm verify:contract && pnpm test:e2e