Exponential backoff with useRef

This commit is contained in:
projectmoon 2024-08-01 17:12:21 +02:00
parent 84821d289c
commit db7565b752

View File

@ -28,6 +28,8 @@ const useSocket = (
hasError: boolean
) => {
const [ws, setWs] = useState<WebSocket | null>(null);
const reconnectTimeout = useRef(0);
const reconnectAttempts = useRef(0);
useEffect(() => {
if (!ws) {
@ -182,6 +184,8 @@ const useSocket = (
ws.onopen = () => {
console.log('[DEBUG] open');
reconnectTimeout.current = 0;
reconnectAttempts.current = 0;
clearTimeout(timeoutId);
setError(false);
setIsWSReady(true);
@ -195,7 +199,7 @@ const useSocket = (
ws.onclose = () => {
clearTimeout(timeoutId);
if (!hasError) {
if (!hasError && reconnectAttempts.current < 3) {
setWs(null); // forces websocket to reopen when needed.
}
console.log('[DEBUG] closed');
@ -211,7 +215,15 @@ const useSocket = (
setWs(ws);
};
connectWs();
if (reconnectAttempts.current < 3) {
console.log(`[DEBUG] Attempting to reconnect (${reconnectAttempts.current + 1}/3)`);
setTimeout(connectWs, reconnectTimeout.current);
reconnectTimeout.current = reconnectTimeout.current > 0 ? reconnectTimeout.current * 2 : 1000;
reconnectAttempts.current += 1;
} else {
console.log('[DEBUG] WebSocket reconnect failure after 3 retries');
setError(true);
}
}
return () => {