Является ли полезным, чтобы перетаскивание mousedragging происходило внутри requestAnimationFrame? - PullRequest
2 голосов
/ 25 февраля 2020

У меня есть библиотека перетаскивания, которая перемещает элемент при каждом перемещении мыши. Как все мы знаем, mousemove срабатывает довольно часто и, таким образом, заставляет браузер перерисовываться. Это может быть решено путем фактического перемещения в requestAnimationFrame.

Это полезно сделать? Это увеличит производительность и уменьшит краски? Есть ли какие-то проблемы, о которых я не думал?

1 Ответ

1 голос
/ 25 февраля 2020

Зависит от браузера и варианта использования.

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

Реализациям рекомендуется определять оптимальную частоту, чтобы сбалансировать отзывчивость и производительность.

Chrome и Firefox делают это, вызывая эти события только при обновлении экрана sh Оцените, как раз перед тем, как requestAniamtionFrame обратные вызовы сработают.
Таким образом, в этих браузерах вы ничего не выиграете, но также не потеряете много.

Safari по-прежнему генерирует столько событий, сколько испускает устройство, поэтому в этом браузере вы выиграете, сохранив свой собственный порог.

( Обратите внимание, что если вы sh освободите sh этот порог, вам нужно будет использовать pointerevents вместо . )


Теперь это полезно, чтобы избежать бесполезного вычисления вещей, которые будут отбрасываться при следующих вызовах до того, как его можно будет нарисовать.
painting всегда будет ограничен до sh скорости вашего экрана (сразу после requestAnimationFrame callbacks fire).
Так что вам решать, если вы будете sh применять этот порог или нет.
Например, может иметь смысл как можно быстрее обновить список точек, но дождаться обратного вызова requestAnimationFrame , чтобы фактически внести изменения в DOM или нарисовать что-либо.

Из того немногого, что вы сказали о своем случае, похоже, что вы действительно можете выиграть, ожидая обратных вызовов requestAnimationFrame , только потому, что вы можете изменять блочную модель вашего CSSOM.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...