🧵 多线程与性能优化类
-
Web Worker + OffscreenCanvas 物理模拟
请使用原生 JavaScript 开发一款基于 Web Worker 与 OffscreenCanvas 的高性能粒子弹幕游戏。核心要求：主线程仅负责 UI 渲染与输入分发，所有物理计算、碰撞检测与粒子生命周期管理移至 Worker 线程。通过 Structured Clone 与 MessageChannel 实现零拷贝数据通信，使用 OffscreenCanvas.transferToImageBitmap() 避免主线程阻塞。实现对象池管理粒子实例，60FPS 稳定运行。单 HTML 文件整合，注释标明线程通信协议、数据流向与内存释放策略。仅输出完整代码。 -
Web Audio API + AudioWorklet 低延迟合成
请基于 AudioWorklet 规范开发一款低延迟程序化音频节奏游戏。核心要求：音频逻辑完全运行在 AudioWorkletProcessor 中，实现自定义振荡器、包络发生器与效果器链（延迟/混响）。主线程通过 MessagePort 同步节拍参数，确保音频调度精度 <1ms。画面使用 Canvas 绘制实时波形与节拍判定区。输入支持触控与键盘，移动端优化 Touch Latency。单文件整合，包含 Worklet 代码内联与 AudioContext 初始化，注释详述音频线程隔离与主从同步机制。仅输出完整代码。
🏗️ 状态管理与现代框架类
-
React 18 + Zustand 状态驱动战棋
请基于 React 18 (CDN) 与 Zustand 开发一款状态驱动的六角战棋游戏。核心要求：游戏逻辑与 UI 彻底解耦，Zustand store 管理棋盘网格、单位属性、行动点与回合状态。使用 useShallow 优化重渲染，Canvas 仅负责渲染，UI 层通过 React Portal 悬浮显示技能面板与日志。实现撤销栈、路径高亮预览与 AI 简易 Minimax。单 HTML 文件整合，遵循 React Concurrent 特性，注释标明状态流、副作用处理与渲染批优化策略。仅输出完整代码。 -
Svelte 5 Runes + 响应式物理平台
请使用 Svelte 5 (CDN) 的 Runes 语法开发一款响应式物理跳跃平台游戏。核心要求：利用derived、effect 清理时机与防抖优化。仅输出完整代码。`
🌐 网络与离线架构类
-
WebRTC DataChannel P2P 本地对战
请使用原生 JavaScript 开发一款基于 WebRTC 数据通道的本地 P2P 对战游戏（简化版乒乓）。核心要求：不依赖信令服务器，通过手动复制粘贴 SDP/ICE 候选完成握手。实现基于 UDP 特性的状态快照同步、延迟补偿与插值预测。处理断线重连、NAT 穿透降级逻辑。画面使用 Canvas，支持双端键盘控制。单 HTML 文件整合，注释标明 ICE 状态机、数据包序列化、时钟同步与回退策略。仅输出完整代码。 -
Service Worker + Cache API PWA 架构
请基于 Service Worker 开发一款可安装为 PWA 的离线街机游戏。核心要求：内联 Manifest 与 SW 注册逻辑，采用 Stale-While-Revalidate 缓存策略预加载核心资源。实现离线游玩、后台分数同步、网络恢复提示与版本热更新检测。游戏核心为轻量躲避弹幕，画面 Canvas 绘制。单 HTML 文件整合，严格遵循 PWA 最佳实践，注释标明缓存生命周期、Fetch 拦截路由与 Manifest 内联方案。仅输出完整代码。
🎨 图形渲染新标准类
-
WebGPU Compute Shader 加速群集模拟
请基于 WebGPU API 开发一款 GPU 计算加速的群集行为模拟游戏（Boids 算法）。核心要求：核心 flocking 逻辑（分离/对齐/凝聚）完全在 WGSL Compute Shader 中执行，通过 Storage Buffer 传递实体数据。实现 Bind Group 布局、Compute Pipeline 调度与 CPU 回读渲染。画面使用 Canvas 2D 绘制聚合轨迹，提供 CPU/JS 对比性能面板。单 HTML 文件整合，包含 WGSL 源码内联、设备请求与 fallback 降级逻辑，注释详述 GPU 内存模型与计算管线。仅输出完整代码。 -
CSS Houdini Paint API 动态程序化背景
请使用 CSS Houdini Paint Worklet 开发一款背景交互驱动的程序化迷宫游戏。核心要求：通过 CSS.registerPaint() 注册自定义绘制器，利用 CSS Custom Properties 接收游戏状态（玩家坐标、危险区域、时间戳）。Worklet 内部使用 Canvas 2D 上下文生成动态噪波地形与光效，主循环仅修改 CSS 变量触发重绘。画面分层：Houdini 背景 + Canvas 前景游戏层。单 HTML 文件整合，注释标明 Paint 生命周期、属性依赖追踪与性能节流策略。仅输出完整代码。
💾 持久化与数据工程类
-
IndexedDB + LZ-String 压缩存档系统
请基于 IndexedDB 与 LZ-String 开发一款支持大容量压缩存档的 Roguelike 游戏。核心要求：实现异步事务封装、Schema 版本迁移、存档序列化/反序列化流水线。支持增量保存、多槽位管理、损坏数据校验与回滚恢复。游戏核心为随机房间探索与背包管理，Canvas 绘制。单 HTML 文件整合，注释标明 DB 游标遍历、压缩率对比、异步竞态处理与 UI 反馈机制。仅输出完整代码。 -
WebSocket 本地 Mock + 状态同步引擎
请使用原生 JavaScript 实现一套带网络条件模拟的 WebSocket 同步引擎，并封装为简易 IO 竞技场游戏。核心要求：在客户端模拟 Server 逻辑，提供延迟/丢包/抖动开关。实现 Tick-based 同步、客户端预测、服务器权威校验与状态插值。画面使用 Canvas 绘制多实体移动轨迹与延迟指标。单 HTML 文件整合，注释标明网络模型、时间戳对齐、包丢失补偿与性能监控面板。仅输出完整代码。
