Парсинг JSON в воркере?

Question

[Алексей]

Из ответов только от 2015 года в гугле.
Есть ли смысл делать отдельный воркер для вебсокета ? Общаюсь с сервером плевками JSONа по онному.
Вопрос в следующем: нивелируется ли парсинг jsona в отдельном потоке изза копирования объектов при передаче из воркера и обратно ? Или же такая конструкция имеет место быть ?

// App.vue
mounted() {
	this.$store.state.socketWorker = new Worker('/js/socketWorker.js');
	this.$store.state.socketWorker.addEventListener('message', ({ data }) => !this.$store._mutations[data.a] || this.$store.commit(data.a, data)); 
};

// Воркер
var ws = new WebSocket('wss://someaddr');

ws.onmessage = ({data}) => {
	try { data = JSON.parse(data); } catch(e) { return; };
	self.postMessage(data);
};

self.addEventListener('message', ({ data }) => {
	if (!ws || ws.readyState !== 1) return;
	let msg = '';
	try { msg = JSON.stringify(data); } catch(e) { return; };
	ws.send(msg);
});

Answer 1

[Alex]

Я бы отдел предпочтению в пользу отказа от воркера. Такой подход имеет место быть только если у вас очень большие JSON. Настолько большие или так много, что время на их обработку заметно невооруженным взглядом.

Если же это нетак, тогда, как по мне, было бы удобнее держать сокет в основном потоке. Это даст возможность всем компонентам независимо друг от друга подписываться на разные события. Что-то в таком духе:

// socketFactory.js
let ws = null

export function getSocket() {
  if (!ws) ws = new WebSocket('wss://someaddr');
  return ws
}

// SomeComponent.vue
import {getSocket} from 'socketFactory.js'
const ws = getSocket()

export default defineComponent({
  created() {
    ws.onmessage(message => {
      if ( ... ) {
        // Делаем что-то с сообщением
        this.onMessageHandled(message)
      }
    })
  },
})

Таким образом каждый компонент может общаться с сокетом не зависимо. При этом отпадает нужда во Vuex. Мой пример далёк от идеала, тут стоило бы вообще сокет вынести на ещё один слой абстракции, но я надеюсь идею вы поняли.

И подчеркну, что это всё может быть вредно, так как я не знаю всей вашей архитектуры.

Comments

[Алексей]

В том то и дело что их много, тоесть любой чих на сайте это отправка в сокет и бродкаст изменений всем другим. Наверное можно сравнить с какой-нибудь онлайн игрой.
Забыл еще уточнить, что в воркер закинута библиотека пако https://github.com/nodeca/pako , потому что для бродкаста с сервера вручную гзипую сообщение, т.к. у ws опция perMessageDeflate при попытке бродкаста сжимает на каждый вызов.
Поэтому он не только парсит, но и распаковывает.

// worker.js
ws.onmessage = ({data}) => {
	if (data[0] !== '{') {
		data = pako.ungzip(data.split('').map(x => x.charCodeAt(0)), { to: 'string' });
	};
	try { data = JSON.parse(data); } catch(e) { return; };
	self.postMessage(data);
};

// vue actions.js 
WEBSOCKET_SEND_MESSAGE: function({ state }, msg) {
	state.socketWorker.postMessage(msg);
},

// Шаблон любого компонента, который может общаться в сокет
<template>
	<button @click="WEBSOCKET_SEND_MESSAGE({ a:'someServerAction' })">SomeBtn</button>
</template>

<script>
import { mapActions } from 'vuex';
methods: {
	...mapActions(['WEBSOCKET_SEND_MESSAGE']),
},
</script>