JS / overflow: скрытые проблемы с производительностью в Safari на iPad / iOS

Я работаю над системой прокрутки / панорамирования, подобной Google Maps. Предполагается, что система будет намного проще, чем "оригинальная" (без масштабирования), и поэтому построена довольно просто:

  • Имеется содержащий div, представляющий окно просмотра со скрытым переполнением и фиксированным размером
  • Этот div содержит другой div, который панорамируется на основе движения мыши
  • В зависимости от видимой области фиксированные div (или imgs ) добавляются в div панорамирования для отображения частей очень большого изображения

Эта настройка работает должным образом. Особенно в обычных браузерах на десктопах он работает безупречно. Прокрутка плавная.

Но не так много на iPad: здесь все кажется очень вялым. При панорамировании наблюдается явно заметная задержка, и для регистрации кликов требуется очень много времени.

Чтобы заставить его работать с сенсорными интерфейсами, в первую очередь мне пришлось «преобразовать» события касания в события мыши. Хотя без этого сложно проверить разницу в производительности, Я считаю, что это не причина проблемы, потому что скорость отклика на простые клики остается столь же низкой при ее деактивации.

Я попытался выяснить, в чем могут быть причины этого, кратко взглянув на сами Карты Google (которые работают на iPad так же хорошо, как и где-либо еще), но безрезультатно (слишком сложно получить быстрая идея). Так что, в конце концов, я думаю, что это может иметь какое-то отношение к тому, как мобильный Safari обрабатывает div в контейнере, установленном на «overflow: hidden;», некоторые проблемы с кешированием или требуемые JS-уловки, о которых я не знаю.

Любые идея, с чего бы я мог начать поиск?

7
задан Matt Ball 16 September 2010 в 21:49
поделиться