Twitter | Search | |
Jack Rugile
📢 Calling all devs: Let's make a mega thread of performance/efficiency tips & tricks for three.js! Big or small, name something that has helped you boost rendering perf, load times, memory management, etc. Textures, materials, loaders, shaders, geometries, you name it.
Reply Retweet Like More
Louis Hoebregts 21 Feb 18
Replying to @jackrugile
When I need a basic circle as a texture for particules, I create it using a canvas instead of loading a png. (it also prevent all kind of CORS issues :) )
Reply Retweet Like
Rach Smith 🌈 21 Feb 18
Replying to @Mamboleoo @jackrugile
Reply Retweet Like
Mr.doob 22 Feb 18
Replying to @jackrugile
10 tips off the top of my head...
Reply Retweet Like
Mr.doob 22 Feb 18
Replying to @jackrugile
1. Reuse geometries and materials whenever possible.
Reply Retweet Like
Luigi De Rosa 22 Feb 18
Replying to @jackrugile
1. Disable antialiasing on "dpr > 1" 2. Limit dpr to a max of 2 3. Use a custom FXAA 4. Use a triangle instead of quad for postprocessing 5. Use 'high-performance' when creating the context 6. Animate stuff directly in the shaders! ...
Reply Retweet Like
Florian Morel 23 Feb 18
Replying to @luruke @jackrugile
cool, very interested in the triangle approach, I've read but still curious about how it works, are UV affected?
Reply Retweet Like
Graphics Noob 22 Feb 18
Replying to @jackrugile
instanced geometries for faster mesh instantiations
Reply Retweet Like
Brian Chirls 22 Feb 18
Replying to @BlurSpline @jackrugile
Totally, unless you're going to have a lot of instances off screen. They get culled in GPU, and you still have to run the vertex shader on all those instances. Can be quite slow on mobile, especially if the geometry is complex.
Reply Retweet Like
David Lochhead 22 Feb 18
Replying to @jackrugile
Reusing Vectors and Quaternions and pretty much any object where possible. const reuseMe = new THREE.Vector3(); reuseMe.set(x,y,z); const quaternion = new THREE.Quaternion(); quaternion.set (x,y,z,w);
Reply Retweet Like
Christopher Cook 22 Feb 18
Replying to @jackrugile
Use gtlf for models, its lighter than obj if you convert using obj2gltf. Also, check out the threejs gltfexporter to export all or part of your scene.
Reply Retweet Like