Ошибка отображения - «Мигает отложено задание, чтобы сделать прокрутку более гладкой»

Question

Я пытаюсь создать приложение для ионной (1) с использованием угловых. Я не понимаю, почему я получаю это предупреждение

«Blink отложила задачу, чтобы сделать прокрутку более гладкой. Ваши задачи таймера и сети должны принимать менее 50мс бежать, чтобы избежать этого. Пожалуйста, смотрите https://developers.google.com/web/tools/chrome-devtools/profile/evaluate-performance/rail и https://crbug.com/574343#c40 для более Информация."

И дополнительные предупреждения, когда я использую страницы ползунков являются

«Игнорируются попытка отменить событие TouchMove с отменяемой = ложью, например, потому что прокрутка продолжается, и не может быть прервана.»

«Обработка события ввода„touchstart“была задержана на 835 мсов из-за основной поток будучи заняты. Рассмотрит маркировку обработчика события как„пассивные“, чтобы сделать страницу более отзывчивой»

Answer 1

Это предупреждение «нормали». Веб-просмотр в основном говорит вам, что некоторые события связаны с событием прокрутки или даже с сенсорным событием, что может замедлить работу приложения. Документы google рекомендуют, например, использовать интервалы вместо выполнения вычислений или функций непосредственно на события touchmove/drag, что не всегда возможно с помощью мобильного приложения с веб-просмотром в зависимости от того, что вы пытаетесь выполнить UX.

Кроме того, если вы используете setInterval, вам придется использовать сумасшедшие агрессивные тайминги, такие как 10 мс, и ваш прокрутка/перетаскивание будет выглядеть очень плохо. Просто забудьте эти предупреждения, они очень общие и, скорее всего, рекомендации, но в большинстве случаев этого избежать нельзя.

Если вы все еще хотите избежать предупреждения, вот пример jQuery. Идея состоит в том, чтобы уловить любые значения из события, а затем выполнить вычисления в отдельном потоке.

var int, x, y; 

$('#mydiv').on('touchstart', function(event){ 
     int = setInterval(work, 20); 
}); 

$('#mydiv').on('touchend', function(event){ 
     clearInterval(int); 
}); 

$('#mydiv').on('touchmove', function(event){ 
     x = event.touches[0].pageX; 
     y = event.touches[0].pageY; 
}); 

function work(){ 
     //how you can do whatever with x y without getting a warning 
} 

Answer 2

Может быть связаны между собой, но из моего опыта, в основном вы получаете это потому, что ваш Угловое/страница все еще интенсивно обработки. Я использовал эти предупреждения, если бы я попытался прокрутить слишком быстро после перехода в новое состояние - если бы я ждал секунды, было бы хорошо. Мое решение состояло в том, чтобы отключить прокрутку js, чтобы освободить больше энергии, чтобы она была более актуальной. Проверка scrolling.jsScrolling(value) на http://ionicframework.com/docs/api/provider/$ionicConfigProvider/

Answer 3

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