JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://threejs.org/build/three.js"></script>

<script src="https://threejs.org/examples/js/Detector.js"></script>
<script src="https://threejs.org/examples/js/libs/stats.min.js"></script>
<script src='https://threejs.org/examples/js/libs/dat.gui.min.js'></script>

<script>
		THREE.BokehShader = {

			uniforms: {

				"textureWidth":  { value: 1.0 },
				"textureHeight":  { value: 1.0 },

				"focalDepth":   { value: 1.0 },
				"focalLength":   { value: 24.0 },
				"fstop": { value: 0.9 },

				"tColor":   { value: null },
				"tDepth":   { value: null },

				"maxblur":  { value: 1.0 },

				"showFocus":   { value: 0 },
				"manualdof":   { value: 0 },
				"vignetting":   { value: 0 },
				"depthblur":   { value: 0 },

				"threshold":  { value: 0.5 },
				"gain":  { value: 2.0 },
				"bias":  { value: 0.5 },
				"fringe":  { value: 0.7 },

				"znear":  { value: 0.1 },
				"zfar":  { value: 100 },

				"noise":  { value: 1 },
				"dithering":  { value: 0.0001 },
				"pentagon": { value: 0 },

				"shaderFocus":  { value: 1 },
				"focusCoords":  { value: new THREE.Vector2() }


			},

			vertexShader: [

				"varying vec2 vUv;",

				"void main() {",

					"vUv = uv;",
					"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",

				"}"

			].join( "\n" ),

			fragmentShader: [

				"#include <common>",

				"varying vec2 vUv;",

				"uniform sampler2D tColor;",
				"uniform sampler2D tDepth;",
				"uniform float textureWidth;",
				"uniform float textureHeight;",

				"uniform float focalDepth;  //focal distance value in meters, but you may use autofocus option below",
				"uniform float focalLength; //focal length in mm",
				"uniform float fstop; //f-stop value",
				"uniform bool showFocus; //show debug focus point and focal range (red = focal point, green = focal range)",

				"/*",
				"make sure that these two values are the same for your camera, otherwise distances will be wrong.",
				"*/",

				"uniform float znear;...

CSS

body {
	margin: 0;
}