Если мы хотим выполнить функцию асинхронно, первым методом, о котором мы думаем, определенно будет установленное время
Например: setTimeout (function (/* сделать что -то после 1S*/) {}, 1000}
Так что, если вы хотите выполнить функцию, асинхронно, самый быстрый?
Будет ли это:
setTimeout (function ( /* сделать что -то как можно скорее* /) {}, 0}К сожалению, чтобы избежать возможности затыкнуть поток пользовательского интерфейса в гнезде Settimeout, браузер устанавливает минимальный интервал времени выполнения для SetTimeout, и минимальный интервал времени выполнения для разных браузеров отличается. Фактический интервал времени выполнения SetTimeout 0 в Chrome составляет около 12 мс.
Так что, если вы хотите выполнить функцию асинхронно асинхронно, есть ли способ ускорить?
Давайте посмотрим на сторону браузера, каковы обычно используемые асинхронные методы выполнения
SetImmediate: Этот метод реализует асинхронное выполнение быстрее, чем SetTimeout 0, с временем выполнения ближе к 0 мс, но только IE/Node поддерживает его.
requestAnimationFrame: этот метод часто используется при выполнении петли анимации. Этот метод будет выполняться только тогда, когда браузер обновляет пользовательский интерфейс. Максимальная частота обновления пользовательского интерфейса, как правило, 60 кадров в секунду, поэтому requestAnimationFrame, как правило, медленнее, чем SetTimeout 0.
В дополнение к использованию асинхронных функций, существуют некоторые методы, которые могут реализовать асинхронные вызовы.
Используйте OnMessage:
При общении с iframes часто используется метод OnMessage, но что происходит, если одно и то же окно -постмессаж дается самому себе? Фактически, это эквивалентно выполнению функции асинхронно
Например:
var dosth = function () {} window.addeventListener ("Сообщение", Dosth, True); window.postmessage ("", "*");Кроме того, вы также можете использовать теги скрипта для реализации асинхронного выполнения функций, таких как:
var newscript = document.createElement ("script"); newscript.onreadystateChange = dosth; document.documentelement.appendchild (Newscript);Добавление скрипта в документ также будет выполнять OnreadyStateChange, но этот метод может использоваться только в браузерах в рамках IE.
Так кто же самый быстрый с этими методами?
Проверил это,
Под хромом:
SetImmediate: недоступен.
SETTIMEOUT 0: 12 мс
Onmessage: 6 мс
OnreadyStateChange: не поддерживается
Под Chrome OnMessage быстрее, чем SetTimeout 0.
Firefox:
SetImmediate: недоступен.
SETTIMEOUT 0: 7 мс
OnMessage: 7 мс
OnreadyStateChange: не поддерживается
Под Firefox onmessage и settimeout 0 находятся на одинаковой скорости.
IE9:
SetImmediate: недоступен.
SETTIMEOUT 0: 11 мс
OnMessage: 7 мс 10 мс
OnreadyStateChange: 2 мс
В IE9 время OnreadyStateChange намного быстрее, чем два других.
В целом, SetImmediate <reateStateChange <onMessage <setTimeout 0 <requestAnimationFrame
Поэтому мы можем просто инкапсулировать метод для быстрого выполнения асинхронной функции:
var setzerotimeout = (function () {if (window.setimmediate) {// ie10+ версия, используйте Native SetimmediaterUnd window.setImmediate;} else if ("onreadyStateChange" в document.createElement ("script")) {return function () {/* версия onloadeChange*/}}}} if (wansemess). function () {/* версия с использованием onmessage*/}} else {return window.settieout;}}) ();