Hello Three.js

<aside> 💡 3D 객체의 표면 특성(색상, 반사도, 투명도 등)을 정의합니다.

</aside>

기본 재질의 성능이 빠른 순서

<aside> 💡 성능 부담이 클수록 더 현실적인 결과물을 얻을 수 있지만, 저사양 지원을 위해서는 코드 최적화에 그만큼 신경을 써야 합니다.

</aside>

  1. MeshBasicMaterial
  2. MeshLambertMaterial
  3. MeshPhongMaterial
  4. MeshStandardMaterial
  5. MeshPhysicalMaterial

MeshBasicMaterial

광원의 영향을 받지 않습니다.

MeshLambertMaterial

정점에서만 광원을 계산합니다.

MeshPhongMaterial

픽셀 하나하나 전부 광원을 계산하고, *반사점도 지원합니다.

*반사점(specular highlights): 물체가 조명을 받을 때 물체에 나타나는 밝은 점.

MeshToonMaterial

MeshToonMaterial은 MeshPhongMaterial과 유사하지만, 큰 차이점이 있습니다. 부드러운 쉐이딩(shading) 대신 그라디언트 맵(gradient map)을 사용한다는 점입니다. MeshToonMaterial로 만든 물체는 투톤 효과를 내어 카툰 느낌을 줍니다.

<aside> 💡 다음으로 살펴볼 두 가지 재질은 물리 기반 렌더링(Physically Based Rendering, 줄여서 PBR)을 위한 재질입니다.

앞서 다룬 재질들은 3D처럼 보이도록 간단한 수학을 사용하지만, 이는 실제와는 다릅니다. 반면, 이 두 가지 PBR 재질은 실제 세계에서처럼 물체를 구현하기 위해 훨씬 복잡한 수학을 사용합니다.

</aside>