chore: add timers

src/data/blob.ts

@@ -267,22 +267,29 @@ export const canvasToBlob = async (
     tileDataArray[tileY][tileX] = imageData;
   }
 
+  console.time("tiling");
   // Iterate over the tiles and process each one
   for (let tileY = 0; tileY < canvasHeight / tileHeight; tileY++) {
     for (let tileX = 0; tileX < canvasWidth / tileWidth; tileX++) {
       processTile(tileX, tileY);
     }
   }
+  console.timeEnd("tiling");
 
+  console.time("create png");
   // Create a new PNG image with the final dimensions
   const finalImage = new PNG({ width: canvasWidth, height: canvasHeight });
+  console.timeEnd("create png");
 
+  console.time("concat tiles");
   // Merge the tiles into the final image
   for (let tileY = 0; tileY < canvasHeight / tileHeight; tileY++) {
     for (let tileX = 0; tileX < canvasWidth / tileWidth; tileX++) {
       const imageData = tileDataArray[tileY][tileX];
       const destX = tileX * tileWidth;
       const destY = tileY * tileHeight;
+
+      // Copy the pixels from the tile to the final image
       for (let y = 0; y < tileHeight; y++) {
         for (let x = 0; x < tileWidth; x++) {
           const index = (y * tileWidth + x) * 4;
@@ -295,8 +302,11 @@ export const canvasToBlob = async (
       }
     }
   }
+  console.timeEnd("concat tiles");
 
+  console.time("create buffer");
   const buffer = PNG.sync.write(finalImage);
+  console.timeEnd("create buffer");
 
   return new Blob([buffer], { type: "image/png" });
 };

src/data/index.ts

@@ -74,11 +74,10 @@ export const exportCanvas = async (
   tempCanvas.style.display = "none";
   document.body.appendChild(tempCanvas);
 
-  console.log("tempCanvas", tempCanvas.width, tempCanvas.height);
-
   if (type === "png") {
+    console.time("export png");
     let blob = await canvasToBlob(tempCanvas);
-    console.log("final blob size", blob.size);
+    console.timeEnd("export png");
     tempCanvas.remove();
     if (appState.exportEmbedScene) {
       blob = await (