I’m pretty stuck here and ChatGPT’s answer doesn’t quite satisfy me. I’m extending the MeshStandardMaterial via onBeforeCompile here. I simply wanted to alter vertex positions of a IcosahedronGeometry in the vertex shader, then recalculate the vertex normals to have it look good with smooth shading under lighting. However, I can’t figure why in the world there are visible grid-like artifacts; they become apparent when zoomed in:
I haven’t tried calculating the normals in the fragment shader because I think the calculations are too costly, I really want to make this work with the recalculated normals in the vertex shader.
Here is the codesandbox link for my project: https://codesandbox.io/p/github/franky-adl/coral-sphere/codesandbox
Once again I ask for help from all the threejs gurus here with sincere gratitude 
That’s what I see, clicking on the link provided:
2 Likes
I’m afraid you might need to push the calculations down into the fragment shader, especially for normals. If they are calculated in the vertex shader, they go to the fragment shader via linear interpolation, which decreases the continuity along the edges. You see this as brighter (or darker) edges. The more shiny the surface is, the more visible are these lines.
The alternative is to grind the surface into smaller triangles. This will make it harder to see the lines, but will make the geometry heavier.
PS. This is only a guess, as the sandbox is not accessible, as @prisoner849 mentioned.
EDIT: Here are two snapshots from a WebGL course I taught some time ago. Both show a wavy surface. The left one has normals calculated in the vertex shader; the right one has normal calculated in the fragment shader
3 Likes
Sorry folks, this link should work: https://codesandbox.io/p/github/franky-adl/coral-sphere/codesandbox
if the side panel is asking whether to “start :1234” or “preview :1234”, just do the start one at port 1234.
Thanks a lot @PavelBoytchev . Your side by side comparison is very clear and my visuals does look really similar to your left image. Advice happily taken, I think I’ll push the calculations down to the fragment shader.
1 Like
