From c8a6d6c20a954c36904aadcbe8fafe3cf80b1027 Mon Sep 17 00:00:00 2001 From: Ben Vinegar Date: Thu, 2 Jul 2026 17:08:15 -0400 Subject: [PATCH] perf(viewer): lazy-load surface iframes --- .changeset/lazy-surface-iframes.md | 5 +++++ e2e/viewer.spec.ts | 1 + viewer/src/Card.tsx | 1 + 3 files changed, 7 insertions(+) create mode 100644 .changeset/lazy-surface-iframes.md diff --git a/.changeset/lazy-surface-iframes.md b/.changeset/lazy-surface-iframes.md new file mode 100644 index 0000000..452ed1f --- /dev/null +++ b/.changeset/lazy-surface-iframes.md @@ -0,0 +1,5 @@ +--- +"sideshow": patch +--- + +Lazy-load sandboxed surface iframes to reduce initial viewer work on long sessions. diff --git a/e2e/viewer.spec.ts b/e2e/viewer.spec.ts index 5c8fa55..94d1020 100644 --- a/e2e/viewer.spec.ts +++ b/e2e/viewer.spec.ts @@ -101,6 +101,7 @@ test("resize bridge grows the iframe beyond its 120px default", async ({ page, s await page.goto(server.url); const iframe = page.locator(".card iframe"); await expect(iframe).toBeVisible(); + await expect(iframe).toHaveAttribute("loading", "lazy"); // the sandboxed bridge must report content height via postMessage; this is // the WebKit-quirk regression test (see CLAUDE.md) await expect diff --git a/viewer/src/Card.tsx b/viewer/src/Card.tsx index 0f76934..bccbe2a 100644 --- a/viewer/src/Card.tsx +++ b/viewer/src/Card.tsx @@ -321,6 +321,7 @@ export function Card(props: { post: Post; standalone?: boolean }) { }); }} sandbox="allow-scripts" + loading="lazy" class={SURFACE_FRAME_CLASSES[surface.kind]} title={ props.post.surfaces.length > 1