Двойная буферизация в HTML5 Canvas?

Кажется, моя простая холщовая игра отлично работает на Chrome и FF на Mac / Linux. У меня еще не было возможности протестировать его на смартфонах или Windows. Он не использует двойную буферизацию, но я видел несколько примеров использования JS Canvas.

Когда рекомендуется использовать двойную буферизацию? Это имеет значение только для определенных браузеров? Есть ли значительный удар по производительности?

Благодарность!

— Петтери Хиетавирта
источник

OT: эта игра правил, она очень многообещающая, хорошая работа (конечно, вам нужно гораздо больше работать над интерфейсом, некоторые вещи не ясны и т. Д.)

— o0 '.

Это действительно очень мило. Рекомендация: переключение уровня карты на что-то другое, кроме пространства. Немного раздражает, что мой браузер прокручивает окно каждый раз.

— Майкл Бартнетт

Также не используйте клавиши со стрелками для управления. Я в настоящее время нахожусь в безопасном режиме, и на маленьком экране он продолжает прокручиваться повсюду ... fyi: p

— Tor Valamo

Я думаю, что можно захватывать ключи, чтобы окна браузера не действовали на них.

— AttackingHobo

Благодарность! A, W, D и вернитесь на работу. Отправьте твит на momentumracer или отправьте электронное письмо по адресу petteri@momentumracer.com для получения дальнейших комментариев или идей, чтобы это не стало доской для чатов :-).

— Петтери Хиетавирта

Ответы:

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

Chrome имеет ускорение на GPU (в последних версиях), а также злой быстрый движок JavaScript (V8), который вы не увидите в мобильной среде. Даже в Chrome вы увидите замедление, реализовав двойную буферизацию.

Короче говоря, выгода от двойной буферизации (борьбы со «разрывом») не стоит того удара, который вы, скорее всего, получите.

— Geoff
источник

Однако, когда вы заметите мерцание или что-то подобное, двойной буфер, скорее всего, исправит это. Чтобы ответить на ваш вопрос: если вы заметили мерцание, я предлагаю использовать двойной буфер. Иначе нет и причины. Обратите внимание, что двойной буфер легко внедрить или удалить (если вы заметите, что потеря производительности перевешивает мерцание).

— user8363

Нет необходимости дублировать буфер html5-игр. Браузер уже обрабатывает это для вас, обновляя объект canvas только после запуска вашего скрипта. http://www.mail-archive.com/whatwg@lists.whatwg.org/msg19969.html

— G1i1ch
источник

Я заметил, что используя двойную буферизацию, вот так:

нарисовать все невидимым холстом
скопировать невидимый холст на настоящий холст

на самом деле замедляет рендеринг (ниже fps), вместо того, чтобы ускорять его

— Серебряная луна
источник