GalaxyJS is an open-source, zero-dependency JavaScript engine: 60 hand-tuned cosmic canvas animations plus a scoped UI kit, about 20 kB gzipped, that drops into any page with a single script tag and one call, Galaxy.create('quasar', canvasEl).

What makes GalaxyJS different from other animation libraries?

It is framework-free and dependency-free — it works in React, Vue, or plain HTML with no build step. Sixty animations share a single requestAnimationFrame loop, every canvas is HiDPI-aware and auto-pauses when scrolled offscreen, and the whole engine is around 20 kB gzipped.

What does zero-dependency mean here?

GalaxyJS ships no runtime dependencies and needs no bundler or framework. You include one script tag (from a CDN or self-hosted) and call Galaxy.create. That makes it portable to any stack, which a React-bound library cannot match.

Is GalaxyJS accessible?

Accessibility is a contract. Every animation honors prefers-reduced-motion by drawing a single static frame instead of animating, and offscreen canvases auto-pause to save power. The reduced-motion behavior is part of the engine, not an option.

Can AI agents use GalaxyJS?

Yes. Alongside the drop-in script, GalaxyJS ships a machine layer: an MCP server, TypeScript definitions, a generated manifest, and an llms.txt — so an AI agent can discover scenes and wire them into a page with structured contracts, the same way a human reads the docs.

GALAXYJS · OPEN SOURCE · MIT 60 SCENES · 0 DEPENDENCIES · ~20 KB [ CASE STUDY — ED CHEN ]

Active scene

galaxyMerge

Render

— fps

Device pixel ratio

×1

GalaxyJS

Sixty cosmic animations. Zero dependencies.

Enter the playground ↗ Source on GitHub ↗ Galaxy.create('quasar', el)copy

The starscape behind this is the real engine — running live

01 — THE BRIEF

A cosmic engine that drops into anything.

No framework. No build step. No dependencies. One <script> tag and one call put 60 hand-tuned canvas animations into a React app, a Vue app, or a plain HTML file. The hard part wasn't drawing stars — it was making the whole thing feel weightless: small, fast, portable, and accessible by default.

Animations

Dependencies

Framework-free, no build

Payload

~20KB gzipped

rAF loops

One shared frame loop

Offscreen

auto-pauseIntersectionObserver

A11y

reduced-motionby contract

02 — THE ENGINE

Don't take my word for it. Drive it.

This panel is the actual library, running live. Pick a scene — the engine mounts it on a HiDPI canvas, runs it on the shared frame loop, and would pause it the moment you scrolled away. The case study is the demo.

galaxyMerge

status rendering
shared rAF · dpr-aware · auto-pause

Select a scene

Telemetry

api · Galaxy.create(name, el)
scenes · 60 registered
theme · token-based, dual
extend · registerAnimation()

03 — THE CATALOG

Sixty scenes. All real.

A few of the catalog, each a separate live instance. They only animate while on screen — scroll past and they sleep.

All 60, live in the playground ↗

04 — UNDER THE HOOD

Performance is a feature.

Sixty animations could mean sixty timers fighting the CPU. They don't. Every scene shares one requestAnimationFrame loop, each canvas is device-pixel-ratio aware so it stays crisp on retina, and an IntersectionObserver pauses anything scrolled offscreen. A token-based theme drives colour, and registerAnimation() lets anyone add a 61st scene without touching the core.

Single rAF loop

All scenes tick on one shared frame — no timer pile-up, predictable budget.

HiDPI + auto-pause

dpr-aware rendering; offscreen canvases pause via IntersectionObserver to save power.

Extensible by design

registerAnimation(name, fn) + a token theme — add scenes, reskin everything, zero core edits.

05 — THE CONTRACT

The cosmos holds still when asked.

Every animation honors prefers-reduced-motion — instead of moving, it renders a single composed static frame. Motion sensitivity shouldn't mean a blank box; it should mean a still, beautiful one. A test in CI keeps that promise.

This page honors it too — turn on Reduce Motion and the boot sequence skips, the reticle cursor returns to default, and every cosmic scene freezes to one frame.

06 — FOR HUMANS & AGENTS

A drop-in tag — or an agent's call.

A human adds one script and ships. But GalaxyJS also carries the machine layer: an MCP server, hand-written TypeScript types, a generated manifest, and an llms.txt. So an AI agent in Claude Desktop or Cursor can discover the 60 scenes and wire one into a page from a structured contract — the same instinct behind its sibling registry, ReactΩ.

MCP server

4 toolslist · get · scaffold · meta

Types + manifest

galaxy.d.ts+ generated manifest

Agent guide

llms.txttoken-efficient

07 — TWO LANES

One author, two engines.

GalaxyJS and ReactΩ are deliberately separate — different stacks, different problems, the same discipline underneath.

GalaxyJS

Vanilla cosmic engine

Framework-free canvas animations + UI kit you drop into any page.

Plain JS · no framework · no build
One <script> / CDN drop-in
60 scenes · single shared rAF
Reduced-motion by contract

ReactΩ

React component registry

Copy-paste motion, interaction & physics components you own — AI-native.

React + TypeScript + Tailwind
Registry + CLI + shadcn + MCP
31 components you own outright
Reduced-motion by contract

Read the ReactΩ case study →

08 — FLIGHT LOG

Not a demo. Shipped.

T+00

v3.1.0 "Nova" · MIT

Tagged release — 60 animations, immutably pinned on jsDelivr. Release notes ↗

T+01

Live playground

All 60 scenes + the UI kit, native on GitHub Pages. edwson.github.io/GalaxyJS ↗

T+02

CI on Node 18 · 20 · 22

Syntax + eslint, a true minified build, a manifest-drift gate, and a real end-to-end MCP test — green on every push.

T+03

Built solo, AI-augmented

Engine, UI kit, MCP, and docs shipped end-to-end with an AI pair — disclosed openly. Honest ~20 kB, measured not guessed.

09 — WHAT THIS EVIDENCES

I engineered an experience to feel effortless.

Anyone can draw a starfield. The craft was making sixty of them feel weightless — one frame loop, dpr-crisp, auto-paused, ~20 kB, and still beautiful when motion is switched off — and then making the whole thing installable by a person or an agent. Performance, portability, and accessibility weren't constraints on the product. They were the product.