I really like how you organized your project. As someone who's developed with Three.js for years both imperatively and in a highly-declarative way using R3F I'm always interested to see different approaches to architecture/organization.
I really like how you organized your project. As someone who's developed with Three.js for years both imperatively and in a highly-declarative way using R3F I'm always interested to see different approaches to architecture/organization.
The most important reason for my code structure is that I just like writing GLSL shaders! It's annoying that I need to set up Vite, TypeScript, Tailwind, React, etc. all so that I can write some shaders. I know I can write shaders in ShaderToy, but then I won't be able to upload custom 3D texture files or add simple user controls.
Maybe check out https://cables.gl
That's what the frontend hype canal wants you to think!
Your frontend JS could just `fetch` the GLSL files from the backend instead of trying to compile them into your build process.
There are tradeoffs to this of course, but dealing with the complexity death star of JS tooling can be opted out of.