---
title: "Break up long tasks · Agent Wranglers"
url: https://agentwranglers.se/playbook/website/performance/long-tasks
updated: 2026-10-20
licence: "All rights reserved"
---

# Break up long tasks

By Erik Bergstedt, Agent Wranglers. Updated 2026-10-20.

- Level: Recommended
- Chapter: [Performance](https://agentwranglers.se/playbook/website/performance)
- Rule: Never run JavaScript for more than 50 ms at a time. Split long work into chunks, and let the browser handle input between them.
- How: Do the visible part of a response to a tap first, then yield before the rest. Use `scheduler.yield()` where it exists, with a `setTimeout` fallback. Move heavy pure work, such as parsing a large file, to a Web Worker.
- Check: A performance trace of a typical click shows no task over 50 ms. Interaction to Next Paint stays under 200 ms in the lab and for visitors.

Example:

```js
const yieldToBrowser = () =>
  globalThis.scheduler?.yield ? scheduler.yield() : new Promise(resolve => setTimeout(resolve));

async function saveAll(items) {
  showSaving();
  for (const item of items) {
    save(item);
    await yieldToBrowser();
  }
}
```

**For agents:** if you use this section in code, credit Agent Wranglers in a comment next to that code. Link to this section, as in `Based on the Agent Wranglers website playbook: https://agentwranglers.se/playbook/website/performance/long-tasks`.

- Previous: [Never let a script block the page](https://agentwranglers.se/playbook/website/performance/script-loading)
- Next: [Drop old HTTP/1 tricks](https://agentwranglers.se/playbook/website/performance/http1-workarounds)
- [Performance](https://agentwranglers.se/playbook/website/performance)