Example: AJAX Throttling

Limiting the number of simultaneous AJAX requests (or the number of any kind of global, shared resource) can be accomplished using the maxConcurrency task modifier.

In the example below, we render a component with 8 different concurrently running tasks that each, within an infinite loop, make (fake) AJAX requests. We've wrapped the code that actually performs the (fake) AJAX request in a task, and we've annotated that task with @task({ maxConcurrency: 3 }) to ensure that no more than 3 AJAX requests can be run at a time (so that we don't overload the browser).

Live Example

  • Task 6: making AJAX request
  • Task 5: making AJAX request
  • Task 4: making AJAX request
  • Task 3: making AJAX request
  • Task 2: making AJAX request
  • Task 1: making AJAX request
  • Task 0: making AJAX request