跳转到内容
搜索文档

Canvas Remoting(画布远程化)

最后更新 查看 MarkdownAgent 设置

Canvas Remoting 是一种 Browser Isolation 功能,可针对使用 HTML5 Canvas API(允许 Web 应用程序直接在页面上绘制图形的浏览器功能)的 Web 应用程序优化性能。它将矢量绘制命令发送到客户端,而不是光栅化位图(像素图像),从而降低带宽消耗并提高效率工具应用程序的帧率。

工作原理

Browser Isolation 使用网络矢量渲染(Network Vector Rendering,简称 NVR)向用户的浏览器发送轻量级的绘制指令,而不是流式传输渲染后的像素或页面视频。然而,HTML5 Canvas 内容以前需要服务器端光栅化(将绘制命令转换为像素图像),从而为每一帧发送大型位图。

Canvas Remoting 将 NVR 扩展到了基于 Canvas 的应用程序,具体方式如下:

  1. 捕获对 HTML5 Canvas 元素所作的绘制命令。
  2. 将这些命令转换并作为 NVR 指令发送给客户端。
  3. 在客户端上将 Canvas 内容渲染到离屏纹理(用于中间渲染的隐藏绘制表面)上。
  4. 将该纹理合成(分层)到最终的文档输出中。

受支持的应用程序

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 功能

启用或禁用 Canvas Remoting

所有 Browser Isolation 客户默认开启 Canvas Remoting。无需任何配置。

Canvas Remoting 上下文菜单选项

禁用当前会话的 Canvas Remoting

  1. 右键单击隔离网页的背景。
  2. 从右键菜单中选择 Disable Canvas Remoting(禁用 Canvas Remoting)

重新启用 Canvas Remoting

  1. 右键单击隔离网页的背景。
  2. 从右键菜单中选择 Enable Canvas Remoting(启用 Canvas Remoting)

故障排除

Canvas 内容渲染缓慢

如果基于 Canvas 的应用程序看起来不流畅或消耗过多带宽:

  1. 通过右键单击页面背景验证 Canvas Remoting 是否处于开启状态。
  2. 检查右键菜单是否显示 Disable Canvas Remoting(这表示它处于活动状态)
  3. 如果问题仍然存在,请开具支持工单,并提供错误页面中的 Ray ID。

图形错误或元素缺失

如果因为网络中断重新连接后 Canvas 内容显示不正确:

  1. 刷新隔离页面。
  2. 如果问题仍然存在,请从右键菜单中选择 Disable Canvas Remoting(禁用 Canvas Remoting)
  3. 页面重新加载后重新启用 Canvas Remoting。

这篇文档对您有帮助吗?