Minify shaders

src/macros/build.ts

@@ -25,3 +25,17 @@ export const renderStylus = async () => {
 export const compressCss = (css: string) => {
     return (stylus(css, {}).set('compress', true)).render();
 };
+
+export const compressCode = (code: string): string => {
+    return code.split('\n') // Split into lines
+        .map(line => line.startsWith('#') || line.startsWith('@') ? line + '\n' : line.trim()) // Trim spaces, with exceptions for shader files
+        .filter(line => line && !line.startsWith('//')) // Remove empty and commented lines
+        .join(''); // Join into a single line
+};
+
+export const compressCodeFile = async (path: string) => {
+    const file = Bun.file(path);
+    const code = await file.text();
+
+    return compressCode(code);
+};

src/modules/player/webgl2/webgl2-player.ts

@@ -1,5 +1,5 @@
-import vertClarityBoost from "./shaders/clarity-boost.vert" with { type: "text" };
-import fsClarityBoost from "./shaders/clarity-boost.fs" with { type: "text" };
+import { compressCodeFile } from "@macros/build" with { type: "macro" };
+
 import { StreamPref } from "@/enums/pref-keys";
 import { getStreamPref } from "@/utils/pref-utils";
 import { BaseCanvasPlayer } from "../base-canvas-player";
@@ -53,11 +53,11 @@ export class WebGL2Player extends BaseCanvasPlayer {
 
         // Vertex shader: Identity map
         const vShader = gl.createShader(gl.VERTEX_SHADER)!;
-        gl.shaderSource(vShader, vertClarityBoost);
+        gl.shaderSource(vShader, compressCodeFile('./src/modules/player/webgl2/shaders/clarity-boost.vert') as any as string);
         gl.compileShader(vShader);
 
         const fShader = gl.createShader(gl.FRAGMENT_SHADER)!;
-        gl.shaderSource(fShader, fsClarityBoost);
+        gl.shaderSource(fShader, compressCodeFile('./src/modules/player/webgl2/shaders/clarity-boost.fs') as any as string);
         gl.compileShader(fShader);
 
         // Create and link program

src/modules/player/webgpu/webgpu-player.ts

@@ -1,4 +1,5 @@
-import wgslClarityBoost from "./shaders/clarity-boost.wgsl" with { type: "text" };
+import { compressCodeFile } from "@macros/build" with { type: "macro" };
+
 import { BaseCanvasPlayer } from "../base-canvas-player";
 import { StreamPlayerType } from "@/enums/pref-values";
 import { BxEventBus } from "@/utils/bx-event-bus";
@@ -70,7 +71,7 @@ export class WebGPUPlayer extends BaseCanvasPlayer {
         ]);
         this.vertexBuffer.unmap();
 
-        const shaderModule = WebGPUPlayer.device.createShaderModule({ code: wgslClarityBoost });
+        const shaderModule = WebGPUPlayer.device.createShaderModule({ code: compressCodeFile('./src/modules/player/webgpu/shaders/clarity-boost.wgsl') as any as string });
         this.pipeline = WebGPUPlayer.device.createRenderPipeline({
             layout: 'auto',
             vertex: {