Starting with a quad

glsl({Aspect:'fit',
	FP:`UV,0,1`}); // draw quad to screen

Creating the state buffer

let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
 
glsl({FP:`
	FOut.xy = vec2(1, step(length(XY),0.1));
`}, state);	// draw to state
 
glsl({Aspect:'fit', state:state[0],
	FP:`state(UV).y`}); // draw state to screen
let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
 
glsl({FP:`
	FOut.xy = vec2(1, step(length(XY),0.1));
`}, state);	// draw to state
 
glsl({Aspect:'fit', state:state[0],
	FP:`state(UV).y`}); // draw state to screen
let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
 
glsl({FP:`
	FOut.xy = vec2(1, step(length(XY),0.1));
`}, state);	// draw to state
 
glsl({Aspect:'fit', state:state[0],
	FP:`state(UV).y`}); // draw state to screen

Modifying the state

let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
 
glsl({frameCount, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1));
		return;
	}
	// otherwise read and fade the previous state
	vec2 v = Src(I).xy;
	v *= 0.98;
	FOut.xy = v;
`}, state);	// draw to state
 
glsl({Aspect:'fit', state:state[0],
	FP:`state(UV).y`}); // draw state to screen
let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
 
glsl({frameCount, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1));
		return;
	}
	// otherwise read and fade the previous state
	vec2 v = Src(I).xy;
	v *= 0.98;
	FOut.xy = v;
`}, state);	// draw to state
 
glsl({Aspect:'fit', state:state[0],
	FP:`state(UV).y`}); // draw state to screen

(click the canvas to reset)

Blur

let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
 
glsl({frameCount, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1));
		return;
	}
	// otherwise read and fade the previous state
	vec2 v = Src(I).xy;
	// use HW-bilinear filtering to compute 
	// 3x3 filter with 4 fetches
	vec2 ds = Src_step()*0.5;
	#define S(x,y) Src(UV+ds*vec2(x,y)).xy
	vec2 blur = (S(-1,-1)+S(1,-1)+S(-1,1)+S(1,1))/4.0;
	// different blur rates for "x" and "y" channels
	v = mix(v, blur, vec2(1.0, 0.5));
	FOut.xy = v;
`}, state);	// draw to state
 
glsl({Aspect:'fit', state:state[0],
	FP:`state(UV).y`}); // draw state to screen
let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
 
glsl({frameCount, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1));
		return;
	}
	// otherwise read and fade the previous state
	vec2 v = Src(I).xy;
	// use HW-bilinear filtering to compute 
	// 3x3 filter with 4 fetches
	vec2 ds = Src_step()*0.5;
	#define S(x,y) Src(UV+ds*vec2(x,y)).xy
	vec2 blur = (S(-1,-1)+S(1,-1)+S(-1,1)+S(1,1))/4.0;
	// different blur rates for "x" and "y" channels
	v = mix(v, blur, vec2(1.0, 0.5));
	FOut.xy = v;
`}, state);	// draw to state
 
glsl({Aspect:'fit', state:state[0],
	FP:`state(UV).y`}); // draw state to screen

Adding reaction term

let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
const k=.05444, f=.02259; // reaction params
glsl({frameCount, k, f, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1));
		return;
	}
	vec2 v = Src(I).xy;
	vec2 ds = Src_step()*0.5;
	#define S(x,y) Src(UV+ds*vec2(x,y)).xy
	vec2 blur = (S(-1,-1)+S(1,-1)+S(-1,1)+S(1,1))/4.0;
	v = mix(v, blur, vec2(1.0, 0.5));
	float rate = v.x*v.y*v.y;
	v += vec2(-rate+f*(1.0-v.x), rate-(f+k)*v.y);
	FOut.xy = v;
`}, state);	// draw to state
 
glsl({Aspect:'fit', state:state[0],
	FP:`state(UV).y`}); // draw state to screen

More steps pre frame

let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
const k=.05444, f=.02259; // reaction params
for (let i=0; i<5; ++i)
glsl({frameCount, k, f, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1));
		return;
	}
	vec2 v = Src(I).xy;
	vec2 ds = Src_step()*0.5;
	#define S(x,y) Src(UV+ds*vec2(x,y)).xy
	vec2 blur = (S(-1,-1)+S(1,-1)+S(-1,1)+S(1,1))/4.0;
	v = mix(v, blur, vec2(1.0, 0.5));
	float rate = v.x*v.y*v.y;
	v += vec2(-rate+f*(1.0-v.x), rate-(f+k)*v.y);
	FOut.xy = v;
`}, state);	// draw to state
 
glsl({Aspect:'fit', state:state[0],
	FP:`state(UV).y`}); // draw state to screen

Apply colormap

