Во избежание рисования половины пикселя в холсте HTML5 улучшите скорость?

Question

Я рисую спрайт (из шара) на элемент холста. Однако, когда мяч перемещается, положение x или y шара может стать дробным, например. (20,153, 63,638). Когда холст используется для рисования этого изображения, он пытается использовать прозрачные пиксели, чтобы мяч выглядел в его положении более точно.

Мне было интересно, должен ли я использовать Math.round() перед тем, как рисовать шар, чтобы избежать прозрачного элемента изображения, и, возможно, ускорить игру. Это поможет? Игра представляет собой сложную игру в понг.

Изображение ниже, должно помочь с моим объяснением:

Answer 1

По крайней мере this guy seems to believe so. Как отметил Гейб, это зависит от реализации.

Обратите внимание, что какой-то антиалиасинг, похоже, срабатывает, если вы используете обычные углы (1, 14 и т. Д.). По этой причине некоторые гиды () в основном показывают, что вам лучше, размахивая полупикселями (то есть 1.5, 14.5 и т. Д.). Однако я не знаю, влияет ли это на производительность. Это заметно для результата рендеринга.

Возможно, вам также захочется поэкспериментировать с различными схемами расслоения. См. this question для получения дополнительной информации. В зависимости от вашей ситуации вы можете захотеть обрабатывать ваши объекты как отдельные холсты и даже просто компенсировать их поверх фона.

В качестве альтернативы вы можете попробовать сделать все это на одном холсте. В этом случае у вас есть дополнительные материалы для отслеживания. This library, похоже, обрабатывает всю бухгалтерию для вас.