Mastodon Icon RSS Icon GitHub Icon LinkedIn Icon RSS Icon

Tag Shader

THREE.js Shader Loading from External File

Header image for THREE.js Shader Loading from External File

As usual, trying to nicely separate into different files the various application parts in JavaScript is a titanic challenge. This time, I wanted to separate the “.frag” and “.vert” shader programs into different files that I can load at runtime (instead of putting them into the HTML like a savage).

For some reason, there is no easy out-of-the-box way to do that. On the internet, there is a small library, but it depends on JQuery and I think it is insane to load JQuery on top of THREE.js just to load a couple of files. Therefore, I wrote a function to do that using the THREE.js integrated generic loader function.