必须在Worker内闭环完成海报生成：从OffscreenCanvas创建、字体/纹理加载、布局计算到transferToImageBitmap输出，全程脱离主线程，禁用任何DOM回退或同步读取。
可以，但必须把整个图表生成流程闭环在 Worker 内：从 OffscreenCanvas 创建、上下文初始化、字体/纹理加载、布局计算到像素输出，全部脱离主线程。任何一步回退 DOM 或同步读取都会让“异步海报生成”变成假异步，卡住 UI。
主线程只移交画布控制权，不参与渲染
海报生成不能依赖主线程 Canvas 元素实时渲染，而是用 transferControlToOffscreen() 把真实 canvas 控制权彻底交出：
- 主线程创建
<canvas id="poster-canvas" width="1200" height="1800">（按印刷级 DPI 预设尺寸，如 1200×1800 对应 A4@150dpi） - 立即调用
canvas.transferControlToOffscreen()，得到 OffscreenCanvas 实例 - 通过
postMessage({ canvas: offscreen }, [offscreen])移交——漏掉 transfer list 会导致对象为空，后续 getContext 静默失败 - 主线程不再操作该 canvas，也不轮询 drawImage；它只等 Worker 发来最终图像数据
Worker 内完整闭环图表生成链路
海报不是简单绘图，而是含文字排版、SVG 图标嵌入、渐变填充、高清导出的复合任务。所有环节必须在 Worker 中自洽：
-
字体加载：不能用
ctx.font = "16px sans-serif"等系统字体（WebGL/2D 在 Worker 中不支持 fillText 渲染）；改用createImageBitmap预渲染文字纹理，或集成 opentype.js 解析 TTF 并光栅化字形到 OffscreenCanvas -
图标与矢量元素：SVG 资源需提前转为 PNG/JPEG ArrayBuffer，用
fetch+createImageBitmap加载后传入texImage2D（WebGL）或drawImage（2D） - 图表逻辑：ECharts 或 Chart.js 不可直接用（它们强依赖 DOM 和 window）；需提取其核心算法（如坐标映射、折线插值、柱状分组），纯 JS 实现，并将结果转为顶点数组或路径指令
-
抗锯齿与清晰度：2D 上下文启用
imageSmoothingEnabled = false，避免缩放模糊；WebGL 使用antialias: false+ 手动 MSAA 后处理（如适用）
输出高保真图像，不走主线程合成
海报要求“所见即所得”，不能靠主线程 drawImage 拼接，必须由 Worker 直接产出可下载的位图：
- 完成绘制后，调用
offscreenCanvas.transferToImageBitmap()—— 它返回一个 GPU 零拷贝的ImageBitmap，支持 alpha 通道和 HDR 元数据 - 用
createImageBitmap(bitmap).then(b => b.blob())转为Blob，再生成URL.createObjectURL(blob)（注意：此 URL 可安全在主线程使用，不触发回退） - 若需 PNG（带透明）或 JPEG（压缩可控），用
bitmap.toBlob(callback, 'image/png', 1.0)或'image/jpeg'，质量参数精确控制文件体积 - 避免
readPixels：WebGL 中该方法在 Worker 里常返回黑屏；transferToImageBitmap是唯一稳定出口
兼容性与降级兜底策略
截至 2026 年 4 月，Safari 仍不支持 OffscreenCanvas + WebGL 组合，且部分 Android WebView 无 transferToImageBitmap。需主动检测并切换路径：
- Worker 入口先检查：
if (!('OffscreenCanvas' in self)) { postMessage({ error: 'OffscreenCanvas not supported' }); return; } - 对 Safari / 旧环境，退回到主线程离屏 canvas：
const fallbackCanvas = document.createElement('canvas');设置大尺寸，用toDataURL('image/png')导出（性能低但保功能） - 主线程收到
{ blobUrl: '...' }后，可直接<a download="poster.png" href="..."></a>触发下载，无需插入 DOM
