Desynchronized WebGL canvas
WebGL コンテキストの desynchronized オプションにより、合成をバイパスした低レイテンシ描画を実現します。
対応ブラウザ
| 機能 | デスクトップ | モバイル | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
api.HTMLCanvasElement.getContext.webgl_context.options_desynchronized_parameter | 81 | 79 | | | 75 | |
注釈 4件
実装メモ
- ChromeOSとWindows
- ChromeOSのみ
制限事項
- このブラウザでは部分的にしか実装されていません
削除済み
- このバージョンで機能が削除されました (81)
基本構文
JAVASCRIPT
const gl = canvas.getContext('webgl', {
desynchronized: true,
preserveDrawingBuffer: true
}); ライブデモ
Rendering note
Remember that browser support and latency wins vary by GPU, driver, and browser engine.
プレビュー全画面表示
実務での使いどころ
-
Desynchronized WebGL canvas の活用
WebGLの非同期描画オプション。低レイテンシ3D描画に使用。
注意点
- 一部のブラウザでのみ対応。使用前にブラウザサポートを確認すること。
アクセシビリティ
- スクリーンリーダーでの読み上げを確認すること。