Add parallel compiler

src/graphics/graphics-library/compiling/check-program.ts

@@ -1,13 +0,0 @@
-import { checkShader } from './check-shader';
-
-export const checkProgram = (gl: WebGL2RenderingContext, program: WebGLProgram) => {
-  const success = gl.getProgramParameter(program, gl.LINK_STATUS);
-
-  if (!success && !gl.isContextLost()) {
-    gl.getAttachedShaders(program)?.forEach((s) => {
-      checkShader(gl, s);
-    });
-
-    throw new Error(gl.getProgramInfoLog(program)!);
-  }
-};

src/graphics/graphics-library/compiling/check-shader.ts

@@ -1,7 +0,0 @@
-export const checkShader = (gl: WebGL2RenderingContext, shader: WebGLShader) => {
-  const success = gl.getShaderParameter(shader, gl.COMPILE_STATUS);
-
-  if (!success && !gl.isContextLost()) {
-    throw new Error(gl.getShaderInfoLog(shader)!);
-  }
-};

src/graphics/graphics-library/compiling/create-program.ts

@@ -1,47 +0,0 @@
-import { checkProgram } from './check-program';
-import { createShader } from './create-shader';
-
-export const createProgram = (
-  gl: WebGL2RenderingContext,
-  vertexShaderSource: string,
-  fragmentShaderSource: string,
-  substitutions: { [name: string]: string }
-): WebGLProgram => {
-  // can only return null on lost context
-  const program = gl.createProgram()!;
-
-  // const extension = tryEnableExtension(gl, 'KHR_parallel_shader_compile');
-
-  const vertexShader = createShader(
-    gl,
-    gl.VERTEX_SHADER,
-    vertexShaderSource,
-    substitutions
-  );
-  gl.attachShader(program, vertexShader);
-
-  const fragmentShader = createShader(
-    gl,
-    gl.FRAGMENT_SHADER,
-    fragmentShaderSource,
-    substitutions
-  );
-
-  gl.attachShader(program, fragmentShader);
-
-  gl.linkProgram(program);
-
-  /*if (extension) {
-    const checkCompileStatus = () =>
-      gl.getProgramParameter(program, extension.COMPLETION_STATUS_KHR);
-
-    await waitWhileFalse(checkCompileStatus);
-  }*/
-
-  checkProgram(gl, program);
-
-  gl.deleteShader(vertexShader);
-  gl.deleteShader(fragmentShader);
-
-  return program;
-};

src/graphics/graphics-library/compiling/create-shader.ts

@@ -1,19 +0,0 @@
-export const createShader = (
-  gl: WebGL2RenderingContext,
-  type: GLenum,
-  source: string,
-  substitutions: { [name: string]: string }
-): WebGLShader => {
-  source = source.replace(/{(.+)}/gm, (_, name: string): string => {
-    const value = substitutions[name];
-    return Number.isInteger(value) ? `${value}.0` : value;
-  });
-
-  // can only return null on lost context
-  const shader = gl.createShader(type)!;
-
-  gl.shaderSource(shader, source);
-  gl.compileShader(shader);
-
-  return shader;
-};

src/graphics/graphics-library/parallel-compiler.ts

