Some questions in material array about “transparent:true”
Here is a part of the code. When I set the attribute “transparent:true” , It will consume a lot of performance, causing a drop in frames.
Before I set it true is 60 FPS, then 30 FPS. If all my 5
const mat1 = new THREE.MeshBasicMaterial({ color: 0xffffff, side: THREE.DoubleSide /*transparent:true*/ });
const mat2 = new THREE.MeshBasicMaterial({ color: 0x000000, side: THREE.DoubleSide });
const mat3 = new THREE.MeshBasicMaterial({ map: texture, side: THREE.DoubleSide });
const mat4 = new THREE.MeshBasicMaterial({ color: 0x000000, side: THREE.DoubleSide });
const mat5 = new THREE.MeshBasicMaterial({ color: 0xffffff, side: THREE.DoubleSide });
const material = [ mat1,mat2,mat3,mat4,mat5 ];
const road = new THREE.Mesh(geometry, material);
materials set this attribute true, it is only below 10 PFS
In single material , setting transparent:true cause none bad effects, but in the array its bad effect seems to rise exponentially
As far as I know, setting transparent to true will result in Two-pass DoubleSided Rendering at material.
Two pass double sided rendering is more expensive than double side rendering
if you don’t want to two-pass double sided rendering set Material.forceSinglePass = true
1 Like
Thank you very much.It seems to be the key to my current problem . Your answer helps me very much
transparent:true set in material array, seems to amplify the impact at an exponential level.
why？
In single material , impact is very small
I don’t know why but three.js recommend 1 mesh : 1 material, 1 mesh : material array is deprecated I think it causes side effect somehow
if you want to get a answer add a jsfiddle or codesandbox for test
1 Like
thank you agin, it is difficute for me to add a jsfiddle or codesandbox.I try not to use this usage
1 Like
Are there a lot of these “road” meshes? A mesh with 5x materials costs 5x as many draw calls, and that is expensive. If your total number of draw calls are high (>100 for example) you will likely see performance drop as a result.
2 Likes
Yes, there are . I download the example from github for studying . Thanks all of you answer my question