let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
const k=.05444, f=.02259; // reaction params
for (let i=0; i<5; ++i)
glsl({frameCount, k, f, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1));
		return;
	}
	vec2 v = Src(I).xy;
	vec2 ds = Src_step()*0.5;
	#define S(x,y) Src(UV+ds*vec2(x,y)).xy
	vec2 blur = (S(-1,-1)+S(1,-1)+S(-1,1)+S(1,1))/4.0;
	v = mix(v, blur, vec2(1.0, 0.5));
	float rate = v.x*v.y*v.y;
	v += vec2(-rate+f*(1.0-v.x), rate-(f+k)*v.y);
	FOut.xy = v;
`}, state);	// draw to state
 
const colors = {fg:[.9,.2,.7], bg:[0.1,0.1,0.1]};
glsl({Aspect:'fit', ...colors, state:state[0], FP:`
	mix(bg, fg, state(UV).y*2.),1`});

Tesselate and wrap the quad

let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
const k=.05444, f=.02259; // reaction params
for (let i=0; i<5; ++i)
glsl({frameCount, k, f, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1));
		return;
	}
	vec2 v = Src(I).xy;
	vec2 ds = Src_step()*0.5;
	#define S(x,y) Src(UV+ds*vec2(x,y)).xy
	vec2 blur = (S(-1,-1)+S(1,-1)+S(-1,1)+S(1,1))/4.0;
	v = mix(v, blur, vec2(1.0, 0.5));
	float rate = v.x*v.y*v.y;
	v += vec2(-rate+f*(1.0-v.x), rate-(f+k)*v.y);
	FOut.xy = v;
`}, state);	// draw to state
 
const colors = {fg:[.9,.2,.7], bg:[0.1,0.1,0.1]};
glsl({Aspect:'fit', ...colors, state:state[0], 
	Mesh:state.size, DepthTest:1, VP:`
	VPos.xyz = torus(UV, 0.5, 0.2);
	`, FP:`
	mix(bg, fg, state(UV).y*2.),1`});
let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
const k=.05444, f=.02259; // reaction params
for (let i=0; i<5; ++i)
glsl({frameCount, k, f, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1));
		return;
	}
	vec2 v = Src(I).xy;
	vec2 ds = Src_step()*0.5;
	#define S(x,y) Src(UV+ds*vec2(x,y)).xy
	vec2 blur = (S(-1,-1)+S(1,-1)+S(-1,1)+S(1,1))/4.0;
	v = mix(v, blur, vec2(1.0, 0.5));
	float rate = v.x*v.y*v.y;
	v += vec2(-rate+f*(1.0-v.x), rate-(f+k)*v.y);
	FOut.xy = v;
`}, state);	// draw to state
 
const colors = {fg:[.9,.2,.7], bg:[0.1,0.1,0.1]};
glsl({Aspect:'fit', ...colors, state:state[0], 
	Mesh:state.size, DepthTest:1, VP:`
	VPos.xyz = torus(UV, 0.5, 0.2);
	`, FP:`
	mix(bg, fg, state(UV).y*2.),1`});

Displace vertices

let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
const k=.05444, f=.02259; // reaction params
for (let i=0; i<5; ++i)
glsl({frameCount, k, f, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1)*0.1);
		return;
	}
	vec2 v = Src(I).xy;
	vec2 ds = Src_step()*0.5;
	#define S(x,y) Src(UV+ds*vec2(x,y)).xy
	vec2 blur = (S(-1,-1)+S(1,-1)+S(-1,1)+S(1,1))/4.0;
	v = mix(v, blur, vec2(1.0, 0.5));
	float rate = v.x*v.y*v.y;
	v += vec2(-rate+f*(1.0-v.x), rate-(f+k)*v.y);
	FOut.xy = v;
`}, state);	// draw to state
 
const colors = {fg:[.9,.2,.7], bg:[0.1,0.1,0.1]};
glsl({Aspect:'fit', ...colors, state:state[0], 
	Mesh:state.size, DepthTest:1, VP:`
	vec2 v = state(UV).xy;
	VPos.xyz = torus(UV, 0.5, 0.2+v.y*0.3);
	`, FP:`
	mix(bg, fg, state(UV).y*2.),1`});

Rotate

let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
const k=.05444, f=.02259; // reaction params
for (let i=0; i<5; ++i)
glsl({frameCount, k, f, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1)*0.1);
		return;
	}
	vec2 v = Src(I).xy;
	vec2 ds = Src_step()*0.5;
	#define S(x,y) Src(UV+ds*vec2(x,y)).xy
	vec2 blur = (S(-1,-1)+S(1,-1)+S(-1,1)+S(1,1))/4.0;
	v = mix(v, blur, vec2(1.0, 0.5));
	float rate = v.x*v.y*v.y;
	v += vec2(-rate+f*(1.0-v.x), rate-(f+k)*v.y);
	FOut.xy = v;
