# 1. WebGL 的 Uniform Buffer Object 与 Transform Feedback 在批量渲染的取舍 A UBO 按 std140 布局打包 uniform,可减少状态切换 ✓ 正确答案 B Transform Feedback 把数据从 GPU 回读到 CPU 再上传 C UBO 与 Transform Feedback 完全互斥 D 批量渲染只能使用立即模式
# 2. HTMLCanvasElement.toBlob 的 quality/type 参数在截图上传的现代取舍 A webp 在体积与质量平衡上常优于 jpeg,且 toBlob 前需确认 canvas 未被污染 ✓ 正确答案 B quality 参数对 png 格式生效 C toBlob 是同步接口 D toDataURL 生成的 base64 比 Blob 更省内存
# 3. WebGL 扩展(OES_texture_float、EXT_color_buffer_float) A WebGL 扩展会自动全部启用 B 扩展不支持时 WebGL 会崩溃 C 浮点纹理在所有设备都支持线性滤波 D OES_texture_float 提供浮点纹理,EXT_color_buffer_float 允许浮点渲染目标,需 getExtension 启用并做能力检测 ✓ 正确答案
# 4. Canvas 2D、SVG 与 WebGL/WebGPU 的渲染模型差异 A SVG 是立即模式,每次变化需手动重绘 B WebGL 比 SVG 更易实现简单图标 C Canvas 内容可被屏幕阅读器读取 D SVG 保留场景图、天然支持命中测试与无障碍,Canvas 是位图立即模式,WebGL 是 GPU 可编程管线 ✓ 正确答案
# 5. Canvas 立即模式与 SVG 保留模式的命中测试、内存与可访问性 A Canvas 保留每个图形对象供命中测试 B Canvas 输出天然可被屏幕阅读器朗读 C SVG 的元素数量不影响内存 D SVG 由浏览器按元素自动命中且可被辅助技术读取,Canvas 需自行实现命中测试与无障碍补偿 ✓ 正确答案
# 6. WebGL 上下文丢失(webglcontextlost/webglcontextrestored)的资源重建策略 A 上下文丢失后 GPU 资源仍然有效 B 恢复后无需重设视口 C 上下文丢失只发生在旧浏览器 D 在 webglcontextlost 中 preventDefault 可支持恢复,restored 后需重建全部 GL 资源 ✓ 正确答案
# 7. Canvas 离屏渲染(OffscreenCanvas + transferControlToOffscreen) A transferControlToOffscreen 把画布控制权交给 Worker,配合 ImageBitmap 位块传输可把渲染移出主线程 ✓ 正确答案 B OffscreenCanvas 只能在主线程使用 C transferControlToOffscreen 后主线程仍可继续绘制同一 canvas D Worker 与主线程共享 WebGL 纹理
# 8. WebGL2 与 WebGPU 在 2D 渲染与图像处理管线的能力差异 A WebGL2 支持计算着色器 B WebGPU 与 WebGL2 完全等价 C WebGPU 以 Pipeline 与 BindGroup 组织渲染,支持计算着色器与显式资源管理,表达力强于 WebGL2 ✓ 正确答案 D WebGL2 无法进行图像处理
# 9. OffscreenCanvas + Worker 的并行渲染限制 A Worker 创建的 WebGL 上下文可被主线程直接使用 B OffscreenCanvas 渲染结果需通过 ImageBitmap 位块传输回主线程,且存在通信与资源开销 ✓ 正确答案 C Worker 中可以访问完整 DOM API D 任意数量的 OffscreenCanvas 都无资源限制
# 10. SVG Symbol、<use> 与 CSS 集成的复用模式 A <use> 每次引用都会复制图形定义 B sprite 中的 symbol 必须可见 C <use> 实例的样式无法被 CSS 影响 D symbol 定义一次、use 多处实例化,可用 currentColor 与 CSS 变量主题化 ✓ 正确答案
# 11. WebGL 资源(Buffer、Texture、Framebuffer) A WebGL 资源会被垃圾回收自动释放 B 纹理无需绑定即可使用 C usage 参数对性能没有影响 D Buffer/Texture/Framebuffer 需通过 delete* API 显式释放,并配合资源池管理显存 ✓ 正确答案
# 12. WebGPU 与 WebGL 在着色器语言、计算管线与多线程上的代际差距 A WebGL 原生支持计算着色器 B WebGL 支持多队列并行提交 C WebGPU 的着色器语言与 GLSL 完全一致 D WebGPU 用 WGSL、原生计算管线与显式同步,在计算与多线程上代际领先 WebGL ✓ 正确答案
# 13. HTML5 <canvas> 元素的 2D 与 WebGL 上下文在大型图表渲染时的 GPU 加速差异 A 大型实时图表中 WebGL 通过合并绘制调用与 GPU 管线获得更高性能,中小图表用 Canvas 2D/SVG 更合适 ✓ 正确答案 B Canvas 2D 与 WebGL 的绘制性能完全相同 C WebGL 图表无需处理 DPR D Canvas 2D 无法绘制动画
# 14. WebGL 着色器(GLSL)在跨平台兼容性、调试与降级到软件渲染的工程挑战 A 着色器调试依赖日志与可视化输出,且 WebGL 不可用时应降级到 Canvas 2D 或静态图 ✓ 正确答案 B GLSL 在所有设备上精度一致 C 浏览器可以强制启用软件渲染 D uniform 数量没有上限
# 15. Canvas 2D 上下文 willReadFrequently 属性在频繁读写像素时的性能取舍 A willReadFrequently 会提升所有 Canvas 操作的性能 B getImageData 在任何配置下成本相同 C willReadFrequently 提示浏览器优先 CPU 可读存储以加速 getImageData,但会牺牲 GPU 合成性能 ✓ 正确答案 D 该选项在所有浏览器都强制生效
# 16. <svg> 内联 SVG 在样式继承、CSS 动画与可访问性(<title>、<desc>)的取舍 A 外链 SVG 与内联 SVG 的 CSS 控制能力相同 B 内联 SVG 无法做 CSS 动画 C 内联 SVG 可被 CSS 控制并可加 title/desc 提升可访问性,但会增加 HTML 体积 ✓ 正确答案 D 纯装饰 SVG 不需要 aria-hidden
# 17. Web Animations API 在 Canvas 与 SVG 元素动画的统一控制能力 A WAAPI 可以直接动画 Canvas 位图像素 B WAAPI 统一 CSS 与 SVG 元素动画控制,Canvas 需在 rAF 中读取动画时间驱动绘制 ✓ 正确答案 C WAAPI 与 CSS 动画是两套互不相通的体系 D SMIL 与 WAAPI 完全等价
# 18. crossorigin 属性在 <img> 与 Canvas 污染(taint)跨域场景的处理 A 跨域图片绘制到 canvas 后总能读取像素 B crossorigin 可以在设置 src 之后再添加 C img 加 crossorigin 且服务端返回 CORS 头,画布才不会被污染并可安全读取像素 ✓ 正确答案 D 视频帧不受 taint 机制约束
# 19. Canvas 与 WebGL 在 1px 模糊、HiDPI 渲染与设备像素比适配的常见坑 A 设置 canvas.width 等于 CSS 宽度即可避免模糊 B 1px 模糊与 dpr 无关 C WebGL 不需要关心 dpr D HiDPI 下应把画布物理尺寸乘以 dpr 并缩放上下文,绘制时对齐像素网格避免模糊 ✓ 正确答案
# 20. Canvas 2D Path2D 对象在 SVG 路径解析复用与渲染性能的应用 A Path2D 可从 SVG path 字符串构造并复用,配合 isPointInPath 做命中测试 ✓ 正确答案 B Path2D 只能由路径指令数组构造 C Path2D 会自动 GPU 加速所有绘制 D Path2D 每次绘制都会重新解析路径
# 21. Canvas 的绘图状态管理,save/restore 与变换矩阵? A restore() 只恢复变换矩阵 B setTransform 是在现有矩阵上叠加 C 变换矩阵不参与状态栈 D save/restore 成对使用可隔离样式与变换,变换组合顺序会影响最终结果 ✓ 正确答案
# 22. SVG 与 Canvas 的选型,矢量 vs 位图、交互与性能? A SVG 与 Canvas 都保留图形对象 B 高交互小数量选 SVG,高频更新海量图形选 Canvas,可按层混合使用 ✓ 正确答案 C SVG 渲染成本与节点数无关 D Canvas 适合任意缩放不失真的场景
# 23. Canvas 的高分屏适配,devicePixelRatio 与缩放? A 高分屏适配只需增大 CSS 尺寸 B 画布物理尺寸乘 dpr 并缩放上下文,且需处理 dpr 动态变化与内存成本 ✓ 正确答案 C dpr 只影响 Canvas 不影响文字 D devicePixelRatio 永远是整数