Skip to content

Fix Silk background freezing on parameter change - #1011

Merged
DavidHDev merged 2 commits into
mainfrom
copilot/fix-silk-background-freezing
Jul 26, 2026
Merged

Fix Silk background freezing on parameter change#1011
DavidHDev merged 2 commits into
mainfrom
copilot/fix-silk-background-freezing

Conversation

Copilot AI commented Jul 26, 2026

Copy link
Copy Markdown
Contributor

The Silk background (R3F) froze whenever a parameter was changed in Background Studio instead of applying the update and continuing the animation.

Cause

uniforms was rebuilt (new object reference) on every prop change because all props were in the useMemo dependency array. Handing a fresh uniforms object to <shaderMaterial> each render makes R3F swap the material's uniforms out from under the running useFrame loop, stalling the animation.

Changes

  • Stable uniforms: create the uniforms object once (useMemo(..., [])) so the reference passed to <shaderMaterial> never changes.
  • Live sync: mutate the existing uniform .value fields in a useEffect when props change, so updates apply without remounting the material. Color uses setRGB(r, g, b) (matching the original new Color(r, g, b), since Color.set takes a single arg).
  • Applied identically across all four variants: content (JS/CSS), tailwind (JS/TW), ts-default, ts-tailwind.
  • Synced the embedded source in the generated public/r/Silk-{JS,TS}-{CSS,TW}.json registry files.
const uniforms = useMemo(() => ({ /* ...initial values... */, uTime: { value: 0 } }), []);

useEffect(() => {
  uniforms.uSpeed.value = speed;
  uniforms.uScale.value = scale;
  uniforms.uNoiseIntensity.value = noiseIntensity;
  uniforms.uColor.value.setRGB(...hexToNormalizedRGB(color));
  uniforms.uRotation.value = rotation;
}, [speed, scale, noiseIntensity, color, rotation, uniforms]);

Copilot AI changed the title [WIP] Fix background 'Silk' freezing in Background Studio on parameter change Fix Silk background freezing on parameter change Jul 26, 2026
Copilot AI requested a review from DavidHDev July 26, 2026 21:21
@DavidHDev
DavidHDev marked this pull request as ready for review July 26, 2026 21:25
@DavidHDev
DavidHDev merged commit 5d26a67 into main Jul 26, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[BUG]: Background "Silk" freezing in Background Studio on parameter change.

2 participants