Экшены из воркера

Для "разгрузки" основного потока применяются воркеры (opens new window). В воркере можно проводить сложные вычисления, которые могли бы привести к просадкам в основном потоке. И затем необходимо передать результат вычислений в основной поток. Если вы используете vuex, то чаще всего вам будет необходимо результаты вычисления воркеров передать в хранилище.

С Vuexok это сделать очень просто. Vuexok позволяет проксировать методы экшенов в воркеры.

Доработка инициализации воркера

После инициализации воркера надо передать его в метод vuexokWorkerWrapper

import { vuexokWorkerWrapper } from 'vuexok/dist/vuexokWorkerWrapper'
const worker = new Worker('./worker')
vuexokWorkerWrapper(worker)

При этом вы можете так же использовать comlink (opens new window) вместе с vuexok.

Доработка воркера

Теперь перейдем к коду воркера. Что бы в воркере были доступны экшены модуля достаточно буквально 3 строки. В коде воркера импортируем метод vuexokWorkerGetActions, который нам вернет методы для вызова экшенов модуля.

import { vuexokWorkerGetActions } from 'vuexok/dist/vuexokWorkerGetActions'

Воркер ничего не знает о нашем сторе и модулях, поэтому надо импортировать в воркер тип модуля.

Так как мы не хотим, чтобы в воркере был vuex и код нашего модуля, то импортируем только тип модуля. Typescript версии выше 3.8 (opens new window) позволяет импортировать только тип.

import type {countModule} from '@/store/modules/countModule'

Теперь мы можем получить доступ к экшенам нашего модуля из воркера. Метод vuexokWorkerGetActions принимает один обязательный параметр - путь к модулю vuex.

const countModuleActions = vuexokWorkerGetActions<typeof countModule>('countModule')

Простой пример (20 секунд)

Обработка ошибок экшена

Для взаимодействия воркера и основного потока используется метод postMessage (opens new window).

postMessage использует алгоритм структурированного клонирования (opens new window), реализация которого в ff не поддерживает передачу нативных ошибок (opens new window). По этому вместо оригинального объекта ошибки vuexok передает в воркер поле message объекта Error (opens new window) и внутри воркера создается новый экземпляр ошибки new Error(message)