chore: add performance test

Related to #96

Author: Skaiir

test/spec/MinimapSpec.js

@@ -258,6 +258,97 @@ describe('minimap', function() {
       expectMinimapShapeToExist('child');
     }));
 
+
+    // only use in isolation performance testing, this isn't a proper test and shouldn't run on CI
+    it.only('performance test', inject(function(canvas, modeling, elementFactory, minimap) {
+
+      const GRID_MATRIX = [
+        [ 4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,3,3,3,3,3,3,4,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,0,0,0,0,2,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,1,1,1,1,1,0,3,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,1,4,4,1,1,2,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,1,4,4,1,0,2,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,1,4,4,1,0,2,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,1,3,2,1,1,3,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,0,0,0,0,2,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,1,1,1,0,1,3,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,1,4,4,1,0,2,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,1,4,4,2,0,1,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,1,4,4,2,0,1,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,1,4,4,2,1,1,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,1,1,2,2,1,0,2,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,0,0,0,0,1,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,3,2,2,2,2,2,4,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,3,3,3,3,3,3,3,3,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,0,0,0,0,0,2,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,1,1,1,1,1,1,2,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,2,0,0,0,0,0,0,2,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,3,2,2,2,2,2,2,3,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4 ],
+        [ 4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4,4 ]
+      ];
+
+      const root = canvas.getRootElement();
+      const CELL = 40;
+      const GAP = 4;
+      const CHUNK = 150;
+
+      const tasks = [];
+
+      GRID_MATRIX.forEach((row, rIdx) => {
+        row.forEach((layers, cIdx) => {
+          for (let l = 0; l < layers; l++) {
+            const shrink = l * GAP;
+            const size = CELL - shrink * 2;
+            if (size <= 4) continue;
+            tasks.push({
+              id: `grid_${rIdx}_${cIdx}_${l}`,
+              x: cIdx * CELL + shrink,
+              y: rIdx * CELL + shrink,
+              width: size,
+              height: size
+            });
+          }
+        });
+      });
+
+      let index = 0;
+
+      function processChunk() {
+        const end = Math.min(index + CHUNK, tasks.length);
+
+        for (; index < end; index++) {
+          const t = tasks[index];
+          const shape = elementFactory.createShape({
+            id: t.id,
+            x: t.x,
+            y: t.y,
+            width: t.width,
+            height: t.height
+          });
+          modeling.createShape(shape, { x: shape.x, y: shape.y }, root);
+        }
+
+        if (index < tasks.length) {
+          requestAnimationFrame(processChunk);
+        } else {
+
+          setTimeout(() => {
+            minimap._update();
+          }, 100);
+        }
+      }
+
+      requestAnimationFrame(processChunk);
+    }));
+
   });