開發者與WebGL

RD->引擎->WebGL->OpenGL->GPU->顯示器

何謂 WebGL?

WebGL (Web Graphics Library)

基於OpenGL ES 2.0的JavaScript操作OpenGL的API

何謂 OpenGL?

OpenGL (Open Graphics Library)

OpenGL ES(OpenGL for Embedded Systems)(針對行動裝置較輕量的OpenGL特殊版)

操作硬體資源的API

OpenGL上下文(Context)

程式調用OpenGL指令前，要先建立OpenGL Context，是非常龐大的狀態機，保存OpenGL各種狀態。

CPU vs GPU

依照不同任務需求，交給CPU或GPU處理

CPU (Central Processing Unit) 中央處理器

電腦的心臟(射速快的機關槍)

適合處理邏輯

GPU (Graphics Processing Unit) 圖形處理器

顯示卡的心臟(射速慢，但彈丸數量相當多的霰彈槍)

適合處理計算(Shader盡量不寫if...else因為很慢)

網頁與WebGL

透過canvas取得OpenGL上下文(Context)

WebGL Context Lost 可能原因？

多個頁面使用GPU，GPU超載，瀏覽器將文本回收，再挑其中一個恢復。
瀏覽器某頁面對GPU操作時間過長，導致瀏覽器決定重置GPU打破停頓。
電腦有多種GPU，切換時也會丟失。

WebGL運作

沒有WebGL

WebGL協定

webGL2

100%向下相容、原本選配變成標配
webgl(openGL ES2), webgl2(openGL ES3)shader寫法調整
如果遊戲引擎只處理webgl2寫法,那也改不回webgl

參考文獻

20分钟让你了解OpenGL

WebGL浅入浅出，不深入了解一下吗？

為什麼 WebGL 的效能這麼強？

WebGLRenderingContext

Is GPU More Important than RAM Memory?

WebGL2 from WebGL1

WebGL2有什么新内容