Последнее обновление: 2026-02-19 Текущий статус: Фаза 3 завершена
Этот документ описывает полную дорожную карту разработки проекта GPU Particle Shapes, отслеживая прогресс по реализациям WebGL2, WebGPU и XPBD-физики.
| Фаза | Статус | Описание |
|---|---|---|
| Фаза 1 | Завершена | Фундамент WebGL2 PBR |
| Фаза 2 | Завершена | WebGPU Ray Tracing + глобальное освещение |
| Фаза 3 | Завершена | Физический движок XPBD |
| Фаза 4 | Запланирована | Расширенные возможности трассировки лучей |
| Фаза 5 | Запланирована | Пользовательский интерфейс и производительность |
| Фаза 6 | Запланирована | Финальная доработка и эффекты |
Статус: Завершена Дата завершения: 2025-12-28
Создать прочную основу на WebGL2 и реализовать физически корректный рендеринг частиц.
- WebGL2 конвейер рендеринга с MRT (Multiple Render Targets)
- Двойная буферизация текстур (ping-pong) для состояния частиц
- Текстуры с плавающей точкой (RGBA32F) для позиций и скоростей
- Симуляция физики частиц на GPU
- 65K+ частиц (текстура до 384x384)
- Реализация Cook-Torrance BRDF
- Функция нормального распределения GGX
- Аппроксимация Френеля-Шлика (Fresnel-Schlick)
- Геометрический член Смита-Шлика-GGX
- До 8 динамических точечных источников света
- Управление интенсивностью и радиусом для каждого источника
- Свойства материалов (шероховатость, металличность, альбедо)
- Конвейер рендеринга в формате HDR
- Тональная компрессия ACES filmic
- Улучшенный блум с порогом яркости
- Эффект виньетирования
- Зернистость пленки и фоновый градиент
- Гамма-коррекция (sRGB)
- 11 математических форм (куб, сфера, тор, спираль и др.)
- Плавный морфинг форм с автоматическими переходами
- Фрактальный режим с процедурными паттернами
- Режим свободного полета
- Множество режимов взаимодействия с курсором (притяжение, отталкивание, вихрь и др.)
- Режим аудиореактивного эквалайзера
- Полная панель управления
- Настройка параметров в реальном времени
- Система цветовых палитр с 8 пресетами
- Двуязычная поддержка (английский/русский)
- Адаптивный дизайн для мобильных устройств
- Управление камерой (орбита, зум)
src/shaders/pbr.js-- функции PBR BRDFsrc/shaders/blit.js-- HDR-композитинг с тональной компрессией- Улучшенный рендеринг частиц в
src/shaders/particle.js - Конфигурация множественных источников освещения
Статус: Завершена Дата завершения: 2025-12-29
Реализовать трассировку лучей в реальном времени с глобальным освещением на основе path tracing, используя вычислительные шейдеры WebGPU.
- Инициализация устройства WebGPU с откатом на WebGL2
- Архитектура конвейера вычислительных шейдеров
- Утилиты управления буферами и текстурами
- Обработка ошибок компиляции шейдеров
- Восстановление при потере устройства
- Тесты пересечения луча и сферы
- Ускоряющая структура BVH (упрощенная плоская иерархия)
- Динамическое построение BVH (перестройка каждый кадр)
- Итеративный обход BVH
- Тени на основе трассировки лучей
- Генерация первичных лучей из камеры
- Глобальное освещение с 1 отскоком -- частицы подсвечивают друг друга
- Importance sampling -- распределение GGX для зеркальных отражений
- Смешанные направления диффузных/зеркальных отскоков
- Интегрирование Монте-Карло для непрямого освещения
- Косинусно-взвешенная выборка полусферы для диффузных отскоков
- Материалы для каждой частицы с варьируемыми свойствами
- Вариация альбедо -- различные базовые цвета для каждой частицы
- Вариация шероховатости -- от глянцевых до шероховатых поверхностей
- Вариация металличности -- смесь диэлектрических и металлических частиц
- Излучающие частицы -- случайные светоизлучающие частицы, вносящие вклад в GI
- Вычисление BRDF на основе материала
- Темпоральная аккумуляция -- экспоненциальное скользящее среднее между кадрами
- Обнаружение движения камеры -- сброс аккумуляции при перемещении
- Настраиваемый коэффициент смешивания -- управление интенсивностью шумоподавления
- Гладкий вывод без шума
- До 8 динамических точечных источников света
- PBR-затенение с Cook-Torrance BRDF
- HDR-рендеринг (текстуры RGBA16F)
- Тональная компрессия ACES в вычислительном шейдере
- Компонент фонового освещения
- Цвет окружения/неба для промахов лучей
- 5-этапный вычислительный конвейер:
- Симуляция частиц (физика)
- Построение BVH (ускорение)
- Трассировка лучей с GI (освещение)
- Темпоральная аккумуляция (шумоподавление)
- Вывод на холст (финальный проход)
src/gpu/device.js(219 строк) -- устройство WebGPU и утилитыsrc/gpu/pipelines.js(499 строк) -- все вычислительные и рендер-конвейерыindex-webgpu.html(153 строки) -- HTML для WebGPU-версииindex-webgpu.js(443 строки) -- точка входа WebGPU-приложения
src/shaders-wgsl/particle-sim.wgsl(218 строк) -- физика частицsrc/shaders-wgsl/bvh-build.wgsl(235 строк) -- полный LBVH-построитель (пока не используется)src/shaders-wgsl/bvh-simple.wgsl(187 строк) -- упрощенный BVH (активный)src/shaders-wgsl/ray-trace.wgsl(485 строк) -- ядро path tracingsrc/shaders-wgsl/temporal-accumulation.wgsl(83 строки) -- шумоподавлениеsrc/shaders-wgsl/pbr.wgsl(180 строк) -- функции BRDFsrc/shaders-wgsl/common.wgsl(159 строк) -- математические утилитыsrc/shaders-wgsl/blit.wgsl(73 строки) -- финальный вывод
WEBGPU_SETUP.md(366 строк) -- руководство по настройкеLIGHTING_REPORT.md-- отслеживание прогресса (обновлено)README.md-- обновлен с возможностями WebGPUCLAUDE.MD-- руководство разработки обновлено
- 60 FPS при 1080p на RTX 3080+ с полной трассировкой лучей
- Масштабирование от 16K до 65K частиц
- Динамический BVH перестраивается каждый кадр
- Темпоральная аккумуляция эффективно сглаживает шум
- Исправлена критическая ошибка шейдера в
src/shaders/blit.js-- восстановлена утраченная выборка HDR-цвета - Исправлен рендеринг частиц WebGL2 (отображался черный экран)
- Проверено создание кнопок форм в интерфейсе
Статус: Завершена Дата завершения: 2026-02-19
Реализовать полноценный физический движок на основе алгоритма XPBD (Extended Position-Based Dynamics) на Rust с компиляцией в WebAssembly для высокопроизводительной симуляции частиц в реальном времени.
- Монорепозиторий Cargo Workspace с двумя крейтами:
xpbd-core-- физическая библиотека (ядро симуляции)xpbd-wasm-- WASM-биндинги для JavaScript
- Система сборки wasm-pack для компиляции в WebAssembly
- Бандлер esbuild для TypeScript-клиента
- Миграция клиентского кода с JavaScript на TypeScript
- Полная реализация алгоритма XPBD с подшагами (substeps) и итерациями Якоби
- Настраиваемое количество подшагов и итераций для баланса точности и производительности
- 5 типов ограничений (constraints):
- Distance -- ограничения расстояния между частицами
- Contact -- контактные ограничения (столкновения)
- Density (PBF) -- ограничения плотности на основе Position-Based Fluids
- Shape Matching -- ограничения сохранения формы
- Bending -- ограничения изгиба
- Аппроксимация гравитационного взаимодействия O(N log N) на основе октодерева (octree)
- Алгоритм Барнса-Хата (Barnes-Hut) для эффективного вычисления дальнодействующих сил
- Настраиваемый параметр точности (theta)
- Кулоновское взаимодействие (электростатика)
- Сила Лоренца (движение заряженных частиц в магнитном поле)
- Ограничения плотности на основе Position-Based Fluids
- XSPH-вязкость для сглаживания поля скоростей
- Подавление вихрей (vorticity confinement) для сохранения мелкомасштабных деталей потока
- 13 математических форм с параметрическим описанием
- Генератор фракталов
- Морфинг форм реализован как XPBD-ограничения позиций с настраиваемой податливостью (compliance)
- 7 режимов взаимодействия:
- Притяжение (attract)
- Отталкивание (repel)
- Вихрь влево (vortex L)
- Вихрь вправо (vortex R)
- Импульс (pulse)
- Магнитный поток (magnetic flow)
- Квазар (quasar)
- Анализ частотных диапазонов: басы, средние, высокие (bass/mid/treble)
- Модуляция физических сил на основе спектра аудиосигнала
- Управление количеством подшагов и итераций на основе бюджета времени кадра
- Автоматическое масштабирование точности для поддержания целевого FPS
- Подсчет-сортировка (counting sort) для размещения частиц в ячейках
- Запросы соседей за O(N) для эффективного поиска взаимодействий
- Предустановленные наборы физических параметров для различных типов поведения частиц
- Структура GpuParticle размером 32 байта для компактной передачи данных
- Zero-copy доступ к буферам из JavaScript через SharedArrayBuffer
- Минимальные накладные расходы на границе Rust/JS
- 154 теста, полное покрытие физического ядра
- Ноль предупреждений компилятора
- Опциональная параллелизация через rayon (за feature-флагом
parallel)
- Rust -- физическое ядро и WASM-биндинги
- TypeScript -- клиентская часть (миграция с JS)
- wasm-pack -- сборка WASM-модуля
- esbuild -- бандлинг TypeScript
Статус: Запланирована Ориентировочный объем: Большой
Повысить качество и производительность трассировки лучей с помощью продвинутых техник.
- Полная реализация LBVH с кодами Мортона
- Поразрядная сортировка кодов Мортона на GPU
- Параллельное построение BVH
- Полноценная иерархия дерева
- Обновление BVH вместо полной перестройки
- Отслеживание перемещения частиц
- Обновление только измененных узлов
- В 10-20 раз быстрее полной перестройки
- BVH на основе SAH (Surface Area Heuristic)
- Улучшенная производительность обхода лучей
- Оптимизированные плоскости разделения
- Глобальное освещение с 2-3 отскоками
- Более реалистичное непрямое освещение
- Перетекание цвета между частицами
- Каустики от металлических частиц
- Русская рулетка для завершения путей
- Несмещенное завершение путей
- Оптимизация производительности
- Оценка следующего события (NEE)
- Прямая выборка света на каждом отскоке
- Снижение шума для ярких источников
- SVGF (пространственно-временная фильтрация с учетом дисперсии)
- Билатеральный фильтр с учетом границ
- Оценка дисперсии
- Темпоральная аккумуляция с дисперсией
- Многопроходная фильтрация
- A-SVGF (адаптивный SVGF)
- Адаптивное количество сэмплов
- Выборка на основе качества
- Репроекция с векторами движения
- Улучшенная временная стабильность
- Репроекция на основе скоростей частиц
- Трассированное фоновое затенение (RTAO)
- Короткие лучи AO
- Контактное уплотнение
- Настраиваемое количество сэмплов
- Адаптивная выборка
- Больше сэмплов в регионах с высокой дисперсией
- Меньше сэмплов в сходящихся областях
- Распределение сэмплов на основе дисперсии
- Освещение окружения с importance sampling
- HDR-карты окружения
- MIS (множественное importance sampling)
- Вклад неба/IBL
- Управление памятью GPU для крупных BVH
- Оптимизация занятости вычислительных шейдеров
- Баланс между качеством и производительностью
- Ограничения реального времени (16.6 мс на кадр)
- Качество: улучшение визуальной точности на 40-60%
- Производительность: ускорение на 30-50% с оптимизированным BVH
- Шум: снижение на 70-80% при использовании SVGF
Статус: Запланирована Ориентировочный объем: Средний
Обеспечить комплексное управление через UI и инструменты оптимизации производительности.
- Панель настроек трассировки лучей
- Переключатель включения/выключения трассировки
- Выбор типа BVH (простой/полный LBVH)
- Ползунок количества отскоков (1-3)
- Управление количеством сэмплов на пиксель
- Коэффициент темпорального смешивания
- Управление материалами
- Глобальный множитель шероховатости
- Глобальный множитель металличности
- Вероятность излучающих частиц
- Интенсивность излучения
- Пресеты качества
- Низкое (без RT, прямой рендеринг)
- Среднее (только RT-тени)
- Высокое (GI с 1 отскоком)
- Ультра (GI с 2-3 отскоками, SVGF)
- Отладочные визуализации
- Наложение визуализации BVH
- Тепловая карта количества лучей
- Визуализация дисперсии
- Отображение свойств материалов
- Панель статистики в реальном времени
- Счетчик FPS с минимумом/максимумом/средним
- График времени кадра
- Разбивка времени GPU по проходам
- Отслеживание использования памяти
- Профилирование производительности
- Запросы временных меток GPU
- Хронометраж каждого конвейера
- Определение узких мест
- Автоматическое масштабирование качества
- Динамическое масштабирование разрешения
- Адаптивное количество частиц
- Переключение пресетов качества на основе FPS
- Пресеты конфигурации
- Сохранение текущих настроек в JSON
- Загрузка предустановленных конфигураций
- Экспорт/импорт через файл
- Кодирование параметров в URL
- Скриншоты/запись
- Захват холста в PNG
- Запись видео (WebCodecs API)
- Экспорт в GIF
- Настраиваемое разрешение
- Сворачиваемые секции в панели управления
- Подсказки для всех параметров
- Горячие клавиши
- Наложение справки/документации
- Предупреждения о производительности
- Оптимизация для сенсорных устройств
Статус: Запланирована Ориентировочный объем: Большой
Добавить финальную полировку и продвинутые визуальные эффекты для качества продакшн-уровня.
- Временное сглаживание (TAA)
- Дрожащая выборка (jittered sampling)
- Репроекция со скоростью
- Отклонение истории
- Проход повышения резкости
- Размытие движения (Motion Blur)
- Размытие на основе скорости каждой частицы
- Тайловая оптимизация размытия
- Настраиваемый угол затвора
- Глубина резкости (DoF)
- DoF на основе боке
- Круговая/шестиугольная апертура
- Управление расстоянием фокусировки
- Управление размером диафрагмы
- Цветокоррекция
- Цветокоррекция на основе LUT
- Экспозиция/контрастность/насыщенность
- Цветовая температура
- Раздельное тонирование
- Объемное освещение (лучи бога)
- Объемные эффекты через ray marching
- Световые лучи от точечных источников
- Управление плотностью тумана/атмосферы
- 3D-шум для вариативности
- Световые зонды
- Сферические гармоники для фонового освещения
- Динамическое размещение зондов
- Смешивание зондов
- Каустики
- Фотонные карты для каустиков
- Фокусировка света через частицы
- Преломляющие каустики
- Следы частиц
- Следы в стиле motion blur
- Ленточные частицы
- Настраиваемая длина следа
- Затухание следа
- Столкновения частиц
- Пространственное хеширование для обнаружения столкновений
- Упругий/неупругий отклик на столкновение
- Звуковая обратная связь при столкновении
- Силовые поля
- Гравитационные колодцы
- Поля ветра
- Турбулентный шум
- Магнитные поля
- Математические поверхности
- Лента Мебиуса
- Бутылка Клейна
- Трилистниковый узел
- Аттрактор Лоренца
- Множество Мандельброта
- Органические формы
- Двойная спираль ДНК
- Раковина/спираль
- Деревья/ветвящиеся структуры
- Процедурные цветы
- Продвинутый анализ аудио
- Обнаружение бита
- Обнаружение onset
- Спектральный центроид
- RMS-энергия
- Параметры, управляемые аудио
- Цвет частиц из спектра
- Морфинг формы под ритм
- Интенсивность света от басов
- Тряска камеры от перкуссии
- Интеграция WebXR
- Стереорендеринг
- 6DoF-трекинг
- Ручные контроллеры
- Поддержка масштаба комнаты
- Возможности AR
- Отслеживание мира
- Обнаружение плоскостей
- Тестирование попаданий
- Оценка освещения
- Комплексная система обучения
- Интерактивные примеры/демонстрации
- Видеоуроки
- Галерея работ сообщества
- Система плагинов/расширений
- API скриптинга для пользовательского поведения
- Полная реализация LBVH (значительное ускорение)
- Шумоподавление SVGF (значительное улучшение качества)
- Элементы управления WebGPU UI (удобство использования)
- Мониторинг производительности (оптимизация)
- Многоотскоковое GI (визуальное качество)
- Реализация TAA
- Пресеты качества
- Система сохранения/загрузки
- Объемное освещение
- Новые формы
- Поддержка VR/AR
- Продвинутые аудиофункции
- Каустики
- Система плагинов
- Запись видео
| Конфигурация | Разрешение | Кол-во частиц | Целевой FPS | Уровень GPU |
|---|---|---|---|---|
| Низкое | 720p | 16K | 60 | GTX 1060 |
| Среднее | 1080p | 32K | 60 | RTX 2060 |
| Высокое | 1080p | 65K | 60 | RTX 3070 |
| Ультра | 1440p | 65K | 60 | RTX 3080+ |
| Экстремальное | 4K | 65K | 30-60 | RTX 4090 |
- Полный набор возможностей WebGL2
- 11 форм, фрактальный режим, аудиореактивность
- PBR-освещение, HDR-конвейер
- Полный пользовательский интерфейс
- Поддержка мобильных устройств
- Двуязычная поддержка
- Трассировка лучей в реальном времени
- Глобальное освещение на основе path tracing
- Темпоральное шумоподавление
- Материалы для каждой частицы
- Излучающие частицы
- Динамический BVH
- Откат на WebGL2
- Физический движок XPBD на Rust/WASM
- 5 типов ограничений
- N-тельная гравитация Барнса-Хата
- Электромагнитные силы
- PBF-гидродинамика
- 13 форм + фрактальный генератор
- 7 режимов взаимодействия с указателем
- Аудиореактивные силы
- Адаптивный контроллер качества
- 154 теста, ноль предупреждений
- Миграция на TypeScript + esbuild
- Полный LBVH
- Многоотскоковое GI
- Шумоподавление SVGF
- RTAO
- Элементы управления WebGPU UI
- TAA
- Пресеты качества
- Инструменты производительности
- Сохранение/загрузка
- Продвинутая постобработка
- Объемное освещение
- Новые формы и режимы
- Расширенная аудиореактивность
- Столкновения частиц
- Функции сообщества
- Поддержка VR/AR
- Система плагинов
- Продвинутые каустики
- API скриптинга
- Полноценный фреймворк для продакшна
| Документ | Статус | Последнее обновление |
|---|---|---|
| README.md | Актуален | 2025-12-30 |
| WEBGPU_SETUP.md | Актуален | 2026-02-19 |
| LIGHTING_REPORT.md | Актуален | 2025-12-29 |
| CLAUDE.MD | Актуален | 2025-12-29 |
| ROADMAP.md | Актуален | 2026-02-19 |
| API_DOCS.md | Отсутствует | - |
| CONTRIBUTING.md | Отсутствует | - |
| CHANGELOG.md | Отсутствует | - |
Мы приветствуем вклад в проект. Приоритетные направления:
- Реализация Фазы 4 -- BVH, многоотскоковое GI, SVGF
- Оптимизация производительности -- профилирование, оптимизация
- Новые формы -- математические поверхности, органические формы
- Документация -- обучающие материалы, примеры, документация API
- Тестирование -- кроссбраузерное, кроссплатформенное тестирование
- Фазы 1, 2 и 3 представляют собой суммарно значительный объем нового кода
- WebGPU-версия требует Chrome 113+ с включенным флагом
- WebGL2-версия готова к продакшну и широко совместима
- XPBD-физика компилируется в WASM для нативной производительности в браузере
- Все функции поддерживают целевой показатель 60 FPS на современном оборудовании
- Корректный откат с WebGPU на WebGL2
Последняя ревизия: 2026-02-19 Следующая ревизия: При начале Фазы 4 Поддерживается: 4RH1T3CT0R7