AJAX - HTTP/2 and Multiplexing Effects on AJAX

1. Why do we even need HTTP/2 for AJAX?

AJAX works by sending multiple asynchronous requests from the browser to the server (for data, images, comments, notifications, etc.).

In modern web apps:

• One page can trigger 10–50 AJAX calls

• Performance depends heavily on how fast these requests travel

This is where HTTP/2 makes a big difference.

2. How AJAX worked with HTTP/1.1 (Old Way)

Key limitations of HTTP/1.1:

• Each request often needs its own TCP connection

• Browsers limit connections (usually 6 per domain)

• Requests are handled one after another on a connection

Problem: Head-of-Line Blocking

If one request is slow:

• All following requests wait

• Page feels slow even if data is small

Example:

Request 1 → waiting
Request 2 → blocked
Request 3 → blocked

This directly affects AJAX-heavy applications.

3. What is HTTP/2? (Simple Definition)

HTTP/2 is a newer version of HTTP designed to:

• Reduce latency

• Improve performance

• Handle multiple requests efficiently

AJAX still works the same conceptually, but transport is much smarter.

4. What is Multiplexing in HTTP/2?

Multiplexing means:

Multiple requests and responses are sent simultaneously over a single connection, without blocking each other.

This is the most important feature for AJAX.

5. How AJAX Works with HTTP/2 (New Way)

Instead of:

• One request → one connection → wait

HTTP/2 allows:

• One TCP connection

• Many AJAX requests at the same time

• Responses can arrive out of order

Example:

Connection 1:
  ├── AJAX Request A
  ├── AJAX Request B
  ├── AJAX Request C

No waiting. No blocking.

6. Key Differences (Exam-Friendly Table)

7. Why Multiplexing Improves AJAX Performance

1. Faster Page Load

• AJAX calls do not wait for each other

• UI updates appear quicker

2. Better Use of Network

• No need for multiple TCP handshakes

• Less overhead

3. Real-Time Applications Improve

• Chats

• Dashboards

• Live notifications

All benefit directly from multiplexed AJAX calls.

8. Important Note for Students (Very Common Confusion)

❗ AJAX code does NOT change

fetch("/api/data");

Multiplexing happens:

• Automatically

• At the protocol level

• If the server supports HTTP/2

So:

• Developer writes same AJAX code

• Browser + server optimize delivery

9. Are There Any Downsides?

Yes, but minimal:

• If one TCP connection fails, all streams stop

• Solved mostly by modern network recovery

• Still much better than HTTP/1.1 for AJAX-heavy apps

10. One-Line Exam Definition

HTTP/2 multiplexing allows multiple AJAX requests and responses to be transmitted concurrently over a single TCP connection, eliminating request blocking and improving performance.

11. Real-World Example

Imagine a dashboard page making AJAX calls for:

• User profile

• Notifications

• Messages

• Analytics data

HTTP/1.1: Some data waits
HTTP/2: All data loads together smoothly

12. Why This Topic Is Important for Exams & Interviews

• Shows understanding of modern web performance

• Frequently asked in AJAX + networking questions

• Explains why newer sites feel faster