@@ -0,0 +1,131 @@
+import { wait } from '../../helper/wait';
+import { Insights } from '../rendering/insights';
+import { tryEnableExtension } from './helper/enable-extension';
+
+type CompilingProgram = {
+  program: WebGLProgram;
+  resolvePromise: ((program: WebGLProgram) => void) | null;
+};
+
+export abstract class ParallelCompiler {
+  private static extension?: any;
+  private static gl: WebGL2RenderingContext;
+  private static programs: Array<CompilingProgram> = [];
+
+  public static initialize(gl: WebGL2RenderingContext) {
+    ParallelCompiler.gl = gl;
+    ParallelCompiler.extension = tryEnableExtension(gl, 'KHR_parallel_shader_compile');
+  }
+
+  public static createProgram(
+    vertexShaderSource: string,
+    fragmentShaderSource: string,
+    substitutions: { [name: string]: string }
+  ): Promise<WebGLProgram> {
+    let resolvePromise: ((program: WebGLProgram) => void) | null = null;
+    const promise = new Promise<WebGLProgram>((r) => (resolvePromise = r));
+
+    // can only return null on lost context
+    const program = ParallelCompiler.gl.createProgram()!;
+
+    ParallelCompiler.compileShader(
+      vertexShaderSource,
+      ParallelCompiler.gl.VERTEX_SHADER,
+      program,
+      substitutions
+    );
+
+    ParallelCompiler.compileShader(
+      fragmentShaderSource,
+      ParallelCompiler.gl.FRAGMENT_SHADER,
+      program,
+      substitutions
+    );
+
+    ParallelCompiler.programs.push({
+      program,
+      resolvePromise,
+    });
+
+    return promise;
+  }
+
+  public static async compilePrograms(): Promise<void> {
+    ParallelCompiler.programs.forEach((p) => ParallelCompiler.gl.linkProgram(p.program));
+
+    Insights.setValue('program count', ParallelCompiler.programs.length);
+
+    while (ParallelCompiler.programs.length > 0) {
+      ParallelCompiler.resolveFinishedPrograms();
+      await wait(0);
+    }
+  }
+
+  private static compileShader(
+    source: string,
+    type: GLenum,
+    program: WebGLProgram,
+    substitutions: { [name: string]: string }
+  ) {
+    const processedSource = source.replace(/{(.+)}/gm, (_, name: string): string => {
+      const value = substitutions[name];
+      return Number.isInteger(value) ? `${value}.0` : value;
+    });
+
+    // can only return null on lost context
+    const shader = ParallelCompiler.gl.createShader(type)!;
+
+    this.gl.shaderSource(shader, processedSource);
+    this.gl.compileShader(shader);
+    this.gl.attachShader(program, shader);
+    this.gl.deleteShader(shader);
+  }
+
+  private static resolveFinishedPrograms() {
+    const done: Array<CompilingProgram> = [];
+
+    ParallelCompiler.programs.forEach((p) => {
+      if (
+        !ParallelCompiler.extension ||
+        ParallelCompiler.gl.getProgramParameter(
+          p.program,
+          ParallelCompiler.extension.COMPLETION_STATUS_KHR
+        )
+      ) {
+        ParallelCompiler.checkProgram(p.program);
+        done.push(p);
+        p.resolvePromise!(p.program);
+      }
+    });
+
+    ParallelCompiler.programs = ParallelCompiler.programs.filter(
+      (p1) => done.findIndex((p2) => p2 === p1) == -1
+    );
+  }
+
+  private static checkProgram(program: WebGLProgram) {
+    const success = ParallelCompiler.gl.getProgramParameter(
+      program,
+      ParallelCompiler.gl.LINK_STATUS
+    );
+
+    if (!success && !ParallelCompiler.gl.isContextLost()) {
+      ParallelCompiler.gl.getAttachedShaders(program)?.forEach((s) => {
+        ParallelCompiler.checkShader(s);
+      });
+
+      throw new Error(ParallelCompiler.gl.getProgramInfoLog(program)!);
+    }
+  }
+
+  private static checkShader(shader: WebGLShader) {
+    const success = ParallelCompiler.gl.getShaderParameter(
+      shader,
+      ParallelCompiler.gl.COMPILE_STATUS
+    );
+
+    if (!success && !ParallelCompiler.gl.isContextLost()) {
+      throw new Error(ParallelCompiler.gl.getShaderInfoLog(shader)!);
+    }
+  }
+}

src/graphics/graphics-library/program/fragment-shader-only-program.ts

