# WebSockets

WebSockets provide a persistent, full-duplex communication channel over a single TCP connection. Unlike HTTP, where the client must initiate every request, WebSockets allow the server to send data to the client at any time.

## 1. The Concept: Full-Duplex

*   **HTTP (Half-Duplex/Request-Response):** The client sends a request, the server sends a response, and the connection closes (stateless). To get new data, the client must ask again (polling).
*   **WebSocket (Full-Duplex):** The client and server establish a connection once. After that, both parties can send data back and forth freely until one side closes the connection.

## 2. The Handshake

A WebSocket connection starts as a standard HTTP request.

1.  **Client:** Sends an HTTP GET request to the server with an `Upgrade: websocket` header.
2.  **Server:** If it supports WebSockets, it responds with `101 Switching Protocols`.
3.  **Connection:** The HTTP connection is replaced by a WebSocket connection running over the same underlying TCP/IP connection.

## 3. Use Cases

WebSockets are ideal for **Real-Time Applications**:
*   Chat Applications (WhatsApp, Slack)
*   Live Sports Scores / Stock Tickers
*   Multiplayer Online Games
*   Collaborative Editing (Google Docs)

## 4. Implementation Example

### Client-Side (Browser)
Modern browsers have a built-in `WebSocket` API.

```javascript
// Create connection
const socket = new WebSocket('ws://localhost:8080');

// Connection opened
socket.addEventListener('open', (event) => {
    socket.send('Hello Server!');
});

// Listen for messages
socket.addEventListener('message', (event) => {
    console.log('Message from server:', event.data);
});
```

### Server-Side (Node.js with `ws` library)
While Node.js doesn't have built-in WebSockets, libraries like `ws` or `socket.io` are commonly used.

```javascript
import { WebSocketServer } from 'ws';

const wss = new WebSocketServer({ port: 8080 });

wss.on('connection', function connection(ws) {
  ws.on('message', function message(data) {
    console.log('received: %s', data);
  });

  ws.send('something');
});
```

[[programming/rest-apis]]
[[programming/asynchronous-programming]]