Changelog
Releases
Runtime, CLI and component releases, newest first. Every runtime release also ships a full write-up in the package's own CHANGELOG.
- 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.
- runtime4.2.0minor
Plain three.js in one call
@vectorvesper/motion/three:useThreeSceneruns 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. AWebGPURendererworks 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'sdpris a ceiling, never above the screen's own.dpr: 2drew 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 forgottenreportHealthy()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.useNumberTickerstops writing once it lands. A still page of three counters made 105–180 text writes a second.useNumberTicker,useMagneticIntent,useImageTrailanduseVideoScrubberstart when their element arrives on a later commit, behind a hydration guard ornext/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.
- cli2.8.0minor
check_motion: four rules for hand-built three.js:offscreen-render,uncapped-pixel-ratio,unreleased-contextandrenderer-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-wrapperflagsuseRenderQuality'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 namespacednew THREE.WebGLRenderer()counts as a context, so a hand-built hero getswebgl-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 wholethree-scenestarter file in its first answer, built onuseThreeScene. React Three Fiber requests still getuseSceneGatewithuseRenderQuality.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 listsuseAdaptiveQualityfirst, where three searches had missed it.- Teaches
builtAtand a requiredreportHealthy()for hand-built renderers, thedprceiling, and whycost: "heavy"can wait forever next to a scene that never idles.
- runtime4.1.0minor
WebGPU device loss
watchGPUDevice: reports a WebGPU device's health to the runtime. A device announces its death by resolvingdevice.lostinstead of firing an event, so a handler written forwebglcontextlostnever hears it. A loss incrementsgenerationanduseSceneGaterebuilds the scene, unchanged.- A loss whose reason is
destroyedis ignored, so tearing a scene down cannot trigger a rebuild of the page that is tearing it down. DeviceSignalscarries awebgpuflag, read synchronously fromnavigator.gpu. It does not move the quality tier: adapter limits require an asyncrequestAdapter(), and a browser that exposes the API can still refuse an adapter.useRenderQualitywatches the device as well as listening forwebglcontextlost, so a WebGPU scene mounted throughuseSceneGaterecovers 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.GPUDeviceLikeis structural, so@webgpu/typesstays out of the dependency tree.
- cli2.7.0minor
check_motion: three WebGPU rules. A device acquired and never watched, adevice.losthandler that treats your owndestroy()as a failure, andinstanceof WebGPURendererused 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-losskeys on an R3F canvas or agetContext("webgl")call, so those files previously passed without being read. plan_motion: answers a WebGPU question withwatchGPUDevicerather than sending you to add awebglcontextlostlistener for an event a WebGPU canvas never fires.
- 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 incrementedgenerationonce per canvas and remounted every scene on the page that many times.
- runtime4.0.2patch
useRenderQuality: pixel ratio holds while a scene isidle. Lowering it resized the drawing buffer, which clears it, and the stopped frame loop never repainted.
- cli2.6.0minor
login,logoutandwhoamiare 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.
- 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.
- 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.
- runtime4.0.0major
useRenderQuality returns Canvas props
useRenderQualityreturns props to spread onto<Canvas>and is called outside it. It previously calledsetDprandsetFrameloopand assignedgl.shadowMap.enabledfrom 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: 1no longer runs at 1.25. React Three Fiber re-runs its configure pass on every render and reset all three settings from props.
- 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.AdaptiveQualitydegrades only when rendering is the diagnosed bottleneck. Cutting detail while a third-party script blocks the main thread costs fidelity and returns no frames.
- 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 thegenerationcounter that keys the rebuild. React Three Fiber ships no handler forwebglcontextlost.- React Three Fiber adapter on
@vectorvesper/motion/r3f, kept off the main entry so a project without 3D never resolvesthree. - Scrolling past a scene pauses its frame loop and keeps the context, textures and compiled shaders. Unmounting discarded all three.
- 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.
- 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.
- components
Initial release
@vectorvesper/motion: the frame conductor, sensor bus, quality governors and React hooks. Zero dependencies, every peer optional.vectorvesperCLI: 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.