Максимальное количество полотен (используется в качестве слоев)?

Question

Я пишу приложение HTML5 canvas в javascript. Я использую несколько элементов canvas в качестве слоев для поддержки анимации без необходимости перерисовывать все изображение в каждом кадре.

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

Спасибо.

Answer 1

Я полагаю, что вы, вероятно, достигнете практического предела производительности задолго до того, как достигнете жесткого установленного предела где-то между несколькими тысячами и 2 147 483 647 ... в зависимости от браузера и того, что вы измеряете (количество физических элементов, допустимых в DOMили максимально допустимый z-индекс).

Это связано с другим моим любимым ответом на практически любой вопрос, который включает фразу " максимальное число " - если вам нужно спросить,Вы, вероятно, делаете это неправильно ™.Выбор подхода, который согласуется с намеченным дизайном, почти всегда возможен, и позволяет избежать таких неприятных темных вопросов, как «растает ли iPhone моего пользователя, если я попытаюсь отобразить 32 768 элементов холста, накладываемых друг на друга?»

Answer 2

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

Ключ в вашей ситуации, я бы сказал, заключается в том, чтобы подготовить несколько простых тестов / тестов, которые динамически генерируют холсты (произвольного числа), заполнить их содержимым и добавить их в DOM. Вы должны быть в состоянии построить свои тесты таким образом, чтобы A) при наличии жесткого ограничения вы его заметили (используя идентифицируемый контент холста или обработку исключений), или B) при наличии ограничения производительности вы его заметили (используя профилирование или таймеры). Затем выполните эти тесты в различных браузерах, чтобы установить практический «предел».

Здесь также есть отличные ресурсы https://developers.facebook.com/html5/build/games/ от инициативы HTML5-игр Facebook. Там есть ссылки на статьи и инструменты тестирования с открытым исходным кодом, в которых рассматриваются и тестируются различные стратегии, аналогичные вашей.