Изучаем шейдеры и React Three Fiber
Three.js и его адаптер React Three Fiber используют WebGL для отрисовки сцен на экране. В свою очередь, WebGL использует шейдеры. Внутри Three.js уже есть встроенные шейдеры материалов: MeshNormalMaterial, MeshPhysicalMaterial и другие. Стандартные шейдеры ограничивают потенциал использования WebGL, поэтому Three.js позволяет создавать и использовать собственные шейдеры.
Максим Хекель в своем блоге рассказал про шейдеры, их виды и показал примеры их использования с React Three Fiber. Кроме самописных шейдеров существуют библиотеки для декларативного создания материалов – Lamina. С помощью композиции слоев можно создать новый материал, используя встроенные слои.
blog.maximeheckel.com/posts/t…ee-fiber