jan-henrik/respira
1
0
Fork 0
mirror of https://github.com/jhbruhn/respira.git synced 2026-01-27 10:23:41 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feature: Replace setTimeout with requestAnimationFrame for UI polling

Browse source 
Co-authored-by: jhbruhn <1036566+jhbruhn@users.noreply.github.com>
This commit is contained in:
copilot-swe-agent[bot] 2025-12-28 08:40:46 +00:00
parent 46553ea0e9
commit 641bc04766
1 changed files with 39 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
src/stores/useMachineStore.ts
View file

@ -42,7 +42,7 @@ interface MachineState {
isDeleting: boolean; isDeleting: boolean;
// Polling control // Polling control
pollIntervalId: NodeJS.Timeout | null; pollRafId: number | null;
serviceCountIntervalId: NodeJS.Timeout | null; serviceCountIntervalId: NodeJS.Timeout | null;
// Actions // Actions
@ -81,7 +81,7 @@ export const useMachineStore = create<MachineState>((set, get) => ({
isPairingError: false, isPairingError: false,
isCommunicating: false, isCommunicating: false,
isDeleting: false, isDeleting: false,
pollIntervalId: null, pollRafId: null,
serviceCountIntervalId: null, serviceCountIntervalId: null,
// Connect to machine // Connect to machine
@ -370,8 +370,18 @@ export const useMachineStore = create<MachineState>((set, get) => ({
return 2000; // Default for idle states return 2000; // Default for idle states
}; };
// Main polling function // Track last poll time for throttling
const poll = async () => { let lastPollTime = 0;
// Main polling function using requestAnimationFrame
const poll = async (timestamp: number) => {
// Check if enough time has passed since last poll
const interval = getPollInterval();
const elapsed = timestamp - lastPollTime;
if (elapsed >= interval) {
lastPollTime = timestamp;
await refreshStatus(); await refreshStatus();
// Refresh progress during sewing // Refresh progress during sewing
@ -388,30 +398,29 @@ export const useMachineStore = create<MachineState>((set, get) => ({
) { ) {
await refreshPatternInfo(); await refreshPatternInfo();
} }
}
// Schedule next poll with updated interval // Schedule next poll using requestAnimationFrame
const newInterval = getPollInterval(); const pollRafId = requestAnimationFrame(poll);
const pollIntervalId = setTimeout(poll, newInterval); set({ pollRafId });
set({ pollIntervalId });
}; };
// Start polling // Start polling with requestAnimationFrame
const initialInterval = getPollInterval(); const pollRafId = requestAnimationFrame(poll);
const pollIntervalId = setTimeout(poll, initialInterval);
// Service count polling (every 10 seconds) // Service count polling (every 10 seconds)
const serviceCountIntervalId = setInterval(refreshServiceCount, 10000); const serviceCountIntervalId = setInterval(refreshServiceCount, 10000);
set({ pollIntervalId, serviceCountIntervalId }); set({ pollRafId, serviceCountIntervalId });
}, },
// Stop polling // Stop polling
_stopPolling: () => { _stopPolling: () => {
const { pollIntervalId, serviceCountIntervalId } = get(); const { pollRafId, serviceCountIntervalId } = get();
if (pollIntervalId) { if (pollRafId) {
clearTimeout(pollIntervalId); cancelAnimationFrame(pollRafId);
set({ pollIntervalId: null }); set({ pollRafId: null });
} }
if (serviceCountIntervalId) { if (serviceCountIntervalId) {