Пожалуйста, дождитесь модального наложения, прежде чем ждать функцию с большой рабочей нагрузкой без setTimeout()?
-
22-09-2019 - |
Вопрос
Это упрощенный пример, чтобы убедиться, что не задействованы асинхронные функции затухания / анимации.
Я хочу, чтобы фон был красным, когда функция с большой нагрузкой работает, и становился черным, когда она будет готова.Что на самом деле происходит, так это то, что в большинстве случаев фон сразу становится черным, после того как функция будет готова.Вы не увидите красного фона, даже если вы ждете предупреждения "готово".
Есть ли лучшее решение, затем подождать несколько миллисекунд с помощью setTimeout, чтобы произошло изменение фона на красный?Вызов work() напрямую приводит к возникновению проблемы.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Test</title>
<script type='text/javascript'>
function work()
{
var i, a;
a = [];
for(i = 0; i < 250000; i++)
{
a.push(Math.random());
}
a.sort();
document.getElementsByTagName('body')[0].style.background = '#000000';
alert('done');
return true;
}
window.onload = function() {
document.getElementsByTagName('body')[0].style.background = '#ff0000';
//work();
setTimeout(work, 100);
};
</script>
</head>
<body>
<h1>Test</h1>
</body>
</html>
Решение
"Модальное всплывающее окно" предназначено для того, чтобы спасти скрипт от полной (навсегда) блокировки браузера и заставляя пользователя действительно расстраиваться.Это охранник не обнаруживается из JS-кода и приостанавливает выполнение JS, которое следует за синхронный Модель.Это для того, чтобы спасти тебя, напишите код, который не блокирует!На самом деле довольно легко настроить большинство вычислений на возобновляемость и отменяемость с помощью блокировок / замыканий или очередей.
В любом случае ...по моему опыту, "задержки" в 1 мс достаточно в FF3.5 (Win) и IE6-8 для обновления CSS (фактическая задержка, скорее всего, составит более 1 мс).Это заставляет "ставить в очередь" сообщение о событии обратно внутри синхронной модели который, по крайней мере, в приведенных выше случаях, позволяет применять стили CSS до продолжения выполнения JS.Я думаю Prototype.js использует значение 0 мс для своей функции "задержки", но я не настолько храбр.
Кроме того, 'document.body' :-)
(Я совершенно уверен, что "лучшего" способа не существует, хотя весь этот подход попахивает рыбным рынком под открытым небом.)