如何实例化并调用Rust web-sys的AngleInstancedArrays

你当前已经持有WebGL2RenderingContext实例gl，完全不需要使用ANGLE_instanced_arrays扩展。
实例化绘制是WebGL2的核心内置功能，直接调用上下文自带的原生方法即可，不需要额外获取任何扩展对象：

gl.draw_arrays_instanced(gl::TRIANGLES, 0, 6, 2)
    .expect("实例化绘制调用失败");

如果你后续需要兼容WebGL1上下文，才需要用到这个扩展，获取方式如下：

1. 首先确认Cargo.toml中web-sys的配置已开启对应feature：

[dependencies.web-sys]
version = "0.3"
features = [
  "WebGlRenderingContext",
  "AngleInstancedArrays",
  # 其余你需要使用的Web API feature
]

2. 通过WebGL上下文的扩展查询接口获取对象，再做类型转换：

// 仅适用于WebGL1上下文
let ext_obj = gl
    .get_extension("ANGLE_instanced_arrays")
    .expect("当前浏览器不支持ANGLE_instanced_arrays扩展")
    .expect("扩展返回值为空");
// 将通用JS对象转换为强类型的扩展实例
let angle_ext: AngleInstancedArrays = ext_obj.unchecked_into();
// 调用扩展方法
angle_ext.draw_arrays_instanced_angle(gl::TRIANGLES, 0, 6, 2);

• web-sys绑定的Web API类型没有公开的原生构造方法，所有实例都必须通过已有的JS上下文接口获取、或者对已有的JS值做类型转换得到，直接传入类型名作为实例的写法是完全错误的。
• 在持有WebGL2上下文的场景下尝试调用WebGL1专属的扩展API，属于API选型错误，WebGL2已经将实例化绘制纳入标准，不需要走扩展调用路径。
• 之前拿到js_sys::Object类型的返回值后，没有调用unchecked_into()/dyn_into()做WebAssembly绑定类型转换，自然无法得到目标强类型实例。

内容的提问来源于stack exchange，提问作者kulicuu