Прокрутка может переключать 3D-сцены без разрыва рендера

Shader Development Studio собрала почти весь сайт внутри HTML-холста. Three.js рендерит 3D-сцены, React Three Fiber описывает их компонентами, а язык материалов TSL компилируется и для WebGPU, и для WebGL. Так студия сохраняет совместимость со старым графическим API, не отказываясь от нового.

Интерфейс тоже рисуется внутри Three.js через изменённый @pmndrs/uikit, поэтому проходит через ту же постобработку, что и сцены. Плавную прокрутку ведёт доработанная библиотека Lenis: она фиксирует переходы между главным экраном и разделом работ.

Для геймдева здесь узнаваемая архитектура: меню, 3D и эффекты собраны в одном графическом конвейере. В разборе Codrops осталось устройство выборочного рендеринга и переходов между сценами.