用 DeepSeek 从零搭一个贪吃蛇游戏：从单机到联机的完整过程

初始化变量：

const canvas = document.getElementById('gameCanvas');
const ctx = canvas.getContext('2d');
const gridSize = 20;
const tileCount = canvas.width / gridSize;
let snake = [{ x: 10, y: 10 }];
let food = { x: 5, y: 5 };
let direction = { x: 0, y: 0 };
let score = 0;

核心逻辑直接靠 API 生成，移动、碰撞、得分一次搞定。比自己手写快，但生成的东西不是马上能跑，得补键盘监听和渲染循环。

加点儿料：联机、难度、存档

多人联机

WebSocket 的思路：前端接收状态更新，后端广播玩家动作。代码不复杂，但真人同步其实很麻烦，这里只给了个骨架。

前端：

const ws = new WebSocket('ws://localhost:8080');
ws.onmessage = (event) => {
    const data = JSON.parse(event.data);
    // 更新游戏状态
};

后端：

const WebSocket = require('ws');
const wss = new WebSocket.Server({ port: 8080 });
wss.on('connection', (ws) => {
    ws.on('message', (message) => {
        // 处理玩家移动、食物生成等逻辑
        wss.clients.forEach((client) => {
            if (client !== ws && client.readyState === WebSocket.OPEN) {
                client.send(message); // 广播数据给其他玩家
            }
        });
    });
});

动态难度

固定速度玩一会儿就腻。做了个简单的档位：得分过 10、20、30 提速。公式粗暴但有效。

function updateSpeed(score) {
    const baseSpeed = 200;
    const levelThreshold = [10, 20, 30];
    const speedDecrease = 50;
    return baseSpeed - levelThreshold.filter(t => score >= t).length * speedDecrease;
}
setInterval(() => {
    const currentSpeed = updateSpeed(score);
    moveSnake();
}, currentSpeed);

setInterval 间隔动态变化其实有隐患，真要做稳当还是用 requestAnimationFrame 配合时间累积。

本地保存与回放

用 localStorage 存状态，再记录每次按键时间戳，回放时按时间差重放。这类功能看着炫，实则受限于浏览器时钟精度，长游戏会漂移。

录制：

const actions = [];
document.addEventListener('keydown', (event) => {
    actions.push({ key: event.key, timestamp: Date.now() });
});
function replayGame() {
    actions.forEach((action, index) => {
        setTimeout(() => handleKeyPress(action.key), action.timestamp - actions[0].timestamp);
    });
}

存档：

function saveGame() {
    const gameState = { snake, food, score };
    localStorage.setItem('snakeGameState', JSON.stringify(gameState));
}
function loadGame() {
    const saved = JSON.parse(localStorage.getItem('snakeGameState'));
    if (saved) { snake = saved.snake; food = saved.food; score = saved.score; }
}

跨平台

打包桌面应用用 Electron 最省事，窗口一开就完。移动端加了个 touchstart 判断滑动方向，没做多点触控，够玩。

// Electron 窗口创建
const { app, BrowserWindow } = require('electron');
let mainWindow;
app.on('ready', () => {
    mainWindow = new BrowserWindow({ width: 800, height: 600 });
    mainWindow.loadFile('index.html');
});

// 移动端触摸适配
canvas.addEventListener('touchstart', (event) => {
    const touch = event.touches[0];
    const x = touch.clientX;
    const y = touch.clientY;
    // 判断滑动方向并更新蛇的移动方向
});

收尾

这一轮下来，AI 最帮得上忙的地方在生成重复性代码和查漏，但游戏状态的微妙交互、渲染时机这些还是得自己把关。想靠几句话丢给模型就出产品，还早。不过作为快速原型工具，它已经足够顺手了。