@@ -3,12 +3,15 @@ import Program from './program';
 export class FragmentShaderOnlyProgram extends Program {
   private vao?: WebGLVertexArrayObject;
 
-  constructor(
-    gl: WebGL2RenderingContext,
+  constructor(gl: WebGL2RenderingContext) {
+    super(gl);
+  }
+
+  public async initialize(
     sources: [string, string],
     substitutions: { [name: string]: string }
-  ) {
-    super(gl, sources, substitutions);
+  ): Promise<void> {
+    await super.initialize(sources, substitutions);
     this.prepareScreenQuad('vertexPosition');
   }
 

src/graphics/graphics-library/program/program.ts

@@ -1,6 +1,6 @@
 import { mat2d, vec2 } from 'gl-matrix';
-import { createProgram } from '../compiling/create-program';
 import { loadUniform } from '../helper/load-uniform';
+import { ParallelCompiler } from '../parallel-compiler';
 import { IProgram } from './i-program';
 
 export default abstract class Program implements IProgram {
@@ -14,15 +14,15 @@ export default abstract class Program implements IProgram {
     type: GLenum;
   }> = [];
 
-  constructor(
-    protected gl: WebGL2RenderingContext,
+  constructor(protected gl: WebGL2RenderingContext) {}
+
+  public async initialize(
     [vertexShaderSource, fragmentShaderSource]: [string, string],
     substitutions: { [name: string]: string }
-  ) {
+  ): Promise<void> {
     substitutions = { ...substitutions };
 
-    this.program = createProgram(
-      this.gl,
+    this.program = await ParallelCompiler.createProgram(
       vertexShaderSource,
       fragmentShaderSource,
       substitutions

src/graphics/graphics-library/program/uniform-array-autoscaling-program.ts

@@ -12,24 +12,34 @@ export class UniformArrayAutoScalingProgram implements IProgram {
   }> = [];
 
   private current?: FragmentShaderOnlyProgram;
+  private descriptors?: Array<DrawableDescriptor>;
   private drawingRectangleBottomLeft = vec2.fromValues(0, 0);
   private drawingRectangleSize = vec2.fromValues(1, 1);
 
-  constructor(
-    private gl: WebGL2RenderingContext,
+  constructor(private gl: WebGL2RenderingContext) {}
+
+  public async initialize(
     shaderSources: [string, string],
-    private descriptors: Array<DrawableDescriptor>,
-    private substitutions: { [name: string]: any }
-  ) {
+    descriptors: Array<DrawableDescriptor>,
+    substitutions: { [name: string]: any }
+  ): Promise<void> {
+    this.descriptors = descriptors;
+
+    const promises: Array<Promise<void>> = [];
+
     for (const combination of getCombinations(
       descriptors.map((o) => o.shaderCombinationSteps)
     )) {
-      this.createProgram(descriptors, combination, shaderSources);
+      promises.push(
+        this.createProgram(descriptors, substitutions, combination, shaderSources)
+      );
     }
+
+    await Promise.all(promises);
   }
 
   public bindAndSetUniforms(uniforms: { [name: string]: any }): void {
-    const values = this.descriptors.map((d) =>
+    const values = this.descriptors!.map((d) =>
       uniforms[d.uniformName] ? uniforms[d.uniformName].length : 0
     );
 
@@ -38,7 +48,7 @@ export class UniformArrayAutoScalingProgram implements IProgram {
     this.current = closest ? closest.program : last(this.programs)?.program;
 
     if (closest) {
-      this.descriptors.map((d, i) => {
+      this.descriptors!.map((d, i) => {
         const difference = closest.values[i] - values[i];
         for (let i = 0; i < difference; i++) {
           d.empty.serializeToUniforms(uniforms, mat2d.create(), 0);
@@ -70,26 +80,26 @@ export class UniformArrayAutoScalingProgram implements IProgram {
     this.programs.forEach((p) => p.program.delete());
   }
 
-  private createProgram(
+  private async createProgram(
     descriptors: Array<DrawableDescriptor>,
+    substitutions: { [name: string]: any },
     combination: Array<number>,
     shaderSources: [string, string]
-  ): FragmentShaderOnlyProgram {
-    const substitutions = {
-      ...this.substitutions,
+  ): Promise<void> {
+    const processedSubstitutions = {
+      ...substitutions,
       macroDefinitions: this.getMacroDefinitions(combination, descriptors),
       declarations: this.getDeclarations(combination, descriptors),
       functionCalls: this.getFunctionCalls(combination, descriptors),
     };
 
-    const program = new FragmentShaderOnlyProgram(this.gl, shaderSources, substitutions);
+    const program = new FragmentShaderOnlyProgram(this.gl);
+    await program.initialize(shaderSources, processedSubstitutions);
 
     this.programs.push({
       program,
       values: combination,
     });
-
-    return program;
   }
 
   private getMacroDefinitions(
@@ -97,13 +107,7 @@ export class UniformArrayAutoScalingProgram implements IProgram {
     descriptors: Array<DrawableDescriptor>
   ): string {
     return combination
-      .map(
-        (v, i) => `
-      #ifndef ${descriptors[i].uniformCountMacroName}
-        #define ${descriptors[i].uniformCountMacroName} ${v}
-      #endif
-      `
-      )
+      .map((v, i) => `#define ${descriptors[i].uniformCountMacroName} ${v}`)
       .join('\n');
   }