背景与痛点

在构建实时应用时，JavaScript开发者常面临网络通信协议的选择难题。传统HTTP协议的请求-响应模式无法满足聊天应用、实时游戏等场景的低延迟需求。直接使用TCP虽然灵活，但需要自行处理粘包、心跳等复杂逻辑；而WebSocket作为应用层协议，虽简化了开发却可能隐藏性能陷阱。

技术选型对比

TCP协议特点

• 优点：传输层协议、完全控制数据格式、适合高吞吐场景
• 缺点：需手动处理连接状态、存在粘包问题、无内置心跳机制

WebSocket特点

• 优点：全双工通信、内置心跳帧、自动处理连接状态
• 缺点：每个连接占用较多内存、协议头开销较大

核心实现

Node.js TCP服务器示例

const net = require('net');
// 创建TCP服务器
const server = net.createServer((socket) => {
  // 解决粘包问题：使用长度前缀协议
  let buffer = Buffer.alloc(0);

  socket.on('data', (chunk) => {
    buffer = Buffer.concat([buffer, chunk]);
    while(buffer.length >= 4) {
      const length = buffer.readUInt32BE(0);
      if(buffer.length >= 4 + length) {
        const message = buffer.slice(4, 4 + length);
        console.log('Received:', message.toString());
        buffer = buffer.slice(4 + length);
      } else break;
    }
  });

  // 心跳检测
  const heartbeat = setInterval(() => {
    if(socket.destroyed) clearInterval(heartbeat);
    else socket.write(Buffer.from([0x01])); // 心跳包
  }, 30000);
});

server.listen(3000);

WebSocket服务实现（使用ws库）

const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });

wss.on('connection', (ws) => {
  // 内置消息分帧处理
  ws.on('message', (message) => {
    console.log('Received:', message);
    ws.send(`Echo: ${message}`);
  });

  // 错误处理
  ws.on('error', (err) => {
    console.error('WebSocket error:', err);
  });
});

性能考量

1. 延迟测试：WebSocket建立连接后平均延迟比TCP低15-20ms（相同网络条件）
2. 吞吐量：TCP裸协议在10万QPS下CPU占用比WebSocket低30%
3. 内存占用：单个WebSocket连接需要约10KB内存，TCP连接约6KB

生产环境建议

• 连接管理：
• 实现连接池复用TCP套接字

• 为WebSocket设置合理的maxPayload（默认16MB风险高）

• 错误处理：

• TCP需监听ECONNRESET等系统错误

• WebSocket应处理1006异常关闭代码

• 安全措施：

• 两种协议都应启用TLS加密
• WebSocket建议添加origin白名单验证

实战思考题

假设需要开发一个股票行情系统，要求： - 每秒推送5000+条数据更新 - 客户端可能突然断开后重连 - 需要支持历史数据补发

你会选择TCP还是WebSocket？如何设计消息协议和重连机制？（提示：考虑结合两种协议优势）

我的选择：使用WebSocket作为主要通道，但在断线重连时通过HTTP接口补发批量历史数据。消息协议采用二进制格式，前4字节为时间戳，后接protobuf编码的业务数据。这样既保证实时性，又解决断线重传问题。