У меня простой макет игры (кораблик летает по клеточному полю)
Управление:
W/стрелка на верх - ускорение
Мышка - направление корабля
(На всякий случай щёлкните мышью по полю, чтобы управлять, может заедать)
Я хочу сделать так, чтобы при большой скорости корабля сетка размывалась как во время движения.
Сначала я просто хотел через неполную очистку canvas (заливка частично закрытым прямоугольником), вот так:
Однако это хорошо смотрится лишь тогда, когда кораблик летит на маленькой скорости. На большой поле просто превращается в мелкую сетку, что тоже некрасиво. И это не эффект размытия. Это просто дублирование изображения с небольшим смещением, но не эффект motion blur.
Тогда я решил использовать
API canvas для применения фильтра размытия
Это уже лучше смотрится (особенно в сочетании с неполной очисткой canvas), но этот метод слишком тяжёлый и сильно сажает производительность
Я начал искать библиотеки, которые могут сделать такой эффект, но более лёгким способом.
Нашёл такую
Однако во-первых, внешне это выглядит как-то не очень. Во-вторых, это также слишком тормозит игровой процесс (явно это не 60FPS)
Может есть какой-то способ добиться эффекта motion blur, но с хорошей производительностью? Есть ли какие-то библиотеки? Или на canvas это невозможно сделать?