为什么 gl.CURRENT_PROGRAM returns 总是相同的着色器？

Question

我的程序有 5 个着色器（1 个用于显示，其他用于管理我的粒子）。我放置了一个 onmouse 事件，在处理函数中，我做了一个日志：

console.log (gl.getParameter (gl.CURRENT_PROGRAM));

在控制台上，我看到了制服列表，多亏了这个列表，我可以确定在 canvas 上触发事件时正在处理哪个着色器。

但我仍然有相同的着色器，为什么？

编辑：哎呀...CURRENT_PROGRAM 是我的 render() 循环中的最后一个...所以我想当 render() 完成时鼠标事件会触发。

Answer 1

首先你不应该在你的节目中看到任何制服。如果你这样做 that's an anti-pattern

第二个 JavaScript 不执行多项任务 [1]。相反，它响应事件。当事件发生时，它会调用该事件的侦听器（JavaScript 函数）。这些函数运行完成，然后调用下一个事件的侦听器。

因此，在您的 JavaScript 程序中，您可能至少有 2 个事件侦听器。一个是 requestAnimationFrame 事件监听器，另一个是您的 mousemove 事件监听器。他们不会互相打扰。它们每个运行完成，退出，然后浏览器执行下一个事件（或进入睡眠状态直到新事件发生）。

大多数 WebGL 程序的工作方式是在单个事件期间呈现，通常是 requestAnimationFrame 事件。在此活动期间，他们会做类似

的事情

for each object
   set attributes for object
   gl.useProgram(program object needs)
   set uniforms
   draw

然后活动结束。稍后您的 mousemove 事件出现。这意味着从您的 mousemove 事件侦听器内部调用的 gl.getParameter(gl.CURRENT_PROGRAM) 总是会显示您的 requestAnimationFrame 事件中使用的最后一个程序。

[1] 当然网络工作者除外

why gl.CURRENT_PROGRAM returns always the same shader?