How to throttle websocket event processing

[Reza Razavipour]

I have an angular 6 app that communicates through a websocket, more precisely sockjs, with the server.

I start a task with the server, REST call, and I get a very large number of messages on the websocket.

The way my code is working is horrible. It essentially locks the screen as long as there are websocket messages are coming.

My current code is component

this.scenarioRunnerService.liveUpdate$

.subscribe(response => {

this.processLiveUpdates(response.payload);

})

service code is 

StompClientKeeper.getInstance().get()

.subscribe('/topic/abcd',

(response: Response) => broadcast the new message);

How can I change this not to freeze the client?

[Zlatko Đurić]

Well, there's missing information here. Like, _where_ exactly is your browser spending its time - did you try profiling? You say "a very large number of messages", but not how large. Maybe the sheer numbers here are the blocker, or the sockjs client chockes on it. It could be that your code is synchronous, never letting anything else do the work. You could, in theory, offload your proccessing to a webworker - but I suspect the serialization/deserialization will lock up your client even more.

Can you allow your client to skip some messages or you need them all? Can you throttle this flow on the server side, implement a super simple paging mechanism (server sends X messages, waits for a client to confirm/ask for the next X)? Maybe use a different encoding, like protobuf - JSON parsing can take a lot of time when you have a lot of messages. Or maybe on the client itself - are you sure you must do all the work that you do? Maybe you can simply just dump every incoming message to localStorage or db, then kick off a worker/queue that can process them on pull-basis.