Skip to content

Use vello in WebWorker #148

@xiaoiver

Description

@xiaoiver

https://infinitecanvas.cc/reference/vello

使用 OffscreenCanvas + Worker 解耦主线程:

// 将 Vello 渲染移到 Worker
// worker.js
self.onmessage = async (e) => {
    const { imageBuffer, width, height } = e.data;
    // WASM 渲染
    const bitmap = await self.velloRenderer.render(imageBuffer);
    // 返回 ImageBitmap(零拷贝)
    self.postMessage({ bitmap }, [bitmap]);
};

// 主线程
worker.postMessage({ imageBuffer: sharedArrayBuffer }, [sharedArrayBuffer]);
worker.onmessage = (e) => {
    ctx.transferFromImageBitmap(e.data.bitmap); // 极快的 GPU 合成
};

Metadata

Metadata

Assignees

Labels

No labels
No labels

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions