渋谷ほととぎす通信

新しいこと、枯れたこと問わずサムザップ大庭が興味を持ったものを調査、生活の効率を求める完全趣味の技術ブログ。基礎を大事にしています。※あくまで個人ブログであり所属組織とは関係ありません

Visual Effect GraphはWebGLでは動かない件(2020年11月執筆時)


「まあ、そりゃそうだ」


という記事なのですが、せっかくやったことはアウトプットしておきたい派です。

Visual Effect Graphはコンピュートシェーダに依存

コンピュートシェーダはOpenGL ES 3.1以降に実装されている技術でVisual Effect Graphはそれを使っています。

先日Tweetした牛の作品は処理的には簡単なので、もしかして動くかな?って思ってWebGLビルドしてみた次第です。

各ブラウザの挙動

Chrome

f:id:esakun:20201103141009p:plain:w500

「シーン....」


見た目上何も起きませんでした。

Firefox

f:id:esakun:20201103140704p:plain:w500

Chromeと同様。

Safari(通常版))

f:id:esakun:20201103140842p:plain:w500

ダイアログが出て終了。

Safari Technology Preview

f:id:esakun:20201103214518p:plain:w250

f:id:esakun:20201103140842p:plain:w500

Develop > Experimental Features > WebGPUにチェック入れても駄目。

ログの確認

Chrome開発者ツールのコンソールからログを追います。
※ショートカットは⌘ + ⌥+ I

OPENGL LOG: Creating OpenGL ES 3.0 graphics device ; Context level  <OpenGL ES 3.0> ; Context handle 25699288

ERROR: Shader

シェーダでエラーが吐いていることが分かります。このログ自体はブラウザ問わず同じ内容でした。

まとめ

Web上の情報と相違なくMac環境においてコンピュートシェーダはWebGLでは動きませんでした。WebGLの動向はウォッチしておこうと思います。

余談 : Safari Technology Previewの取得方法

f:id:esakun:20201103214909p:plain:w450

開発 > Safari Technology Previewから入手できます。

f:id:esakun:20201103142035p:plain:w450

macOS Catalinaの場合は、10.15.6以上が必要になります。
Downloads - Safari - Apple Developer

環境

  • macOS Catalina 10.15.7
  • Unity2020.1.6f1
  • Chrome バージョン: 86.0.4240.111(Official Build) (x86_64)
  • Firefox 78.0.2 (64 ビット)
  • Safari バージョン13.1.1 (15609.2.9.1.2)
  • Safari Technology Preview Release 115 (Safari 14.1, WebKit 15611.1.3.5)

参考サイト