Fix for timer throttling

[vishalnarkhede]

CLA

• I have signed the Stream CLA (required).
• Code changes are tested

Description of the changes, What, Why and How?

Latest chrome version came with some intensive timer throttling, which is causing issues with our websocket health check logic (ping-pong). SignalR from microsoft had the same issue as well. https://bugs.chromium.org/p/chromium/issues/detail?id=1186569

If you open codepen and keep in background tab, connection disconnects/reconnects quite frequently, because our “ping” in within setInterval (as shown in screenshot below)

Changelog

• Switching from setInterval to adding setTimeout from onmessage. So everytime you receive a health-check event on websocket, you schedule a next ping. This is basically to avoid chained timers, which get throttled by chrome - https://developer.chrome.com/blog/timer-throttling-in-chrome-88/#chained-timers
• While scheduling a next ping, also set a ticking time bomb (setTimeout) which will explode after pingInterval + 10000 ms and reconnect to websocket. This bomb should be defused (clearTimeout) everytime you receive health.check event.
• Updated ping interval from 30 seconds to 25 seconds, to give some more breathing room for health check logic. If backend doesn't receive health.check event from client within 35 seconds, it shuts it down. Checked with backend team about this, this won't affect any traffic overload for backend socket

Testing

If you would like to test this issue

• In your chrome browser, go to chrome://flags
• Search for "Throttle Javascript timers in background.", and set its value to "Enabled 10 seconds"
• Open react example chat app in chrome, and put the tab on background.
• If you are on master branch of js client, you will see bunch of reconnects to websocket in about 5 minutes.
• And if you switch to branch vishal/timer-throttling-fix on js client, you won't see any reconnects!!

[github-actions]

Size Change: -170 B (0%)

Total Size: 228 kB

Filename	Size	Change
dist/browser.es.js	49.6 kB	-49 B (0%)
dist/browser.full-bundle.min.js	28.5 kB	+26 B (0%)
dist/browser.js	50.2 kB	-47 B (0%)
dist/index.es.js	49.6 kB	-52 B (0%)
dist/index.js	50.2 kB	-48 B (0%)

_{compressed-size-action}