Optimize viewer performance for complex toolpaths#5
Merged
Conversation
- Cache processGCode results to avoid redundant parsing (was called 3-4x for the same G-code: visualizer, outline calc, auto-place, place-model) - Fix outline recalculation firing on every machinePosition update - it was re-parsing the entire G-code and computing concave hull on every toolhead move despite machinePosition not being needed for hull calc - Make color updates incremental: only paint newly processed lines red instead of resetting ALL vertex colors and repainting from scratch - Switch Canvas to frameloop="demand" so the scene only re-renders when something actually changes instead of running at 60fps continuously https://claude.ai/code/session_01Y2PzWVYwZn4BTd37TWvEVB
bwees
force-pushed
the
claude/optimize-viewer-performance-0C6h2
branch
from
1d6d7bc to
5c48d05
Compare
Show a spinner overlay with "Processing toolpath..." when loading complex G-code files. Moves processGCode from synchronous useMemo to a deferred useEffect (setTimeout(0)) so React can paint the loading state before the heavy parsing work blocks the main thread. https://claude.ai/code/session_01Y2PzWVYwZn4BTd37TWvEVB
The previous approach managed loading state inside the R3F Canvas reconciler via a callback, but the outer DOM overlay never got a chance to paint before the heavy work blocked the main thread. Fix: manage the deferred gcode flow entirely in the outer DOM component (VisualizerScene). When new gcode arrives: 1. Set isProcessing=true and clear the deferred gcode immediately 2. Wait for double requestAnimationFrame (guarantees browser paint) 3. Only then pass the gcode to GCodeToolpath inside the Canvas This ensures the spinner overlay is visible before processGCode blocks the thread. GCodeToolpath reverts to synchronous useMemo since the deferral now happens at the parent level. https://claude.ai/code/session_01Y2PzWVYwZn4BTd37TWvEVB
…Panel The loading indicator was not visible because the heavy work (processGCode + concaveman hull calculation) ran synchronously in VisualizerPanel's event handlers and effects BEFORE VisualizerScene ever received the gcode. Fixes: - Remove duplicate calculateOutline calls from the WebSocket handler and API restore effect (they were redundant with the loadedGcode effect) - Defer the outline calculation effect with double requestAnimationFrame so the browser can paint the loading overlay before heavy work runs - Add isProcessingGcode state at VisualizerPanel level and pass it as isLoading prop to VisualizerScene - VisualizerScene shows the spinner when either external isLoading or its own internal deferred gcode processing is active https://claude.ai/code/session_01Y2PzWVYwZn4BTd37TWvEVB
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
https://claude.ai/code/session_01Y2PzWVYwZn4BTd37TWvEVB