Amedomary 25 фев 2020 в 07:29

Prerender on canvas 2D

2 мин

3.2K

JavaScript*Canvas*

Туториал

Комментарии 6

grgd 25 фев 2020 в 08:29

Забавно, раньше так во флэше анимации в битмапы кэшировали.
А по теме — зачем так мучаться, когда есть WebGL. Примеров полно по запросу webgl pixel particles

Amedomary 25 фев 2020 в 08:30

Это уже второй вариант решения проблемы — но он более трудозатратный)
Этот вариант я тоже проверю))

GCU 25 фев 2020 в 09:15

Если анимация одна и та же, то можно использовать видео.

hardtop 25 фев 2020 в 11:04

Толково.

-2

noodles 27 фев 2020 в 00:16

Если у вас есть идеи по повышению производительности данного подхода — пишите :)

Когда плотно изучал канвас, запомнился такой хак для оптимизации:
все тяжёлые расчёты и отрисовку делать в буферном канвасе (которого не видно в DOM). А потом уже покадрово выводить готовую картинку в настоящий канвас с помощью drawImage.
Было правда давно, сейчас может и неактуально.

Amedomary 27 фев 2020 в 08:45

ну как показала практика — рисовать в буферном канвасе стоит так же как и в настоящем, хотя мб я не так использую буферный?

Зарегистрируйтесь на Хабре, чтобы оставить комментарий

Показать лучшие за всё время

Prerender on canvas 2D

Комментарии 6

Публикации

Истории