mirror of
https://github.com/cpvalente/ontime.git
synced 2026-08-05 23:43:57 +00:00
Refactor: WebSocket from flush queue to one patch (#1595)
* change flush to one patch * remove unused types * create batch * merge patch into eventStore Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> --------- Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
This commit is contained in:
committed by
Carlos Valente
parent
0a596624d5
commit
bdcec7a472
@@ -14,18 +14,6 @@ export const runtimeStore = createWithEqualityFn<RuntimeStore>(
|
||||
export const useRuntimeStore = <T>(selector: (state: RuntimeStore) => T) =>
|
||||
useStoreWithEqualityFn(runtimeStore, selector, deepCompare);
|
||||
|
||||
let batchStore: Partial<RuntimeStore> = {};
|
||||
|
||||
export function addToBatchUpdates<K extends keyof RuntimeStore>(key: K, value: RuntimeStore[K]) {
|
||||
batchStore[key] = value;
|
||||
}
|
||||
|
||||
export function flushBatchUpdates() {
|
||||
const state = runtimeStore.getState();
|
||||
runtimeStore.setState({ ...state, ...batchStore });
|
||||
batchStore = {};
|
||||
}
|
||||
|
||||
/**
|
||||
* Allows patching a property of the runtime store
|
||||
*/
|
||||
|
||||
@@ -14,7 +14,7 @@ import {
|
||||
} from '../stores/clientStore';
|
||||
import { addDialog } from '../stores/dialogStore';
|
||||
import { addLog } from '../stores/logger';
|
||||
import { addToBatchUpdates, flushBatchUpdates, patchRuntime, patchRuntimeProperty } from '../stores/runtime';
|
||||
import { patchRuntime, patchRuntimeProperty } from '../stores/runtime';
|
||||
|
||||
let websocket: WebSocket | null = null;
|
||||
let reconnectTimeout: NodeJS.Timeout | null = null;
|
||||
@@ -50,9 +50,9 @@ export const connectSocket = () => {
|
||||
|
||||
// we decide to allows reconnect
|
||||
reconnectTimeout = setTimeout(() => {
|
||||
if (reconnectAttempts > 2) {
|
||||
setOnlineStatus(false);
|
||||
}
|
||||
if (reconnectAttempts > 2) {
|
||||
setOnlineStatus(false);
|
||||
}
|
||||
console.warn('WebSocket: attempting reconnect');
|
||||
if (websocket && websocket.readyState === WebSocket.CLOSED) {
|
||||
reconnectAttempts += 1;
|
||||
@@ -141,59 +141,10 @@ export const connectSocket = () => {
|
||||
updateDevTools(serverPayload);
|
||||
break;
|
||||
}
|
||||
case 'ontime-clock': {
|
||||
addToBatchUpdates('clock', payload);
|
||||
updateDevTools({ clock: payload });
|
||||
break;
|
||||
}
|
||||
case 'ontime-timer': {
|
||||
addToBatchUpdates('timer', payload);
|
||||
updateDevTools({ timer: payload });
|
||||
break;
|
||||
}
|
||||
case 'ontime-onAir': {
|
||||
addToBatchUpdates('onAir', payload);
|
||||
updateDevTools({ onAir: payload });
|
||||
break;
|
||||
}
|
||||
case 'ontime-message': {
|
||||
addToBatchUpdates('message', payload);
|
||||
updateDevTools({ message: payload });
|
||||
break;
|
||||
}
|
||||
case 'ontime-runtime': {
|
||||
addToBatchUpdates('runtime', payload);
|
||||
updateDevTools({ runtime: payload });
|
||||
break;
|
||||
}
|
||||
case 'ontime-eventNow': {
|
||||
addToBatchUpdates('eventNow', payload);
|
||||
updateDevTools({ eventNow: payload });
|
||||
break;
|
||||
}
|
||||
case 'ontime-currentBlock': {
|
||||
addToBatchUpdates('currentBlock', payload);
|
||||
updateDevTools({ currentBlock: payload });
|
||||
break;
|
||||
}
|
||||
case 'ontime-publicEventNow': {
|
||||
addToBatchUpdates('publicEventNow', payload);
|
||||
updateDevTools({ publicEventNow: payload });
|
||||
break;
|
||||
}
|
||||
case 'ontime-eventNext': {
|
||||
addToBatchUpdates('eventNext', payload);
|
||||
updateDevTools({ eventNext: payload });
|
||||
break;
|
||||
}
|
||||
case 'ontime-publicEventNext': {
|
||||
addToBatchUpdates('publicEventNext', payload);
|
||||
updateDevTools({ publicEventNext: payload });
|
||||
break;
|
||||
}
|
||||
case 'ontime-auxtimer1': {
|
||||
addToBatchUpdates('auxtimer1', payload);
|
||||
updateDevTools({ auxtimer1: payload });
|
||||
case 'ontime-patch': {
|
||||
const patch = payload as Partial<RuntimeStore>;
|
||||
patchRuntime(patch);
|
||||
updateDevTools(patch);
|
||||
break;
|
||||
}
|
||||
case 'ontime-refetch': {
|
||||
@@ -213,8 +164,8 @@ export const connectSocket = () => {
|
||||
}
|
||||
break;
|
||||
}
|
||||
case 'ontime-flush': {
|
||||
flushBatchUpdates();
|
||||
default: {
|
||||
console.log('unknown WS message', type);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -696,6 +696,8 @@ function broadcastResult(_target: any, _propertyKey: string, descriptor: Propert
|
||||
const result = originalMethod.apply(this, args);
|
||||
const state = runtimeState.getState();
|
||||
|
||||
const batch = eventStore.createBatch();
|
||||
|
||||
// we do the comparison by explicitly for each property
|
||||
// to apply custom logic for different datasets
|
||||
|
||||
@@ -758,24 +760,24 @@ function broadcastResult(_target: any, _propertyKey: string, descriptor: Propert
|
||||
|
||||
//Now we set all the updates on the eventstore and update the previous value
|
||||
if (hasChangedPlayback) {
|
||||
eventStore.set('onAir', state.timer.playback !== Playback.Stop);
|
||||
batch.add('onAir', state.timer.playback !== Playback.Stop);
|
||||
}
|
||||
|
||||
if (shouldUpdateTimer) {
|
||||
eventStore.set('timer', state.timer);
|
||||
batch.add('timer', state.timer);
|
||||
RuntimeService.previousTimerUpdate = state.clock;
|
||||
RuntimeService.previousTimerValue = state.timer.current;
|
||||
RuntimeService.previousState.timer = { ...state.timer };
|
||||
}
|
||||
|
||||
if (shouldRuntimeUpdate) {
|
||||
eventStore.set('runtime', state.runtime);
|
||||
batch.add('runtime', state.runtime);
|
||||
RuntimeService.previousRuntimeUpdate = state.clock;
|
||||
RuntimeService.previousState.runtime = { ...state.runtime };
|
||||
}
|
||||
|
||||
if (shouldBlockUpdate) {
|
||||
eventStore.set('currentBlock', state.currentBlock);
|
||||
batch.add('currentBlock', state.currentBlock);
|
||||
RuntimeService.previousState.currentBlock = { ...state.currentBlock };
|
||||
}
|
||||
|
||||
@@ -785,7 +787,7 @@ function broadcastResult(_target: any, _propertyKey: string, descriptor: Propert
|
||||
|
||||
if (shouldUpdateClock) {
|
||||
RuntimeService.previousClockUpdate = state.clock;
|
||||
eventStore.set('clock', state.clock);
|
||||
batch.add('clock', state.clock);
|
||||
}
|
||||
|
||||
// Update the events if they have changed
|
||||
@@ -817,7 +819,7 @@ function broadcastResult(_target: any, _propertyKey: string, descriptor: Propert
|
||||
}
|
||||
|
||||
function storeKey(eventKey: RuntimeStateEventKeys) {
|
||||
eventStore.set(eventKey, state[eventKey]);
|
||||
batch.add(eventKey, state[eventKey]);
|
||||
// @ts-expect-error -- not sure how to type this in a sane way
|
||||
RuntimeService.previousState[eventKey] = { ...state[eventKey] };
|
||||
}
|
||||
@@ -836,6 +838,7 @@ function broadcastResult(_target: any, _propertyKey: string, descriptor: Propert
|
||||
});
|
||||
}
|
||||
|
||||
batch.send();
|
||||
return result;
|
||||
};
|
||||
|
||||
|
||||
@@ -1,18 +1,16 @@
|
||||
import { RuntimeStore } from 'ontime-types';
|
||||
|
||||
import { socket } from '../adapters/WebsocketAdapter.js';
|
||||
import { isEmptyObject } from '../utils/parserUtils.js';
|
||||
|
||||
export type PublishFn = <T extends keyof RuntimeStore>(key: T, value: RuntimeStore[T]) => void;
|
||||
export type StoreGetter = <T extends keyof RuntimeStore>(key: T) => Partial<RuntimeStore>[T];
|
||||
|
||||
let store: Partial<RuntimeStore> = {};
|
||||
|
||||
const changedKeys = new Set<keyof RuntimeStore>();
|
||||
let isUpdatePending: NodeJS.Immediate | null = null;
|
||||
/**
|
||||
* A runtime store that broadcasts its payload
|
||||
* - init: allows for adding an initial payload to the store
|
||||
* - batchSet: allows setting several keys with a single broadcast
|
||||
* - poll: utility to return state
|
||||
* - broadcast: send its payload as json object
|
||||
*/
|
||||
@@ -25,21 +23,20 @@ export const eventStore = {
|
||||
},
|
||||
set<T extends keyof RuntimeStore>(key: T, value: RuntimeStore[T]) {
|
||||
store[key] = value;
|
||||
|
||||
// check if the key is already marked for and update otherwise push it onto the update array
|
||||
changedKeys.add(key);
|
||||
|
||||
//if there is already and update pending we don't need to schedule another one
|
||||
if (!isUpdatePending) {
|
||||
isUpdatePending = setImmediate(() => {
|
||||
for (const dataKey of changedKeys) {
|
||||
socket.sendAsJson({ type: `ontime-${dataKey}`, payload: store[dataKey] });
|
||||
}
|
||||
socket.sendAsJson({ type: 'ontime-flush' });
|
||||
isUpdatePending = null;
|
||||
changedKeys.clear();
|
||||
});
|
||||
}
|
||||
socket.sendAsJson({ type: 'ontime-patch', payload: { [key]: value } });
|
||||
},
|
||||
createBatch() {
|
||||
const patch: Partial<RuntimeStore> = {};
|
||||
return {
|
||||
add<T extends keyof RuntimeStore>(key: T, value: RuntimeStore[T]) {
|
||||
patch[key] = value;
|
||||
},
|
||||
send() {
|
||||
if (isEmptyObject(patch)) return;
|
||||
store = { ...store, ...patch };
|
||||
socket.sendAsJson({ type: 'ontime-patch', payload: patch });
|
||||
},
|
||||
};
|
||||
},
|
||||
poll() {
|
||||
return store as RuntimeStore;
|
||||
|
||||
Reference in New Issue
Block a user