Открытый каталог интерактивных UI-компонентов на Three.js/WebGL без входа в систему, с интерактивными превью и полным исходным кодом на React.
pmndrs/postprocessing
Библиотека постобработки для three.js, которая объединяет полноэкранные эффекты, такие как bloom, SSAO и цветокоррекция, для сцен WebGL.
- Звёзды
- 2,952
- Форки
- 258
- Открытые issues
- 30
- Последний коммит
- 5 дней назад
Что это?
postprocessing — это библиотека JavaScript для добавления полноэкранных эффектов постобработки в сцены three.js. Постобработка выполняется после рендеринга сцены и применяет эффекты к финальному кадру. Библиотека построена вокруг EffectComposer, который запускает последовательность проходов: RenderPass отрисовывает сцену, а EffectPass применяет эффекты.
EffectPass объединяет произвольные комбинации эффектов, сводя число операций рендеринга к минимуму. Поэтому можно сочетать множество эффектов, не оплачивая отдельный проход для каждого из них. Для каждого эффекта можно задать собственную функцию смешивания. Полноэкранные операции используют один треугольник, покрывающий весь экран, а не четырёхугольник. Библиотека также поддерживает высокоточную HalfFloat-буферизацию кадров для рабочих процессов в стиле HDR и включает ToneMappingEffect для преобразования HDR-цветов в формат, пригодный для отображения.
В пакет входят встроенные эффекты: bloom, размытие, глубина резкости, glitch, god rays, контур, SSAO, пикселизация, цветокоррекция на основе LUT и виньетка. Можно создавать собственные эффекты и проходы; процесс описан в wiki проекта.
Ключевые возможности
- 01Объединяет множество эффектов в один EffectPass, чтобы сократить число операций рендеринга.
- 02Содержит встроенные эффекты, включая bloom, SSAO, глубину резкости, контур и цветокоррекцию.
- 03Поддерживает отдельные функции смешивания для каждого эффекта.
- 04Предлагает высокоточную HalfFloat-буферизацию кадров для рендеринга в стиле HDR.
- 05Включает ToneMappingEffect для преобразования HDR в LDR.
- 06Позволяет создавать собственные эффекты и проходы.
Сценарии использования
- Добавление bloom или свечения в визуализацию продукта или игровую сцену на three.js.
- Применение ретроэффектов, например сканлайнов, пикселизации или glitch, к сцене WebGL.
- Цветокоррекция 3D-сцены с помощью файлов LUT.
- Создание интерактивных эффектов, например ударных волн или контуров выбранных объектов.
Темы
Частые вопросы
- Что такое postprocessing?
- Библиотека постобработки для three.js, которая объединяет полноэкранные эффекты, такие как bloom, SSAO и цветокоррекция, для сцен WebGL. postprocessing — это библиотека JavaScript для добавления полноэкранных эффектов постобработки в сцены three.js. Постобработка выполняется после рендеринга сцены и применяет эффекты к финальному кадру. Библиотека построена вокруг EffectComposer, который запускает последовательность проходов: RenderPass отрисовывает сцену, а EffectPass применяет эффекты.
- postprocessing можно использовать бесплатно? Какая у него лицензия?
- postprocessing распространяется с открытым исходным кодом под лицензией Zlib. Перед использованием в коммерческих продуктах проверьте условия лицензии.
- postprocessing всё ещё поддерживается?
- Активно поддерживается. Последний коммит в postprocessing — 1 нояб. 2026 г..
- Для чего можно использовать postprocessing?
- Добавление bloom или свечения в визуализацию продукта или игровую сцену на three.js. Применение ретроэффектов, например сканлайнов, пикселизации или glitch, к сцене WebGL. Цветокоррекция 3D-сцены с помощью файлов LUT. Создание интерактивных эффектов, например ударных волн или контуров выбранных объектов.
- Где скачать postprocessing?
- Исходный код и инструкции по установке — на GitHub: https://github.com/pmndrs/postprocessing
Описание создано ИИ на основе README проекта. Статистика GitHub обновляется ежедневно.
Похожие проекты
Песочница на Three.js и GLSL для настройки игровых эффектов способностей с прицеливанием: параметры можно менять ползунками даже на паузе.
Функциональная обёртка над WebGL, которая устраняет общее состояние GPU и позволяет описывать вызовы отрисовки как команды, компилируемые в оптимизированный JavaScript.
Открытая коллекция из более чем 100 написанных сообществом GLSL-переходов между двумя изображениями для веба, мобильных устройств, Apple, Android, Rust и видеоредакторов.
Рендерер океана в реальном времени для three.js (WebGL2): FFT-волны, прибой у берега, пена, каустика, подводный режим и плавающие объекты.
React-рендерер для Three.js, позволяющий декларативно собирать 3D-сцены с помощью JSX-компонентов.