Chrome / V8 медленно onmousemove () над определенными элементами - PullRequest
Новая
       12

Chrome / V8 медленно onmousemove () над определенными элементами

5 голосов
/ 25 октября 2011

Я разрабатываю музыкальный проигрыватель на основе jQuery, который имеет длинный список элементов в главном разделе (неупорядоченный список с

элементами в каждом , для информации об исполнителе, альбоме и названии).

Вы можете получить доступ к его временной общедоступной версии здесь: http://music.sixteennet.co.uk/?anonymous

(Все песни являются неактивными ссылками в общедоступной версии, поэтому не беспокойтесь о воспроизведении чего-либо: P)

Во-первых, краткое описание того, что это за штука:

Слева находится боковая панель, отображающая список подходящих песен.Пользователь выбирает песни в главном списке (щелчок, нажатие клавиши shift, нажатие ctrl, вы знаете детали) после поиска / щелчка по исполнителям и добавляет их в список воспроизведения слева, нажимая или перетаскивая .У меня все это работает (этот вопрос не касается того, как создать пользовательский интерфейс Javascript).

Проблема : $ (window) .mousemove (), .mouseup () и .mousedown () содержат функции для отображения поля с высотой в пикселях (16 * количество выбранных песен в основном списке) [каждая

имеет высоту 16px].Когда мышь перемещается, это поле перемещается вместе с ней до тех пор, пока мышь не окажется над списком воспроизведения, список воспроизведения не изменит цвет, и если пользователь решит mouseup () (не щелкнет), выбранные песни будут добавлены в список воспроизведения.

Единственное, что, когда мышь движется с выбранным в настоящий момент окном выбранных песен, в Google Chrome движение окна невероятно запаздывает, но только когда мышь находится над основным списком песен (Тем не менее, загрузка процессора застряла на 100% в течение всего времени отображения окна).В Firefox 6 и IE 9 движение плавное, а загрузка ЦП не 100% (даже на Athlon 64 3500+).Этот тест был повторен (мной) на двух компьютерах, один из которых работает под управлением Windows 7, а другой - под управлением Ubuntu Linux.

Я очень подозреваю, что это ошибка в Google Chrome, но если у кого-то есть желание пойтичерез исходный код и скажите мне, в чем проблема (если она есть) ... вы мне Бог:)

РЕДАКТИРОВАТЬ: причина, по которой я сказал Chrome / V8, потому что Safari, используя тот жеМеханизм рендеринга (WebKit) не имеет этой проблемы (хотя он не такой гладкий, как Firefox / IE9 / Opera)

Ответы [ 2 ]

4 голосов
/ 25 октября 2011

Я собираюсь ответить на свой вопрос, так как нашел решение:

Запуск этой функции jQuery на коробке устранил проблему задержки: 

$.fn.disableSelection = function() {
  return this.each(function() {
    $(this).attr('unselectable', 'on')
    .css({
      '-moz-user-select':'none',
      '-webkit-user-select':'none',
      'user-select':'none',
      '::selection':'none',
    })
    .each(function() {
      this.onselectstart = function() { return false; };
    });
  });
};
1 голос
/ 25 октября 2011

Я не вижу задержки в моем компьютере ...

В любом случае, возможно, вы можете попытаться уменьшить частоту, которую может вызывать ваш обработчик событий, используя что-то вроде подчеркивания throttle function

...