WebSockets & Realtime Systems Programming · Lesson

Polling, Long Polling, and SSE

Compare and contrast traditional methods like polling and long polling with Server-Sent Events for pushing data.

Polling, Long Polling, and SSE is a free WebSockets & Realtime Systems Programming lesson on CoddyKit — lesson 2 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the WebSockets & Realtime Systems Programming learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.

HTTP's Realtime Challenge

HTTP is stateless and unidirectional: the client asks, the server answers once. For live chat or tickers, constant asking or waiting is inefficient.

Introducing Polling

Polling is the simplest pseudo-realtime trick: the client asks the server for new data on a fixed interval, getting updates or an empty reply each time.

Polling Code Example

Here's a JavaScript client that polls a server every 2 seconds for updates — open your console to watch it fire.

<!DOCTYPE html>
<html>
<head>
  <title>Polling Example</title>
</head>
<body>
  <h1>Polling Status: <span id="status">Waiting...</span></h1>
  <script>
    function fetchData() {
      // In a real app, this would be a server endpoint
      fetch('https://jsonplaceholder.typicode.com/todos/1') 
        .then(response => response.json())
        .then(data => {
          const statusElement = document.getElementById('status');
          statusElement.innerText = `Update at ${new Date().toLocaleTimeString()}`; 
          console.log('Polled:', data.title);
        })
        .catch(error => console.error('Polling error:', error));
    }

    // Poll every 2 seconds (2000 milliseconds)
    setInterval(fetchData, 2000);
    fetchData(); // Initial fetch to start
  </script>
</body>
</html>

Polling's Inefficiency

Polling is wasteful: high latency between polls, many empty responses burning resources, and poor scaling when many clients poll often.

Enter Long Polling

Long polling is smarter: instead of replying empty, the server holds the request open until data is ready or it times out, then the client reconnects.

How Long Polling Works

The long polling cycle: client requests, server waits for data or timeout, server responds and closes, client immediately re-requests to restart.

Long Polling Client Logic

Here's the long polling client pattern: it processes each response, then immediately reopens the connection (retrying after a delay on error).

function longPoll() {
  console.log('Long polling for updates...');
  fetch('/api/longpoll') // Imagine this endpoint holds the request
    .then(response => response.json())
    .then(data => {
      if (data && data.message) {
        console.log('Received update:', data.message);
        // In a real app, update UI here
      } else {
        console.log('No new data, server likely timed out or sent empty.');
      }
      longPoll(); // Immediately send a new request
    })
    .catch(error => {
      console.error('Long polling error:', error);
      // Retry after a delay on error to prevent flooding
      setTimeout(longPoll, 3000); 
    });
}

longPoll(); // Start the long polling process

Long Polling's Pros & Cons

Long polling cuts latency and request count versus plain polling, but it still rides the request-response model — each update sets up and tears down a connection.

Server-Sent Events (SSE)

Server-Sent Events (SSE) give true server push over one long-lived HTTP connection. It's one-way (server to client) — perfect for feeds, tickers, notifications.

SSE Client Example

The native EventSource API makes subscribing to an SSE stream easy — the connection stays open until you close it or an error hits.

<!DOCTYPE html>
<html>
<head>
  <title>SSE Example</title>
</head>
<body>
  <h1>SSE Updates:</h1>
  <ul id="events"></ul>
  <script>
    // Imagine a server at /sse-stream sending events
    const eventSource = new EventSource('https://example.com/sse-stream'); // Replace with a real SSE endpoint

    eventSource.onopen = () => {
      console.log('SSE connection opened.');
      const listItem = document.createElement('li');
      listItem.textContent = `Connection opened at ${new Date().toLocaleTimeString()}`;
      document.getElementById('events').appendChild(listItem);
    };

    eventSource.onmessage = (event) => {
      const listItem = document.createElement('li');
      listItem.textContent = `New message: ${event.data}`;
      document.getElementById('events').appendChild(listItem);
      console.log('Received SSE message:', event.data);
    };

    eventSource.onerror = (error) => {
      console.error('SSE Error:', error);
      const listItem = document.createElement('li');
      listItem.textContent = `Error: ${error.message || 'Unknown'}`;
      document.getElementById('events').appendChild(listItem);
      eventSource.close(); // Close connection on error
    };

    // You can also listen for custom named events:
    // eventSource.addEventListener('myCustomEvent', (event) => {
    //   console.log('Custom event data:', event.data);
    // });
  </script>
</body>
</html>

Quick Check: Compare Methods

Which of the following statements about Polling, Long Polling, and Server-Sent Events (SSE) are true?

Recap: Unidirectional Push

Recap: polling repeatedly asks (simple but wasteful), long polling holds the request open, and SSE pushes one-way over a persistent connection.

Frequently asked questions

Is the “Polling, Long Polling, and SSE” lesson free?

Yes — the full text of “Polling, Long Polling, and SSE” is free to read here on the web, and the WebSockets & Realtime Systems Programming course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the WebSockets & Realtime Systems Programming course, upgrade to CoddyKit PRO.

What will I learn in “Polling, Long Polling, and SSE”?

Compare and contrast traditional methods like polling and long polling with Server-Sent Events for pushing data. You practise WebSockets & Realtime Systems Programming with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.

Do I need any experience to start WebSockets & Realtime Systems Programming?

No prior experience is required. WebSockets & Realtime Systems Programming on CoddyKit is structured for beginners through advanced learners; this is — lesson 2 of 4, so you can start here or from the beginning and move at your own pace.

How long does the “Polling, Long Polling, and SSE” lesson take?

Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.

Can I write and run code in this WebSockets & Realtime Systems Programming lesson?

Yes. Every WebSockets & Realtime Systems Programming lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.

All lessons in this course

← Back to WebSockets & Realtime Systems Programming