Controlling Async Flow: Concurrency and Rate Limiting Compared

When building robust JavaScript applications, you often need to control how asynchronous tasks execute. Running too many tasks at once can crash a browser or overload a server. Calling an API too fast can get your IP banned. The p-limit, p-throttle, and limiter packages solve these problems, but they work differently. Let's compare how they handle flow control.

🚀 Core Mechanism: Concurrency vs Time vs Tokens

p-limit focuses on concurrency. It ensures only a specific number of promises run at the same time. Once one finishes, the next in line starts.

import pLimit from 'p-limit';

const limit = pLimit(2); // Only 2 at once

const jobs = [
  limit(() => fetch('/api/1')),
  limit(() => fetch('/api/2')),
  limit(() => fetch('/api/3')) // Waits for slot
];

await Promise.all(jobs);

p-throttle focuses on time-based rate limiting. It ensures a function only runs a certain number of times within a time window.

import pThrottle from 'p-throttle';

const throttle = pThrottle({ limit: 2, interval: 1000 }); // 2 per second

const jobs = [
  throttle(() => fetch('/api/1')),
  throttle(() => fetch('/api/2')),
  throttle(() => fetch('/api/3')) // Waits for time window
];

await Promise.all(jobs);

limiter focuses on token buckets. It removes tokens from a bucket that refills over time. If no tokens are available, you wait or fail.

const { RateLimiter } = require('limiter');

const limiter = new RateLimiter({ tokensPerInterval: 2, interval: "second" });

limiter.removeTokens(1, (err, remaining) => {
  if (err) return;
  // Run task only if token removed
  fetch('/api/1');
});

🧩 API Ergonomics: Promise-Native vs Callbacks

Modern JavaScript relies heavily on Promises and async/await. How each package fits into this workflow matters for code clarity.

p-limit is built for Promises. It returns a Promise that resolves when the task completes. No wrapping needed.

// p-limit: Direct Promise support
const limit = pLimit(5);
const result = await limit(() => asyncTask());

p-throttle is also built for Promises. The throttled function returns a Promise directly.

// p-throttle: Direct Promise support
const throttle = pThrottle({ limit: 1, interval: 1000 });
const result = await throttle(() => asyncTask());

limiter is primarily callback-based. To use it with async/await, you must wrap it in a Promise yourself.

// limiter: Requires Promise wrapping
const limiter = new RateLimiter({ tokensPerInterval: 1, interval: "second" });

const waitForToken = () => new Promise((resolve) => {
  limiter.removeTokens(1, resolve);
});

await waitForToken();
await asyncTask();

⚙️ Configuration Complexity

Simple tasks need simple config. Complex systems need fine control. Here is how much setup each requires.

p-limit requires just one number: the concurrency limit. It is the simplest option.

// p-limit: Single integer config
const limit = pLimit(10);

p-throttle requires two numbers: the limit count and the time interval in milliseconds.

// p-throttle: Limit and interval config
const throttle = pThrottle({ limit: 10, interval: 1000 });

limiter allows complex config like token bucket size, refill rate, and even leaky bucket algorithms. It is more verbose.

// limiter: Token bucket config
const limiter = new RateLimiter({
  tokensPerInterval: 10,
  interval: "second",
  fireImmediately: false
});

🛑 Error Handling and Control

Sometimes you need to stop tasks or check status. Each package handles control differently.

p-limit tracks active and pending counts. You can check how many tasks are running.

// p-limit: Check active count
console.log(limit.activeCount); // Running now
console.log(limit.pendingCount); // Waiting

p-throttle allows you to enable or disable the throttle dynamically. Useful for pausing limits.

// p-throttle: Toggle control
throttle.disable(); // Run without limit
throttle.enable(); // Re-apply limit

limiter allows you to try removing tokens without waiting. If none are available, it returns false immediately.

// limiter: Try without waiting
const hasTokens = limiter.tryRemoveTokens(1);
if (hasTokens) {
  // Run task
}

🌐 Real-World Scenarios

Scenario 1: Image Gallery Upload

You have 100 images to upload. Uploading all at once freezes the browser.

• ✅ Best choice: p-limit
• Why? You want 5 uploads at a time, not a specific rate per second.

// p-limit: Concurrency control
const limit = pLimit(5);
const uploads = images.map(img => limit(() => upload(img)));
await Promise.all(uploads);

Scenario 2: Public API Consumer

You are calling a free API that allows 10 requests per second. You must not exceed this.

• ✅ Best choice: p-throttle
• Why? You need to enforce a time-based limit strictly.

// p-throttle: Rate control
const throttle = pThrottle({ limit: 10, interval: 1000 });
const requests = ids.map(id => throttle(() => api.get(id)));
await Promise.all(requests);

Scenario 3: Legacy Server Middleware

You are maintaining an older Node.js service using callbacks and need a leaky bucket algorithm.

• ✅ Best choice: limiter
• Why? It supports specific algorithms and fits callback-based middleware.

// limiter: Algorithm control
const limiter = new RateLimiter({ tokensPerInterval: 5, interval: "second" });
limiter.removeTokens(1, (err) => {
  if (!err) next(); // Proceed to handler
});

🤝 Similarities: Shared Ground

While they differ in mechanism, these packages share common goals and traits.

1. 🛡️ Protection Against Overload

• All three prevent your application from sending too many requests too fast.
• They protect both your client (browser memory) and server (API limits).

// All prevent this:
// while(true) { fetch('/api') } // ❌ Crashes or gets banned

2. 📦 Queue Management

• All three queue tasks that cannot run immediately.
• Tasks wait their turn instead of failing instantly (unless configured otherwise).

// All handle queuing internally:
// Task 1 runs -> Task 2 waits -> Task 3 waits

3. 🔧 Async Coordination

• All three help coordinate asynchronous operations.
• They make unpredictable async flow more deterministic and manageable.

// All turn chaotic calls into ordered flow:
// await controlledTask(); // Predictable timing

📊 Summary: Key Differences

💡 The Big Picture

p-limit is your go-to for parallelism. Use it when you have a lot of work but limited resources (like network connections). It keeps your app smooth without slowing down unnecessarily.

p-throttle is your go-to for compliance. Use it when external rules dictate how fast you can go (like API rate limits). It keeps you safe from bans and errors.

limiter is your go-to for control. Use it when you need specific algorithms or are working in older callback-based systems. It offers depth but requires more setup.

Final Thought: For modern frontend development, prefer p-limit and p-throttle. They fit naturally into async/await code. Reach for limiter only if you need its specific algorithmic features or are working in a non-Promise environment.