WebGL Insight调试工具

image.png

Chrome商店工具地址：
https://chrome.google.com/webstore/detail/webgl-insight/djdcbmfacaaocoomokenoalbomllhnko
GitHub开源地址
https://github.com/3Dparallax/insight

安装后会有一个bug

原因是addEventListener的第二个参数是function类型，而setTimeout返回的是number类型，简单修改下就能正常使用了

~/Library/Application Support/Google/Chrome/Default/Extensions

document.addEventListener("DOMContentLoaded", function () {
    setTimeout(glpContexts.sendContexts, 500)
});

从webgl的角度查看纹理

image.png

查看Vertex Shader和Fragment Shader

image.png

简直是一个学习webgl的利器！