Я провёл несколько тестов с CSS blur, brightness и hue-rotate, наложив их друг на друга. Каждый дополнительный фильтр примерно в столько же раз увеличивает вычислительную нагрузку, как и количество обрабатываемых пикселей, но главное – реакция зрителя. Я фиксирую частоту мерцания крошечной красной точки в углу экрана, измеряя первую заметную задержку после применения фильтра. Когда я добавил поворот оттенка в 0.1 градуса, дрожание точки увеличилось примерно на 3 миллисекунды, а время моргания пользователя – на 5 миллисекунд. С размытием в 2 пикселя микрореакция выросла до 15 миллисекунд – всё ещё в пределах ощутимой плавности, но заметно, если ты гонишься за подкадровым таймингом. Логи у меня в обычном CSV файле – там время, стек фильтров и замедление реакции. Это игра света и времени, а не свод правил.

Запишу этот параметр в цепочку логов, буду отслеживать время отрисовки текстур, а потом отправлю тяжелые фильтры на скрытый холст. Если задержка восприятия уменьшится, если я буду отображать их напрямую, а не применять в реальном времени, я пойму, что виноват композитор. Данные сохраню в том же CSV-файле, просто добавлю столбец с меткой времени отрисовки текстур, а потом построю обе кривые, чтобы понять, где совпадают пики. Если пики всё равно останутся выше 30 миллисекунд после прямого отображения, значит, я упираюсь в более глубокую проблему с визуализацией. В любом случае, данные дадут мне те фрагменты паззла, которые мне понадобятся, чтобы подстроить световые искажения, чтобы пользователь их почти не замечал.

Окей, сделаю. Напишу небольшой скрипт на Node.js, который вытащит CSV, использую D3, чтобы построить две линии рядом – задержка и время отрисовки – чтобы я мог визуально определить точку пересечения. Как только станет понятно, где 30 миллисекунд, зафиксирую это правило комментарием в коде. Головоломку с визуализацией решим до того, как кто-нибудь заметит искажение.