Разве плохо запускать бесконечные анимации CSS3 и покидать страницу? Анимация все еще работает невидимо?

Question

Я где-то читал (к сожалению, я не могу найти свой источник снова), что если пользователь загрузил HTML-страницу с запущенной анимацией CSS3 (бесконечный параметр), и он решил покинуть ее, браузер (компьютер) по-прежнему без необходимости воспроизводится анимация и так, процессор (или аппаратное ускорение?) все еще работает для анимации, хотя пользователь покинул страницу.

Так что, если кто-то может ответить мне, я буду рад.

Это правда?

И если это правда:

1. Переходы также связаны с этой проблемой?

2. Достаточно ли приостановить анимацию (и переход, если это необходимо), чтобы избежать этой проблемы? (Я думал, чтобы заставить паузу с onbeforeunload событие) Или я должен сделать что-то другое? Обратите внимание, что я не хочу использовать "hover" для запуска анимации / переходов.

PS: я все еще новичок в CSS, javascript и не знаю другого языка. И извините, но мое знание английского языка далеко от верха...

Answer 1

Если пользователь полностью покидает страницу (например, переходит на новую страницу или закрывает эту вкладку), анимация не должна продолжаться. Если они каким-то образом продолжают обновляться, то это из-за ошибки браузера, и вам все равно не стоит об этом беспокоиться.

Тем не менее, CSS3 анимации для скрытых элементов (display: none;например, по-прежнему оцениваются, поскольку они основаны на ключевых кадрах, и в будущем может появиться ключевой кадр, из-за которого элемент снова станет видимым.

Представьте, что вы хотите оживить коробку, сначала спрятав ее, а затем снова показав и заставив ее мигать. Если переходы CSS внезапно отключатся, когда блок будет скрыт, анимация остановится, и блок больше никогда не появится. И это не то, что вы хотите.

Примечание: профилирование вашей веб-страницы может быть выполнено, например, в Chrome, используя Инструменты разработчика (F12 -> Профили). Я не использовал его для профилирования анимации CSS3, поэтому я не уверен, что это можно сделать. Однако вы можете просто взглянуть на собственный менеджер задач Chrome (Shift-ESC) и посмотрите, не использует ли ваш сайт значительное количество ресурсов процессора. Если это правда, то это признак того, что на этой странице может быть слишком много анимации.