`}, state);	// draw to state
 
const colors = {fg:[.9,.2,.7], bg:[0.1,0.1,0.1]};
glsl({Aspect:'fit', ...colors, state:state[0], 
	Mesh:state.size, DepthTest:1, VP:`
	vec2 v = state(UV).xy;
	VPos.xyz = torus(UV, 0.5, 0.2+v.y*0.3).yxz;
	VPos.yz *= rot2(-0.6);
	`, FP:`
	mix(bg, fg, state(UV).y*2.),1`});

Per-vertex colors ("varying")

let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
const k=.05444, f=.02259; // reaction params
for (let i=0; i<5; ++i)
glsl({frameCount, k, f, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1)*0.1);
		return;
	}
	vec2 v = Src(I).xy;
	vec2 ds = Src_step()*0.5;
	#define S(x,y) Src(UV+ds*vec2(x,y)).xy
	vec2 blur = (S(-1,-1)+S(1,-1)+S(-1,1)+S(1,1))/4.0;
	v = mix(v, blur, vec2(1.0, 0.5));
	float rate = v.x*v.y*v.y;
	v += vec2(-rate+f*(1.0-v.x), rate-(f+k)*v.y);
	FOut.xy = v;
`}, state);	// draw to state
 
const colors = {fg:[.9,.2,.7], bg:[0.1,0.1,0.1]};
glsl({Aspect:'fit', ...colors, state:state[0], 
	Mesh:state.size, DepthTest:1, VP:`
	vec2 v = state(UV).xy;
	VPos.xyz = torus(UV, 0.5, 0.2+v.y*0.3).yxz;
	VPos.yz *= rot2(-0.6);
	varying vec3 color = mix(bg, fg, state(UV).y*2.);
	`, FP:`color,1`});

Add background

let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
const k=.05444, f=.02259; // reaction params
for (let i=0; i<5; ++i)
glsl({frameCount, k, f, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1)*0.1);
		return;
	}
	vec2 v = Src(I).xy;
	vec2 ds = Src_step()*0.5;
	#define S(x,y) Src(UV+ds*vec2(x,y)).xy
	vec2 blur = (S(-1,-1)+S(1,-1)+S(-1,1)+S(1,1))/4.0;
	v = mix(v, blur, vec2(1.0, 0.5));
	float rate = v.x*v.y*v.y;
	v += vec2(-rate+f*(1.0-v.x), rate-(f+k)*v.y);
	FOut.xy = v;
`}, state);	// draw to state
 
const colors = {fg:[.9,.2,.7], bg:[0.1,0.1,0.1]};
glsl({Aspect:'cover', ...colors, FP:`
	mix(fg*0.4, bg, min(dot(XY,XY),1.0) ),1`});
glsl({Aspect:'fit', ...colors, state:state[0], 
	Mesh:state.size, DepthTest:1, VP:`
	vec2 v = state(UV).xy;
	VPos.xyz = torus(UV, 0.5, 0.2+v.y*0.3).yxz;
	VPos.yz *= rot2(-0.6);
	varying vec3 color = mix(bg, fg, state(UV).y*2.);
	`, FP:`color,1`});

Final code (28 loc)

let state = glsl({}, {size:[256,256], story:2, 
	tag:'state', format:'rgba32f', filter:'linear'});
const k=.05444, f=.02259; // reaction params
for (let i=0; i<5; ++i)
glsl({frameCount, k, f, FP:`
	if (frameCount==0.0) { // reset on the first frame
		FOut.xy = vec2(1, step(length(XY),0.1)*0.1);
		return;
	}
	vec2 v = Src(I).xy;
	vec2 ds = Src_step()*0.5;
	#define S(x,y) Src(UV+ds*vec2(x,y)).xy
	vec2 blur = (S(-1,-1)+S(1,-1)+S(-1,1)+S(1,1))/4.0;
	v = mix(v, blur, vec2(1.0, 0.5));
	float rate = v.x*v.y*v.y;
	v += vec2(-rate+f*(1.0-v.x), rate-(f+k)*v.y);
	FOut.xy = v;
`}, state);	// draw to state
 
const colors = {fg:[.9,.2,.7], bg:[0.1,0.1,0.1]};
glsl({Aspect:'cover', ...colors, FP:`
	mix(fg*0.4, bg, min(dot(XY,XY),1.0) ),1`});
glsl({Aspect:'fit', ...colors, state:state[0], 
	Mesh:state.size, DepthTest:1, VP:`
	vec2 v = state(UV).xy;
	VPos.xyz = torus(UV, 0.5, 0.2+v.y*0.3).yxz;
	VPos.yz *= rot2(-0.6);
	varying vec3 color = mix(bg, fg, state(UV).y*2.);
	`, FP:`color,1`});