GL Transitions

This repository hosts multiple packages for gl-transitions.

• gl-transition: a light function to render a GL Transition frame with a WebGLRenderingContext.
• regl-transition: a function to render a GL Transition with a regl context.
• react-gl-transition: a React component to render a GL Transition in gl-react v6.
• gl-transition-utils: GLSL transform, validation and WebGL compiler utilities.
• gl-transition-scripts: CLI tools (gl-transition-transform, gl-transition-render) using headless-gl.
• website: gl-transitions.com source code. It automatically gets redeployed from the master branch via Vercel.
• regl-transition-example: example for regl-transition.
• example.html: single-file browser slideshow, no build step (libs loaded from unpkg).

Development

Requirements: Node 22 (≥ 22.12) or 24 LTS and pnpm. headless-gl currently fails to compile against newer Node headers (e.g. Node 25), so stick to an LTS — a .prototools file pins Node 22 for proto users.

pnpm install
pnpm build          # build all packages (tsdown + vite)
pnpm test           # unit tests (vitest) + CLI smoke test (needs headless-gl)
pnpm typecheck
pnpm dev            # run the website locally (vite)

Releasing

Releases are managed with Changesets: add a changeset with pnpm changeset, merge to master, and the release workflow opens a version PR / publishes to npm via trusted publishing (OIDC — no token; each package declares this repo's release.yml as trusted publisher on npmjs.com).

Website deployment (Vercel + gl-transitions.com)

The website deploys on Vercel (project connected to this repo; the domain lives on Vercel DNS). vercel.json scopes the build to the website subtree — pnpm install --filter website... skips gl-transition-scripts and its headless-gl native build, which the Vercel image cannot compile.

Kudos

Libraries

• React and Vite
• headless-gl and bunch of other libs around stackgl.
• gl-react
• regl

Services

• GitHub Actions for CI and npm releases.
• Vercel for hosting the website.
• Github itself, for being a platform for hosting gl-transitions

Others

• unsplash.com for the images