When developers think about keeping the UI in sync with server-side changes, the knee-jerk solution is often WebSockets.

And it makes sense — WebSockets offer a full-duplex connection, enabling real-time, bidirectional communication between client and server.

But here’s the catch:

Not every application needs that level of complexity.

In many cases, especially when the data flows in just one direction (Server ➝ Client) — like a dashboard that fetches new stats or a feed that updates periodically — setting up WebSockets can be:

  • Overkill
  • Harder to scale
  • Unnecessarily complex

That’s where simpler, more tailored techniques come into play — short polling, long polling, Server-Sent Events (SSE), and more.

These alternatives can be easier to implement, lightweight, and often more cost-effective when the use case doesn’t demand bi-directional messaging.


📚 Web Communication Series — Chapter 1: Short Polling

Welcome to the first chapter of the Web Communication series, where we explore communication techniques between the client and server. In this post, we’ll break down short polling, one of the simplest ways for a client to fetch updates from the server periodically.

We'll go through the concepts and implement a working example using Express and plain JavaScript.


🔧 Project Setup

Let’s dive into building a simple app that demonstrates short polling.

Directory Structure

web-comm-short-polling/
├── frontend/
│ ├── index.html
│ └── shortPollingScript.js
├── server.js

In this example, we have:

A client that polls the server every 5 seconds for updates.

A server that returns the latest data and allows it to be updated.

🖥️ Server-Side Logic

✅ Route to Get the Latest Data

app.get('/getData', (req, res) => {
  return res.json({ message: data });
});

This is the endpoint our client keeps polling every few seconds. It returns the current value of a variable (data).

✅ Route to Update the Data

app.post('/updateData', (req, res) => {
  data = req.body.userInput;
  return res.json({ update: true });
});

This lets us update the server-side value using a POST request. Once updated, future short polls will return the new value.

🧑‍💻 Client-Side Logic

Polling the Server Every 5 Seconds

setInterval(() => {
  getData().then(updateData);
}, 5000);

This line is the heart of short polling. It calls getData() every 5 seconds and updates the UI with the result.

Fetching the Data

const getData = async () => {
  const res = await fetch('/getData');
  const data = await res.json();
  return data.message;
};

Simple GET request to fetch the current value.

Submitting New Data

form.addEventListener('submit', async (e) => {
  e.preventDefault();
  const inputValue = inputElement.value;

  await fetch('/updateData', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({ userInput: inputValue }),
  });

  updateData(inputValue);
});

with this data updation, if we create two or more clients and update it from any one of the clients, it will be updated in all the clients.

🧪 Summary of Code Flow

  1. Client loads the page with some default data.
  2. Every 5 seconds, it polls the server for new data via /getData.
  3. If the user submits the form, it updates the server-side data.
  4. The next polling cycle will pick up the new data and reflect it in the UI.

✅ Pros and ❌ Cons of Short Polling

✅ Pros

  • Simple to implement – Works with any server that supports HTTP.
  • No need for persistent connections – Each request is independent.
  • Easier to debug – Plain HTTP requests are easier to inspect and test.
  • Works with most load balancers and proxies – No special configuration required.

❌ Cons

  • Increased server load – Frequent polling can create unnecessary traffic.
  • Latency in updates – Changes are only detected on the next poll (e.g., every 5 seconds).
  • Inefficient for real-time apps – Wastes resources when there's no new data.
  • Scalability concerns – Doesn't scale well with thousands of clients polling simultaneously.

🧠 When Should You Use Short Polling?

Short polling is a good fit when:

  • Updates are infrequent and not mission-critical.
  • You want a quick and easy solution without setting up complex infrastructure.
  • You’re building a proof-of-concept or MVP.
  • Your data update interval is predictable or doesn't need to be reflected in real-time.

🔚 Conclusion

Short polling offers a simple way to keep your frontend in sync with backend data. While it may not be the most efficient technique for real-time applications, it's perfect for low-frequency updates or when you need a quick and reliable solution without diving into more complex protocols.

In this chapter of the Web Communication Series, we covered how short polling works and built a working demo using Express and vanilla JavaScript.

You can find the complete source code for this example on GitHub:

🔗 Web Communication GitHub Repo

Stay tuned for the next chapter, where we’ll explore Long Polling and how it improves upon this approach!