Changelog

Releases

Runtime, CLI and component releases, newest first. Every runtime release also ships a full write-up in the package's own CHANGELOG.

  1. components

    Pro components that come back after a GPU reset

    • These WebGL Pro components hand their graphics context back when they unmount: Bubble Transition, Follow Cursor, Ghost Typewriter, Glass Curtain, Glow Tile, Halo Cursor, Heart Stream, Media FX Pro, Pixel Smear Carousel and Refractive Gallery. Each left one behind per visit; browsers cap live contexts and drop the oldest, which is usually the hero.
    • The same components rebuild after a GPU reset the browser never undoes. Most of them waited for the context to be handed back, which may never happen, and Ghost Typewriter, Glow Tile and Heart Stream had no reset handling at all.
    • Carousel 3D, Particle Morph Gallery and Play Pause: mount="eager" now skips only the wait. It used to switch the scene gate off, so the default kept drawing off screen and under reduced motion. They now pause off screen and show a still image under reduced motion.
    • Follow Cursor, Ghost Typewriter and Heart Stream stop drawing off screen and under reduced motion. Under reduced motion, Ghost Typewriter shows its line whole instead of typing it.
    • Lookbook: taking it off the page no longer rebuilds every other scene. React Three Fiber force-loses a canvas it unmounts, and Lookbook reported that as a lost context.
    • Every fix works on runtime 4.0 and later.
  2. runtime4.2.0minor

    Plain three.js in one call

    • @vectorvesper/motion/three: useThreeScene runs a hand-written three.js scene in one call. You make the renderer and the scene; it gates the build, draws on the shared loop and only on screen, caps the pixel ratio, rebuilds after a lost context, frees every GPU resource and never builds under reduced motion. A WebGPURenderer works the same way.
    • useRenderQuality: closing a canvas no longer rebuilds every other scene. R3F force-loses the context of a canvas it unmounts, and the listener reported that as a failure: six tab switches rebuilt a managed hero four times, and a page with two scenes could rebuild in a loop.
    • useRenderQuality: a profile's dpr is a ceiling, never above the screen's own. dpr: 2 drew a 1x monitor at four times its pixels; an AI-written hero that copied it ran at 8–12fps where the capped page ran at about 20.
    • useRenderQuality: a context lost while R3F is still building the scene is reported, where it left the canvas black.
    • RendererHealth: a replacement lost moments after its rebuild now rebuilds again. reportLost() takes an optional { builtAt }, which the adapters pass for you. Fresh canvases trigger at most three rebuilds in a row.
    • RendererHealth: a forgotten reportHealthy() costs a warning, not the scene. The next loss used to be swallowed and the canvas stayed black; now the runtime assumes the rebuild worked after 5 seconds.
    • useSceneGate: the worst load tier reduces quality, where it fell through to full. A hero ran at 10–12fps at full quality while the runtime reported the page struggling.
    • useSceneGate({ content: true }): for a section a reader came for, like a chart. It waits like a scene, then mounts even under reduced motion or below the device floor.
    • useNumberTicker stops writing once it lands. A still page of three counters made 105–180 text writes a second.
    • useNumberTicker, useMagneticIntent, useImageTrail and useVideoScrubber start when their element arrives on a later commit, behind a hydration guard or next/dynamic. They never started before.
    • Device tier: an Apple GPU counts as mobile-class only with touch, so a Mac on Safari starts at full quality instead of the reduced profile.
  3. cli2.8.0minor
    • check_motion: four rules for hand-built three.js: offscreen-render, uncapped-pixel-ratio, unreleased-context and renderer-rebuilt-on-change. On the lab's unmanaged hero it now reports 6 warnings where it reported 1, matching what the browser probes measured.
    • check_motion: adapter-props-to-wrapper flags useRenderQuality's props spread onto a component that is not <Canvas>. A wrapper absorbs them into its rest parameter and forwards them to whatever it likes, so the pixel ratio, frame loop, shadow setting and context-loss listener all stop happening, with no type error and no visible symptom until a context is lost.
    • check_motion: a namespaced new THREE.WebGLRenderer() counts as a context, so a hand-built hero gets webgl-context-loss. A file that reports a loss and never reports healthy is flagged, and a three.js scene drawn from its own loop needs a reduced-motion guard.
    • plan_motion: a plain three.js request gets the whole three-scene starter file in its first answer, built on useThreeScene. React Three Fiber requests still get useSceneGate with useRenderQuality.
    • plan_motion: holding a heavy mount until the scroll settles now has an answer, useSceneGate({ content: true }). All three phrasings an AI dev tried had missed.
    • search: a reduced-motion query lists useAdaptiveQuality first, where three searches had missed it.
    • Teaches builtAt and a required reportHealthy() for hand-built renderers, the dpr ceiling, and why cost: "heavy" can wait forever next to a scene that never idles.
  4. runtime4.1.0minor

    WebGPU device loss

    • watchGPUDevice: reports a WebGPU device's health to the runtime. A device announces its death by resolving device.lost instead of firing an event, so a handler written for webglcontextlost never hears it. A loss increments generation and useSceneGate rebuilds the scene, unchanged.
    • A loss whose reason is destroyed is ignored, so tearing a scene down cannot trigger a rebuild of the page that is tearing it down.
    • DeviceSignals carries a webgpu flag, read synchronously from navigator.gpu. It does not move the quality tier: adapter limits require an async requestAdapter(), and a browser that exposes the API can still refuse an adapter.
    • useRenderQuality watches the device as well as listening for webglcontextlost, so a WebGPU scene mounted through useSceneGate recovers with no extra code. It attaches both paths, because three swaps in a WebGL backend when WebGPU init fails and that fallback is invisible from the outside.
    • GPUDeviceLike is structural, so @webgpu/types stays out of the dependency tree.
  5. cli2.7.0minor
    • check_motion: three WebGPU rules. A device acquired and never watched, a device.lost handler that treats your own destroy() as a failure, and instanceof WebGPURenderer used to pick the loss wiring, which three's silent WebGL fallback makes unreliable.
    • A file that only touches WebGPU is now examined at all. webgl-context-loss keys on an R3F canvas or a getContext("webgl") call, so those files previously passed without being read.
    • plan_motion: answers a WebGPU question with watchGPUDevice rather than sending you to add a webglcontextlost listener for an event a WebGPU canvas never fires.
  6. runtime4.0.3patch
    • RendererHealth: context losses arriving within 250ms are counted as one reset. Each canvas reported its loss separately, so a single driver reset incremented generation once per canvas and remounted every scene on the page that many times.
  7. runtime4.0.2patch
    • useRenderQuality: pixel ratio holds while a scene is idle. Lowering it resized the drawing buffer, which clears it, and the stopped frame loop never repainted.
  8. cli2.6.0minor
    • login, logout and whoami are listed in --help.
    • The stored credential is called an access token in all output and documentation.
    • Error paths that render a spinner exit with code 1 on Windows. They exited 127.
  9. runtime4.0.1patch
    • AnimationBudget: tier thresholds derive from the display refresh rate. Scoring against a fixed 16.7ms target reported the lowest tier for a page holding 100fps on a 240Hz panel.
  10. cli2.5.0minor
    • plan_motion: returns which primitive fits a described problem, in what order to apply it, and when the answer is CSS. The decision table carries refusals and the build asserts a minimum count of them.
    • check_motion: thirteen rules covering private frame loops, layout reads in the write lane, state written per frame, and canvases with no context-loss handling.
  11. runtime4.0.0major

    useRenderQuality returns Canvas props

    • useRenderQuality returns props to spread onto <Canvas> and is called outside it. It previously called setDpr and setFrameloop and assigned gl.shadowMap.enabled from inside the canvas.
    • Idle scenes stop rendering. Measured against 3.0.1, an idle scene produced 167 further frames over three seconds.
    • A renderer configured for dpr: 1 no longer runs at 1.25. React Three Fiber re-runs its configure pass on every render and reset all three settings from props.
  12. runtime3.0.0major

    Frame pressure attribution

    • useFramePressure: classifies a slow frame as runtime work, competing main-thread scripts, or the GPU, with a confidence rating.
    • AdaptiveQuality degrades only when rendering is the diagnosed bottleneck. Cutting detail while a third-party script blocks the main thread costs fidelity and returns no frames.
  13. runtime2.0.0major

    Scene gate and the React Three Fiber adapter

    • useSceneGate: decides whether a heavy scene should mount, whether it should draw, at what fidelity, and rebuilds it when the graphics context is lost.
    • RendererHealth: reports a lost context and supplies the generation counter that keys the rebuild. React Three Fiber ships no handler for webglcontextlost.
    • React Three Fiber adapter on @vectorvesper/motion/r3f, kept off the main entry so a project without 3D never resolves three.
    • Scrolling past a scene pauses its frame loop and keeps the context, textures and compiled shaders. Unmounting discarded all three.
  14. components

    Ghost Typewriter, Jigsaw Puzzle, Lookbook and more

    • New Pro components: Field Web, Ghost Typewriter, Glow Tile, Heart Stream, Jigsaw Puzzle, Lookbook, Play Pause, Prism Testimonial, Repel Me Text, Trail Collector and Wind Scatter.
  15. components

    Ribbon Text and Tilt Transition

    • Ribbon Text: a word built from stacked colour bands that stretch apart as it crosses the viewport and spring back once the scroll settles.
    • Tilt Transition: a route change where the page you are leaving tumbles away like a dropped card. The route underneath has already rendered when the tumble starts, so the transition never delays the arrival.
  16. components

    Initial release

    • @vectorvesper/motion: the frame conductor, sensor bus, quality governors and React hooks. Zero dependencies, every peer optional.
    • vectorvesper CLI: copies component source into the project instead of adding a dependency.
    • The free components, open source: Acrylic Shader, Cinematic Text, Code Rain, Dispersed Text, Glass Gallery, Image Ticker, Liquid Transition, Magnetic Sand, Media Shader, Physics Buttons, Scroll Highlighter, Video Card.
    • The Pro components at release: Blur Transition, Bubble Transition, Card Deck, Carousel 3D, Cube Scroll Menu, Follow Cursor, Glass Curtain, Halo Cursor, Media FX Pro, Particle Morph Gallery, Pixel Smear Carousel, Pixel Stretcher, Portal Peeler, Refractive Gallery, SVG Path Story, Text Trail, Volumetric Light.