Canvas Remoting 是一种 Browser Isolation 功能,可针对使用 HTML5 Canvas API(允许 Web 应用程序直接在页面上绘制图形的浏览器功能)的 Web 应用程序优化性能。它将矢量绘制命令发送到客户端,而不是光栅化位图(像素图像),从而降低带宽消耗并提高效率工具应用程序的帧率。
Browser Isolation 使用网络矢量渲染(Network Vector Rendering,简称 NVR)向用户的浏览器发送轻量级的绘制指令,而不是流式传输渲染后的像素或页面视频。然而,HTML5 Canvas 内容以前需要服务器端光栅化(将绘制命令转换为像素图像),从而为每一帧发送大型位图。
Canvas Remoting 将 NVR 扩展到了基于 Canvas 的应用程序,具体方式如下:
- 捕获对 HTML5 Canvas 元素所作的绘制命令。
- 将这些命令转换并作为 NVR 指令发送给客户端。
- 在客户端上将 Canvas 内容渲染到离屏纹理(用于中间渲染的隐藏绘制表面)上。
- 将该纹理合成(分层)到最终的文档输出中。
Canvas Remoting 提高了依赖 HTML5 Canvas API 的效率工具应用程序的性能:
| 应用程序 | 改进 |
|---|---|
| Microsoft Word | 带宽减少至原来的 1/10 |
| Microsoft Excel | 平滑滚动和数据输入 |
| Microsoft PowerPoint | 流畅动画 |
| Google Sheets | 稳定的 30fps 渲染 |
| Google Maps | 平滑的平移和缩放 |
| 基于 Web 的终端和 AI 笔记本(AI notebook) | 快速且响应迅速的文本输入与显示 |
Canvas Remoting 仅支持 2D Canvas 上下文。不支持以下内容:
- WebGL 和 WebGPU 上下文
- 3D 图形应用程序
- 需要 GPU 加速的高级 Canvas 功能
所有 Browser Isolation 客户默认开启 Canvas Remoting。无需任何配置。
- 右键单击隔离网页的背景。
- 从右键菜单中选择 Disable Canvas Remoting(禁用 Canvas Remoting)。
- 右键单击隔离网页的背景。
- 从右键菜单中选择 Enable Canvas Remoting(启用 Canvas Remoting)。
Canvas 内容渲染缓慢
如果基于 Canvas 的应用程序看起来不流畅或消耗过多带宽:
- 通过右键单击页面背景验证 Canvas Remoting 是否处于开启状态。
- 检查右键菜单是否显示 Disable Canvas Remoting(这表示它处于活动状态)。
- 如果问题仍然存在,请开具支持工单,并提供错误页面中的 Ray ID。
图形错误或元素缺失
如果因为网络中断重新连接后 Canvas 内容显示不正确:
- 刷新隔离页面。
- 如果问题仍然存在,请从右键菜单中选择 Disable Canvas Remoting(禁用 Canvas Remoting)。
- 页面重新加载后重新启用 Canvas Remoting。