From 29876f0c2b52677883ceac36e4b889e25b64742e Mon Sep 17 00:00:00 2001 From: Danila Poyarkov Date: Wed, 25 Mar 2026 00:32:06 +0300 Subject: [PATCH] Await font loading before first canvas render The initial renderNow() fired before loadFonts() completed, causing text measurement to return null on slower connections (especially Safari). Layout computed without text dimensions got corrupted. Move loadFonts() into the async init() flow and only render after fonts are ready. --- packages/vue/src/shared/useCanvas.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/vue/src/shared/useCanvas.ts b/packages/vue/src/shared/useCanvas.ts index 28afa4e1e..5aa06d1b9 100644 --- a/packages/vue/src/shared/useCanvas.ts +++ b/packages/vue/src/shared/useCanvas.ts @@ -101,6 +101,8 @@ export function useCanvas( await new Promise((r) => requestAnimationFrame(r)) createSurface(canvas) + await renderer?.loadFonts() + if (!destroyed) renderNow() } function sizeCanvas(canvas: HTMLCanvasElement) { @@ -151,8 +153,6 @@ export function useCanvas( const glCtx = canvas.getContext('webgl2') ?? null renderer = new SkiaRenderer(ck, surface, glCtx) editor.setCanvasKit(ck, renderer) - void renderer.loadFonts().then(() => renderNow()) - renderNow() canvas.dataset.ready = '1' options?.onReady?.() }