fix: Revert RAF implementation and restore original setTimeout polling

Co-authored-by: jhbruhn <1036566+jhbruhn@users.noreply.github.com>
This commit is contained in:
copilot-swe-agent[bot] 2025-12-28 09:53:21 +00:00
parent cca86ff53e
commit 59c02d6b4d

View file

@ -42,7 +42,7 @@ interface MachineState {
isDeleting: boolean; isDeleting: boolean;
// Polling control // Polling control
pollRafId: number | null; pollIntervalId: NodeJS.Timeout | 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,
pollRafId: null, pollIntervalId: null,
serviceCountIntervalId: null, serviceCountIntervalId: null,
// Connect to machine // Connect to machine
@ -370,30 +370,8 @@ export const useMachineStore = create<MachineState>((set, get) => ({
return 2000; // Default for idle states return 2000; // Default for idle states
}; };
// Track last poll time for throttling // Main polling function
// We use requestAnimationFrame for smooth UI updates but still need to const poll = async () => {
// respect polling intervals to avoid excessive API calls
let lastPollTime = 0;
// Main polling function using requestAnimationFrame
// Benefits over setTimeout:
// - Synchronized with browser refresh rate (typically 60fps)
// - Automatically paused when tab is not visible (better battery life)
// - Smoother animations and UI updates
// - More efficient rendering
const poll = async (timestamp: number) => {
// Initialize lastPollTime on first call
if (lastPollTime === 0) {
lastPollTime = timestamp;
}
// 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
@ -410,30 +388,30 @@ export const useMachineStore = create<MachineState>((set, get) => ({
) { ) {
await refreshPatternInfo(); await refreshPatternInfo();
} }
}
// Schedule next poll using requestAnimationFrame // Schedule next poll with updated interval
const pollRafId = requestAnimationFrame(poll); const newInterval = getPollInterval();
set({ pollRafId }); const pollIntervalId = setTimeout(poll, newInterval);
set({ pollIntervalId });
}; };
// Start polling with requestAnimationFrame // Start polling
const pollRafId = requestAnimationFrame(poll); const initialInterval = getPollInterval();
const pollIntervalId = setTimeout(poll, initialInterval);
// Service count polling (every 10 seconds) // Service count polling (every 10 seconds)
// Keep using setInterval for this as 10s is too long for RAF
const serviceCountIntervalId = setInterval(refreshServiceCount, 10000); const serviceCountIntervalId = setInterval(refreshServiceCount, 10000);
set({ pollRafId, serviceCountIntervalId }); set({ pollIntervalId, serviceCountIntervalId });
}, },
// Stop polling // Stop polling
_stopPolling: () => { _stopPolling: () => {
const { pollRafId, serviceCountIntervalId } = get(); const { pollIntervalId, serviceCountIntervalId } = get();
if (pollRafId) { if (pollIntervalId) {
cancelAnimationFrame(pollRafId); clearTimeout(pollIntervalId);
set({ pollRafId: null }); set({ pollIntervalId: null });
} }
if (serviceCountIntervalId) { if (serviceCountIntervalId) {