Ran formatter.

js/Matrix.jsx

@@ -114,7 +114,7 @@ export const Matrix = memo((props) => {
 	const [rConfig, setConfig] = useState(makeConfig({}));
 	const rendererModules = {};
 
-	const resizeObserver = new ResizeObserver(entries => {
+	const resizeObserver = new ResizeObserver((entries) => {
 		for (const entry of entries) {
 			const contentBoxSize = entry.contentBoxSize[0];
 			setSize([contentBoxSize.inlineSize, contentBoxSize.blockSize]);
@@ -137,9 +137,7 @@ export const Matrix = memo((props) => {
 
 	useEffect(() => {
 		const config = makeConfig({
-			...Object.fromEntries(
-				Object.entries(rawConfigProps).filter(([_, value]) => value != null),
-			)
+			...Object.fromEntries(Object.entries(rawConfigProps).filter(([_, value]) => value != null)),
 		});
 		if (config.renderer === "webgpu" && !supportsWebGPU()) {
 			config.renderer = "regl";
@@ -193,7 +191,7 @@ export const Matrix = memo((props) => {
 
 	useEffect(() => {
 		if (rRenderer?.destroyed ?? true) return;
-		rRenderer.size = rSize.map(n => n * rConfig.resolution);
+		rRenderer.size = rSize.map((n) => n * rConfig.resolution);
 	}, [rRenderer, rConfig.resolution, rSize]);
 
 	return <div ref={domElement} {...elProps}></div>;

js/main.js

@@ -29,9 +29,13 @@ document.body.onload = async () => {
 		const Renderer = (await rendererModule).default;
 		const renderer = new Renderer();
 		await renderer.ready;
-		renderer.size = [window.innerWidth, window.innerHeight].map(n => n * (window.devicePixelRatio ?? 1) * config.resolution);
+		renderer.size = [window.innerWidth, window.innerHeight].map(
+			(n) => n * (window.devicePixelRatio ?? 1) * config.resolution,
+		);
 		window.onresize = () => {
-			renderer.size = [window.innerWidth, window.innerHeight].map(n => n * (window.devicePixelRatio ?? 1) * config.resolution);
+			renderer.size = [window.innerWidth, window.innerHeight].map(
+				(n) => n * (window.devicePixelRatio ?? 1) * config.resolution,
+			);
 		};
 		window.addEventListener("dblclick", () => {
 			renderer.fullscreen = !renderer.fullscreen;

js/regl/mirrorPass.js

@@ -1,10 +1,11 @@
 import { loadText, makePassFBO, makePass } from "./utils.js";
 
 export default ({ regl, canvas, cache, config, cameraTex, cameraAspectRatio }, inputs) => {
-
 	let start;
 	const numClicks = 5;
-	const clicks = Array(numClicks).fill().map(_ => ([0, 0, -Infinity]));
+	const clicks = Array(numClicks)
+		.fill()
+		.map((_) => [0, 0, -Infinity]);
 	let aspectRatio = 1;
 
 	let index = 0;

js/regl/renderer.js

@@ -23,7 +23,6 @@ const effects = {
 };
 
 export default class REGLRenderer extends Renderer {
-
 	#renderFunc;
 	#regl;
 	#glMatrix;
@@ -38,7 +37,12 @@ export default class REGLRenderer extends Renderer {
 				"WEBGL_color_buffer_float",
 				"OES_standard_derivatives",
 			];
-			this.#regl = libraries.createREGL({ canvas: this.canvas, pixelRatio: 1, extensions, optionalExtensions });
+			this.#regl = libraries.createREGL({
+				canvas: this.canvas,
+				pixelRatio: 1,
+				extensions,
+				optionalExtensions,
+			});
 			this.#glMatrix = libraries.glMatrix;
 		});
 	}
@@ -79,7 +83,6 @@ export default class REGLRenderer extends Renderer {
 		});
 
 		this.#renderFunc = (reglContext) => {
-
 			if (config.once) {
 				this.stop();
 			}
@@ -102,7 +105,7 @@ export default class REGLRenderer extends Renderer {
 			if (config.useCamera) {
 				cameraTex(cameraCanvas);
 			}
-			const {viewportWidth, viewportHeight} = reglContext;
+			const { viewportWidth, viewportHeight } = reglContext;
 			if (dimensions.width !== viewportWidth || dimensions.height !== viewportHeight) {
 				dimensions.width = viewportWidth;
 				dimensions.height = viewportHeight;
@@ -118,7 +121,7 @@ export default class REGLRenderer extends Renderer {
 			});
 		};
 
-		const frame = this.#regl.frame(o => {
+		const frame = this.#regl.frame((o) => {
 			this.#renderFunc(o);
 			frame.cancel();
 		});
@@ -131,10 +134,10 @@ export default class REGLRenderer extends Renderer {
 
 	update(now) {
 		if (this.#renderFunc != null) {
-			const frame = this.#regl.frame(o => {
+			const frame = this.#regl.frame((o) => {
 				this.#renderFunc(o);
 				frame.cancel();
-			})
+			});
 		}
 		super.update(now);
 	}

js/renderer.js

@@ -1,7 +1,6 @@
 import fetchLibraries from "./fetchLibraries.js";
 
 export default class Renderer {
-
 	static libraries = fetchLibraries();
 	#type;
 	#canvas;
@@ -16,13 +15,17 @@ export default class Renderer {
 	constructor(type, ready) {
 		this.#type = type;
 		this.#canvas = document.createElement("canvas");
-		this.#ready = Renderer.libraries.then(libraries => {
-			this.#cache = new Map(libraries.staticAssets);
-		}).then(ready);
+		this.#ready = Renderer.libraries
+			.then((libraries) => {
+				this.#cache = new Map(libraries.staticAssets);
+			})
+			.then(ready);
 		this.#ready.then(() => this.start());
 	}
 
-	get running() { return this.#running; }
+	get running() {
+		return this.#running;
+	}
 
 	start() {
 		this.#running = true;
@@ -35,18 +38,28 @@ export default class Renderer {
 
 	update(now) {
 		if (!this.#running) return;
-		requestAnimationFrame(now => this.update(now));
+		requestAnimationFrame((now) => this.update(now));
 	}
 
-	get canvas() { return this.#canvas; }
+	get canvas() {
+		return this.#canvas;
+	}
 
-	get cache() { return this.#cache; }
+	get cache() {
+		return this.#cache;
+	}
 
-	get type () { return this.#type; }
+	get type() {
+		return this.#type;
+	}
 
-	get ready () { return this.#ready; }
+	get ready() {
+		return this.#ready;
+	}
 
-	get size() { return ([this.#width, this.#height]); }
+	get size() {
+		return [this.#width, this.#height];
+	}
 
 	set size([width, height]) {
 		[width, height] = [Math.ceil(width), Math.ceil(height)];
@@ -54,7 +67,9 @@ export default class Renderer {
 		[this.#canvas.width, this.#canvas.height] = [this.#width, this.#height] = [width, height];
 	}
 
-	get fullscreen() { return this.#fullscreen; }
+	get fullscreen() {
+		return this.#fullscreen;
+	}
 
 	set fullscreen(value) {
 		if (!!value === this.#fullscreen) return;
@@ -80,7 +95,9 @@ export default class Renderer {
 		}
 	}
 
-	get destroyed() { return this.#destroyed; }
+	get destroyed() {
+		return this.#destroyed;
+	}
 
 	destroy() {
 		this.stop();

js/webgpu/renderer.js

@@ -25,7 +25,6 @@ const effects = {
 };
 
 export default class REGLRenderer extends Renderer {
-
 	#glMatrix;
 	#device;
 	#canvasContext;
@@ -72,7 +71,6 @@ export default class REGLRenderer extends Renderer {
 		}
 
 		this.#rebuildingPipeline = (async () => {
-
 			const glMatrix = this.#glMatrix;
 			const canvas = this.canvas;
 			const cache = this.cache;
@@ -205,10 +203,10 @@ export default class REGLRenderer extends Renderer {
 		if (this.destroyed) return;
 		const oldDevice = this.#device;
 		if (oldDevice != null) {
-			(async () => {
+			async () => {
 				await oldDevice.queue.onSubmittedWorkDone();
 				oldDevice.destroy();
-			});
+			};
 		}
 		this.#device = null;
 		super.destroy();

js/webgpu/utils.js

@@ -1,10 +1,7 @@
 const loadTexture = async (device, cache, url) => {
-
 	const format = "rgba8unorm";
 	const usage =
-		GPUTextureUsage.TEXTURE_BINDING |
-		GPUTextureUsage.COPY_DST |
-		GPUTextureUsage.RENDER_ATTACHMENT;
+		GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST | GPUTextureUsage.RENDER_ATTACHMENT;
 
 	if (url == null) {
 		return device.createTexture({