javascript
June 5, 2022

Про MessageChannel

На днях у меня возник вопрос, а в какой момент EventLoop’а вызываются обработчики MessageChannel и я был удивлён. Первая мысль по этому поводу это, что обработчики складываются в микро таски, вперемешку с промисами, но не все так просто.

Напомню как выглядит MessageChannel (https://developer.mozilla.org/en-US/docs/Web/API/MessageChannel)

const channel = new MessageChannel();

channel.port2.postMessage(undefined)

channel.port1.onmessage = () => {

console.log(‘massageChannel’);

};

Самый частый кейс его использования это организация связи между нашим приложением и iframe, shared workers, web workers и т.д.

Тут пример в какой момент они отрабатывают в рамках EventLoop
https://codepen.io/dmitriypereverza/pen/QWQaMrB

Как видим вызовы MessageChannel вызываются после всех проминов, но до setTimeout. То есть они лежат и не в очереди тасков и не в очереди микро тасков. А где же тогда?

А для того чтобы объяснить это обратимся к спецификации и сразу станет все понятно
https://html.spec.whatwg.org/multipage/web-messaging.html#: ~: text=Each%20event%20loop%20has%20a%20task%20source%20called%20the%20unshipped%20port%20message%20queue.

Each event loop has a task source called the unshipped port message queue.

Теперь вы знаете что есть ещё одна очередь внутри EventLoop. Можно использовать этот козырь на собесах)