API Веб-потоков

Веб-потоки позволяют запускать операции скрипта в фоновом потоке, отделённом от основного потока выполнения веб-приложения. Преимущество этого в том, что трудоёмкие операции обработки могут выполняться в отдельном потоке, позволяя главному (обычно, UI) потоку работать без блокировки/замедления.

Поток — это объект, созданный с помощью конструктора (например, Worker()), который выполняет работу с именованного файла JavaScript — этот файл содержит код, который будет выполняться в потоке-рабочем.

Помимо стандартного набора функций JavaScript (например, String, Array, Object, JSON и т. д.), вы можете выполнять почти любой код в потоке-рабочем. Есть исключения: например, вы не можете напрямую манипулировать DOM изнутри потока-рабочего или использовать некоторые стандартные методы и свойства объекта Window. Информация о коде, который можно выполнять, доступна в поддерживаемых функциях и поддерживаемых веб-API.

Обмен данными между потоками-рабочими и основным потоком происходит через систему сообщений — обе стороны отправляют свои сообщения с помощью метода postMessage(), и отвечают на сообщения с помощью обработчика события onmessage (сообщение содержится в свойстве события message data). Данные копируются, а не разделяются.

Потоки-рабочие могут создавать новые потоки-рабочие, при условии что эти потоки размещены в том же источнике, что и родительская страница.

Кроме того, потоки-рабочие могут отправлять запросы к сети, используя API fetch() или XMLHttpRequest (хотя обратите внимание, что атрибут responseXML объекта XMLHttpRequest всегда будет null).

Существует несколько различных типов потоков:

• Потоки-рабочие используются единственным скриптом. Этот контекст представлен объектом DedicatedWorkerGlobalScope.
• Общие потоки-рабочие могут использоваться несколькими скриптами, работающими в разных окнах, фреймах и т. д., при условии, что они находятся в одном домене с рабочим потоком. Они немного сложнее, чем потоки-рабочие — скрипты должны общаться через активный порт.
• Рабочие потоки-сервисы по сути являются прокси-серверами, которые находятся между веб-приложениями, браузером и сетью (при наличии). Они предназначены, среди прочего, для создания эффективного офлайн-опыта, перехвата запросов к сети и принятия соответствующих мер в зависимости от доступности сети, и обновления активов, хранящихся на сервере. Они также позволят получить доступ к API уведомлений push и синхронизации в фоновом режиме.

Хотя Window не доступен напрямую потокам-рабочим, многие из тех же методов определены в общем миксине (WindowOrWorkerGlobalScope), и доступны потокам-рабочим через свои контексты, производные от WorkerGlobalScope:

• DedicatedWorkerGlobalScope для потоков-рабочих
• SharedWorkerGlobalScope для общих потоков-рабочих
• ServiceWorkerGlobalScope для рабочих потоков-сервисов

Worker

Представляет работающий поток-рабочий, позволяющий передавать сообщения коду работающего потока-рабочего.

WorkerLocation

Определяет абсолютное расположение скрипта, выполняемого Worker.

SharedWorker

Представляет собой специфический тип потока-рабочего, к которому можно получить доступ из нескольких контекстов просмотра (т.е. окон, вкладок или iframes), или даже из других потоков-рабочих.

WorkerGlobalScope

Представляет общий контекст любого потока-рабочего (выполняет ту же работу, что и Window для обычного веб-контента). Разные типы потоков-рабочих имеют объекты контекста, наследующие от этого интерфейса и добавляющие более специфические функции.

DedicatedWorkerGlobalScope

Представляет контекст потока-рабочего, наследующего от WorkerGlobalScope и добавляющего некоторые специфические функции.

SharedWorkerGlobalScope

Представляет контекст общего потока-рабочего, наследующего от WorkerGlobalScope и добавляющего некоторые специфические функции.

WorkerNavigator

Представляет идентификатор и состояние пользователя (клиент).

Мы создали несколько демо-примеров, чтобы продемонстрировать использование веб-потоков:

• Пример базового потока-рабочего (запустить поток-рабочий).
• Пример базового общего потока-рабочего (запустить общий поток-рабочий).
• Пример потока-рабочего с OffscreenCanvas (запустить поток-рабочий с OffscreenCanvas).

Дополнительную информацию о том, как работают эти демо, вы можете найти в Использование веб-потоков.

• Использование веб-потоков
• Worker интерфейс
• SharedWorker интерфейс
• API рабочих потоков-сервисов