overhead investigation + optimization

server.py

@@ -215,6 +215,13 @@ def multlist(bit_count: int = 2, min: int = -10, max: int = 20, mode: str = "Sta
 
 @app.post("/api/compress")
 async def compress(request: Request):
+    stages = {}
+    t = time.perf_counter()
+    def mark(name):
+        nonlocal t
+        stages[name] = round(time.perf_counter() - t, 3)
+        t = time.perf_counter()
+
     form = await request.form()
     upload = form.get("image")
     if upload is None:
@@ -225,6 +232,7 @@ async def compress(request: Request):
     except Exception as exc:
         return JSONResponse({"error": f"Could not read image: {exc}"}, status_code=400)
     w, h = img.size
+    mark("read_decode")
 
     mode = form.get("mode", "Auto")
     if mode == "Auto":
@@ -242,24 +250,33 @@ async def compress(request: Request):
             except (ValueError, TypeError):
                 pass
         config = PBC3Config(**kwargs)
+    mark("build_config")
 
     try:
         result = PBC3.compress(img, config=config)
     except Exception as exc:
         return JSONResponse({"error": f"Compression failed: {exc}"}, status_code=400)
     reconstructed = result.image.convert("RGB")
+    mark("compress")
 
     a = np.asarray(img, dtype=np.float32)
     b = np.asarray(reconstructed.resize(img.size), dtype=np.float32)
     mse = mse_metric(a, b)
+    mark("mse")
+
+    recon_b64 = _png_b64(reconstructed)          # original is now sent by the client (it has the bytes)
+    mark("png_reconstructed")
+
+    pbc_b64 = base64.b64encode(result.data).decode()
+    mark("encode_payload")
 
     original_raw = w * h * 3
     compressed = len(result.data)
+    print(f"[compress] encode={result.encode_seconds:.3f}s  stages={stages}", flush=True)
 
     return JSONResponse({
-        "original_image": _png_b64(img),
-        "reconstructed_image": _png_b64(reconstructed),
-        "pbc_base64": base64.b64encode(result.data).decode(),
+        "reconstructed_image": recon_b64,
+        "pbc_base64": pbc_b64,
         "width": w,
         "height": h,
         "original_raw_kb": round(original_raw / 1024, 2),
@@ -269,10 +286,10 @@ async def compress(request: Request):
         "compression_percent": round(compressed / original_raw * 100, 2) if original_raw else 0,
         "mse": round(mse, 2),
         "time_seconds": round(result.encode_seconds, 2),
+        "stage_timings": stages,
         "params": {"mode": mode, **{k: (list(v) if isinstance(v, tuple) else v) for k, v in kwargs.items()}},
     })
 
-
 @app.post("/api/stream_compress")
 async def stream_compress(image: UploadFile = File(...), downsample_initialize: str = Form("false")):
     raw = await image.read()

static/app.js

@@ -604,7 +604,16 @@ function renderJob(job) {
 function updateJobMeta(job) {
   const m = job.el.querySelector(".job-meta");
   if (job.status === "sent") m.textContent = `${((performance.now() - job.tSent) / 1000).toFixed(1)}s`;
-  else if (job.status === "done") m.textContent = `total ${job.total.toFixed(1)}s · encode ${job.encode.toFixed(2)}s · overhead ${Math.max(0, job.total - job.encode).toFixed(1)}s`;
+  else if (job.status === "done") {
+    let s = `total ${job.total.toFixed(1)}s · encode ${job.encode.toFixed(2)}s · overhead ${Math.max(0, job.total - job.encode).toFixed(1)}s`;
+    if (job.stages) {
+      const top = Object.entries(job.stages).sort((a, b) => b[1] - a[1]).slice(0, 3)
+        .map(([k, v]) => `${k} ${v}s`).join(" · ");
+      s += `<br><span style="opacity:.65">server: ${top}</span>`;
+    }
+    job.el.querySelector(".job-meta").innerHTML = s;
+    return;
+  }
   else if (job.status === "error") m.textContent = "failed — see console";
   else m.textContent = "waiting…";
 }
@@ -628,7 +637,7 @@ function scheduleJobRemoval(job) {
 }
 
 function enqueueJob(file) {
-  const job = { name: file.name, fd: buildCompressForm(file), status: "queued" };
+  const job = { name: file.name, file, fd: buildCompressForm(file), status: "queued" };
   job.el = renderJob(job);
   jobQueueEl.appendChild(job.el);
   jobQueue.push(job);
@@ -657,6 +666,14 @@ async function runJob(job) {
     const data = await res.json();
     job.total = (performance.now() - job.tSent) / 1000;
     job.encode = data.time_seconds;
+    job.stages = data.stage_timings;
+    if (job.file && !data.decoded && !data.original_image) {
+      data.original_image = await new Promise(r => {
+        const fr = new FileReader();
+        fr.onload = () => r(fr.result);
+        fr.readAsDataURL(job.file);
+      });
+    }
     setJobState(job, "done");
     addToRegistry(data);
     showLastResult(data);