9.7s Do not create a new ImageData object every render

Jumbub · Mar 28, 2022 · 79ff8a0 · 79ff8a0
1 parent 8d4d13b
commit 79ff8a0
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/src/graphics/loop.ts b/src/graphics/loop.ts
@@ -11,6 +11,7 @@ export type Meta = {
   generationsAndMax: Uint32Array; // [computations, maxGenerations]
   renders: number;
   rendersMinimumMilliseconds: number;
+  imageData: ImageData;
   onDone: (meta: Meta) => void;
 };
 
@@ -34,6 +35,7 @@ export const setup = async (
       generationsAndMax,
       rendersMinimumMilliseconds,
       onDone,
+      imageData: new ImageData(viewWidth + 2, viewHeight + 2),
       renders: 0,
     };
 
@@ -51,7 +53,7 @@ export const setup = async (
 };
 
 export const run = (meta: Meta) => {
-  const renderLambda = () => render(meta.board, meta.context);
+  const renderLambda = () => render(meta.imageData, meta.board, meta.context);
 
   const interval = setInterval(() => {
     const [generations, maxGenerations] = meta.generationsAndMax;

diff --git a/src/graphics/render.ts b/src/graphics/render.ts
@@ -5,10 +5,9 @@ export const DEAD_COLOR_32 = 16777215;
 
 const COLOR_DIFF = ALIVE_COLOR_32 - DEAD_COLOR_32;
 
-export const render = (board: Board, context: CanvasRenderingContext2D) => {
+export const render = (image: ImageData, board: Board, context: CanvasRenderingContext2D) => {
   const { width, height } = board;
 
-  const image = new ImageData(width, height);
   const image32 = new Uint32Array(image.data.buffer);
   const size = width * height;