Improved performance addLine, suggestion #2

dist/WebglBaseLine.d.ts

@@ -3,6 +3,9 @@ import { ColorRGBA } from "./ColorRGBA";
  * Baseline class
  */
 export declare class WebglBaseLine {
+ private static readonly vertCode;
+ private static readonly fragCode;
+ private static program;
  intensity: number;
  visible: boolean;
  /**
@@ -63,6 +66,8 @@ export declare class WebglBaseLine {
  * @internal
  */
  _coord: number;
+ initProgram(webgl: WebGLRenderingContext): void;
+ private createProgram;
  /**
  * @internal
  */

dist/webglplot.esm.js

@@ -26,7 +26,40 @@ class WebglBaseLine {
  this.visible = true;
  this.intensity = 1;
  }
+ initProgram(webgl) {
+ if (!WebglBaseLine.program) {
+ this.createProgram(webgl);
+ }
+ this._prog = WebglBaseLine.program;
+ }
+ createProgram(webgl) {
+ const vertShader = webgl.createShader(webgl.VERTEX_SHADER);
+ webgl.shaderSource(vertShader, WebglBaseLine.vertCode);
+ webgl.compileShader(vertShader);
+ const fragShader = webgl.createShader(webgl.FRAGMENT_SHADER);
+ webgl.shaderSource(fragShader, WebglBaseLine.fragCode);
+ webgl.compileShader(fragShader);
+ WebglBaseLine.program = webgl.createProgram();
+ webgl.attachShader(WebglBaseLine.program, vertShader);
+ webgl.attachShader(WebglBaseLine.program, fragShader);
+ webgl.linkProgram(WebglBaseLine.program);
+ }
 }
+WebglBaseLine.vertCode = `
+ attribute vec2 coordinates;
+ uniform mat2 uscale;
+ uniform vec2 uoffset;
+
+ void main(void) {
+ gl_Position = vec4(uscale*coordinates + uoffset, 0.0, 1.0);
+ }`;
+WebglBaseLine.fragCode = `
+ precision mediump float;
+ uniform highp vec4 uColor;
+
+ void main(void) {
+ gl_FragColor = uColor;
+ }`;
 
 /**
  * The standard Line class
@@ -385,37 +418,10 @@ class WebGLPlot {
  * ```
  */
  addLine(line) {
+ line.initProgram(this.webgl);
  line._vbuffer = this.webgl.createBuffer();
  this.webgl.bindBuffer(this.webgl.ARRAY_BUFFER, line._vbuffer);
  this.webgl.bufferData(this.webgl.ARRAY_BUFFER, line.xy, this.webgl.STREAM_DRAW);
- const vertCode = `
- attribute vec2 coordinates;
- uniform mat2 uscale;
- uniform vec2 uoffset;
-
- void main(void) {
- gl_Position = vec4(uscale*coordinates + uoffset, 0.0, 1.0);
- }`;
- // Create a vertex shader object
- const vertShader = this.webgl.createShader(this.webgl.VERTEX_SHADER);
- // Attach vertex shader source code
- this.webgl.shaderSource(vertShader, vertCode);
- // Compile the vertex shader
- this.webgl.compileShader(vertShader);
- // Fragment shader source code
- const fragCode = `
- precision mediump float;
- uniform highp vec4 uColor;
- void main(void) {
- gl_FragColor = uColor;
- }`;
- const fragShader = this.webgl.createShader(this.webgl.FRAGMENT_SHADER);
- this.webgl.shaderSource(fragShader, fragCode);
- this.webgl.compileShader(fragShader);
- line._prog = this.webgl.createProgram();
- this.webgl.attachShader(line._prog, vertShader);
- this.webgl.attachShader(line._prog, fragShader);
- this.webgl.linkProgram(line._prog);
  this.webgl.bindBuffer(this.webgl.ARRAY_BUFFER, line._vbuffer);
  line._coord = this.webgl.getAttribLocation(line._prog, "coordinates");
  this.webgl.vertexAttribPointer(line._coord, 2, this.webgl.FLOAT, false, 0, 0);