Your system asks for reduced motion, so VFX-JS draws nothing. Demos on this site show plain HTML.

Type

JPEGGlitchParams

effects/src/jpeg-glitch.ts:70 ↗
import type { JPEGGlitchParams } from "@vfx-js/effects";

Properties

bypass

bypass: boolean

Disable the effect: pass the source straight through at its original resolution with no encode/decode round trip. Toggling this is the cheap way to switch the glitch on and off — the instance stays attached, so it keeps its buffers and pays no re-init cost. (Default: false)

iterations

iterations: number

Number of bytes corrupted across the scan data. More iterations = more, smaller tears spread through the image. (Default: 24)

quality

quality: number

JPEG encode quality (0–1). Lower values bake in more blockiness before any corruption is applied. (Default: 0.4)

randomFlip

randomFlip: boolean

Randomly render half the glitches upside-down. Tears propagate downward (top stays cleaner), so rotating the source 180° before corrupting — then rotating the output back — flips the bias upward and balances the glitch over both directions. false disables it so tears always trail downward. (Default: true)

resolutionScale

resolutionScale: number

Fraction of the element resolution to process at (0–1). 1 is full resolution; 0.5 reads back / encodes / decodes at half size (much cheaper, chunkier blocks) and the result is scaled back up to fit. 0 clamps to a single pixel. (Default: 1)

seed

seed: number

Random seed for the corruption pattern. Drives both the byte values written into the scan stream and where they land. The same seed (with the same other params) always produces the same glitch, so a static frame is reproducible. (Default: 0.25)

speed

speed: number

Re-glitches per second. 0 glitches once and holds a stable frame (re-runs when params change); > 0 keeps re-corrupting for a live, moving glitch. (Default: 0)

vertical

vertical: boolean

Rotate the image a quarter turn (-90°) before corrupting, then rotate the decoded output back. Tears run top-to-bottom, so this turns them sideways. Composes with randomFlip. (Default: false)