Skip to content

Replace setTimeout(0) with Svelte's tick() for batching store updates#122

Merged
argyleink merged 6 commits intomainfrom
copilot/optimize-svelte-performance
Jan 29, 2026
Merged

Replace setTimeout(0) with Svelte's tick() for batching store updates#122
argyleink merged 6 commits intomainfrom
copilot/optimize-svelte-performance

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Jan 29, 2026

setTimeout(0) was used to batch rapid store updates, which is code smell in Svelte apps. Replaced with Svelte's idiomatic tick() function.

Changes

  • src/store/layers.ts: Timer-based batching → tick()-based async batching. All synchronous store subscriptions queue mutators before tick() resolves, then flush applies them in one batch.
  • src/components/GradientStops.svelte: setTimeout(0)await tick(). Removed timer cleanup code (unnecessary with promises).

Why tick()

  • Microtask queue (faster than macrotask)
  • No manual cleanup on unmount
  • Already used in LayersPanel.svelte for similar deferred work

Example

// Before
batchUpdateTimer = setTimeout(() => {
  // flush updates
}, 0)

// After  
async function flushPendingUpdates() {
  await tick()
  // All synchronous mutations collected, now flush
}

App screenshot


💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

@netlify
Copy link
Copy Markdown

netlify Bot commented Jan 29, 2026

Deploy Preview for hd-gradients ready!

Name Link
🔨 Latest commit 2d28c85
🔍 Latest deploy log https://app.netlify.com/projects/hd-gradients/deploys/697b01e236b71f000826e165
😎 Deploy Preview https://deploy-preview-122--hd-gradients.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Copilot AI and others added 3 commits January 29, 2026 06:27
Co-authored-by: argyleink <1134620+argyleink@users.noreply.github.com>
Co-authored-by: argyleink <1134620+argyleink@users.noreply.github.com>
Co-authored-by: argyleink <1134620+argyleink@users.noreply.github.com>
Copilot AI changed the title [WIP] Review and optimize data flows for improved UI responsiveness Optimize Svelte data flows to reduce slider input lag Jan 29, 2026
Copilot AI requested a review from argyleink January 29, 2026 06:37
Copilot AI and others added 2 commits January 29, 2026 06:41
Co-authored-by: argyleink <1134620+argyleink@users.noreply.github.com>
…order

Co-authored-by: argyleink <1134620+argyleink@users.noreply.github.com>
Copilot AI changed the title Optimize Svelte data flows to reduce slider input lag Replace setTimeout(0) with Svelte's tick() for batching store updates Jan 29, 2026
@argyleink argyleink marked this pull request as ready for review January 29, 2026 06:49
@argyleink argyleink merged commit e55647e into main Jan 29, 2026
5 checks passed
@argyleink argyleink deleted the copilot/optimize-svelte-performance branch January 29, 2026 06:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants