Manage uniforms across multiple WebGL 2 programs using Uniform Buffer Objects. This video will try to explain and simplify this notoriously "advanced" technique.
I've uploaded a sample program to this series' Github repo so you can see exactly how to use UBOs.:
[ Ссылка ]
A very concise description of the `std140` ruleset can be found on the O'Reilly site:
[ Ссылка ]
I didn't go into it here, but it's possible to add structs to your UBOs as well. However, this can lead to very buggy renders on some hardware. Avoiding these bugs is actually pretty easy. I explained the problem and showed the solution in my video on Arrays and UBOs. You can watch that here:
[ Ссылка ]
You can find supplementary materials on this video series' GitHub page:
[ Ссылка ]
This series on WebGL 2 was produced for anyone who, like me, had major problems getting a firm understanding of WebGL's intermediate and advanced concepts. Every video is focused on a single concept. If I've done this well, you shouldn't really need to "get up to speed" before watching any of these videos. There are no external libraries. I'm not building up to a custom API or injecting any abstractions. And I don't expect you to have watched from episode #1 to get "how I'm doing things with WebGL."
Complete playlist:
[ Ссылка ]
Videos:
1. Creating WebGL Programs ([ Ссылка ])
2. Quickie: Precision ([ Ссылка ])
3. Uniforms (Part 1) ([ Ссылка ])
4. Attributes Part 1: Basics ([ Ссылка ])
5. Attributes Part 2: Beyond Basics ([ Ссылка ])
6. Attributes Part 3: Element Arrays ([ Ссылка ])
7. Objects, Targets & Binding ([ Ссылка ])
8. Textures Part 1: Basics ([ Ссылка ])
9. Textures Part 2: Mipmaps ([ Ссылка ])
10. Textures Part 3: Texture Atlases ([ Ссылка ])
11. Textures Part 4: Texture Arrays ([ Ссылка ])
12. Vertex Array Objects ([ Ссылка ])
13. Instanced Drawing ([ Ссылка ])
14. Matrix Attributes ([ Ссылка ])
15. Transparency ([ Ссылка ])
16. Camera Part 1 ([ Ссылка ])
17. Camera Part 2: Clipping & Z-fighting ([ Ссылка ])
18. Lighting Part 1: Directional diffuse lighting ([ Ссылка ])
19. Lighting Part 2: Point lights & Spotlights ([ Ссылка ])
20. Binary model files ([ Ссылка ])
21. Uniform Buffer Objects (Uniforms Part 2) ([ Ссылка ])
22. Arrays Part 1: Uniforms ([ Ссылка ])
23. Arrays Part 2: UBOs and Hardware Bugs ([ Ссылка ])
24. Transform Feedback ([ Ссылка ])
25. Framebuffer Objects Part 1: The Basics ([ Ссылка ])
26. Framebuffer Objects Part 2: The Gnarly Details ([ Ссылка ])
About my setup: Please don't get distracted by any of it. I'm writing to TypeScript files, but you'll probably just use JavaScript files. I'm using VSCode with the GLSL Lint extension, but you should use whatever you are most comfortable using. I'm using Parcel.js for hot-reloading and ts transpilation, but you can use whatever system you like (even if that's just writing to a file on your desktop and hitting Ctrl+R.) Please please please: If you spend more than a minute setting your environment up, that's a minute wasted that you could be learning WebGL.
I really hope someone out there will find this series helpful.
