gfxfundamentals / webgl2-fundamentals

WebGL 2 lessons starting from the basics
https://webgl2fundamentals.org
BSD 3-Clause "New" or "Revised" License
1.76k stars 220 forks source link

Example cleanup - remove duplicate call to bindBuffer in Image Processing section #196

Closed davcri closed 1 year ago

davcri commented 1 year ago

Reading the examples from https://webgl2fundamentals.org/webgl/lessons/webgl-image-processing.html I noticed that bindBuffer(gl.ARRAY_BUFFER, positionBuffer) is called in two spots:

  1. before gl.vertexAttribPointer(...)
  2. before setRectangle(...)

This PR "merges" the second bindBuffer() with the first one.
Seems to work but I'm still learning WebGL so maybe I missed something obvious.

greggman commented 1 year ago

thanks for the PR

That article is old (one of the first 5 articles written) and I would probably change it if I was to re-write it again but ... It's not wrong the way it is. Since it's image processing the image might change size later and you'd either need to update the position buffer for the new image size, OR, you'd need to make your shaders take parameters so you could update some uniforms to help with the new image size.

Doing it based on uniforms (and most likely using matrices) would be the more common way to do this but the article assumes the user doesn't know anything about matrices so the position data is updated just before drawing.

davcri commented 1 year ago

Makes sense, thanks for taking your time to clarify the usual approach. I made a separate PR containing only the typo fix: https://github.com/gfxfundamentals/webgl2-fundamentals/pull/197