JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.jsdelivr.net/npm/three@0.141/build/three.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three@0.141/examples/js/shaders/HorizontalBlurShader.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three@0.141/examples/js/shaders/TriangleBlurShader.js"></script>

CSS

body {
	  margin: 0;
}

JavaScript

let camera, scene, renderer;

init().then( render );

async function init() {

  camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 0.01, 10);
  camera.position.z = 3;

  scene = new THREE.Scene();
  
  renderer = new THREE.WebGLRenderer({
    antialias: true
  });
  renderer.setPixelRatio(window.devicePixelRatio);
  renderer.setSize(window.innerWidth, window.innerHeight);
  document.body.appendChild(renderer.domElement);


  const loader = new THREE.TextureLoader();
  const texture = await loader.loadAsync('https://threejs.org/examples/textures/brick_diffuse.jpg');
  //scene.background = texture;

  scene.background = triangleBlurTexture( renderer, texture, 40, 2 )

}

const {OrthographicCamera, Scene, WebGLRenderTarget, ShaderMaterial, UniformsUtils, PlaneGeometry, Mesh, TriangleBlurShader, Vector2} = THREE

function makeTriangleBlurShader(iterations = 10) {
	// Remove texture, because texture is a reserved word in WebGL 2
	const {texture, ...uniforms} = TriangleBlurShader.uniforms

	const TriangleBlurShader2 = {
		...TriangleBlurShader,

		name: 'TriangleBlurShader2',

		uniforms: {
			...uniforms,

			// Replace texture with blurTexture for WebGL 2
			blurTexture: {value: null},
		},
	}

	// Replace texture with blurTexture for WebGL 2
	TriangleBlurShader2.fragmentShader = TriangleBlurShader2.fragmentShader.replace(
		'uniform sampler2D texture;',
		'uniform sampler2D blurTexture;',
	)
	TriangleBlurShader2.fragmentShader = TriangleBlurShader2.fragmentShader.replace(
		'texture2D( texture',
		'texture2D( blurTexture',
	)

	// Make iterations configurable.
	TriangleBlurShader2.fragmentShader = TriangleBlurShader2.fragmentShader.replace(
		'#define ITERATIONS 10.0',
		'#define ITERATIONS ' + iterations + '.0',
	)

	console.log('shader:', TriangleBlurShader2.fragmentShader)

	return TriangleBlurShader2
}

function triangleBlurTexture(
	renderer,
	texture,
	radius = 10,
	passes = 1,
	iterations = 10,
) {
	const width =...