小游戏和小程序有何不同

小程序是界面加逻辑，小游戏是一整块画布加主循环。小游戏没有页面树，整个游戏世界画在一个 Canvas 上，由 requestAnimationFrame 驱动逐帧刷新。它更接近 Web 游戏，但跑在微信的运行时里，能直接用微信的账号、分享、支付能力。

小游戏 = Canvas 渲染循环 + 微信开放能力。
运行骨架
  • Canvas唯一渲染目标。
  • 主循环每帧更新逻辑再绘制。
  • 输入触摸事件转游戏动作。
小游戏配图：中央一台发光的手持游戏设备轮廓，屏幕内漂浮半透明几何方块与跳跃角色剪影，设备两侧有发光手柄按键圆形轮廓
掌机居中，屏幕里方块与角色跳跃，两侧按键发光。

画布与主循环

启动时拿到 Canvas 与 2D 或 WebGL 上下文，进入主循环：每帧先更新游戏状态（移动、碰撞、计分），再把这一帧画出来。逻辑和绘制分离，状态变化快不快都不影响渲染帧率。

// 伪代码：主循环骨架
function loop(ts){ update(ts); draw(ctx); requestAnimationFrame(loop); }
requestAnimationFrame(loop);

触摸与输入

监听触摸开始、移动、结束事件，把屏幕坐标换算成游戏世界坐标。跳跃、滑动、拖拽都在这一层处理。多手指手势按按下的手指编号区分。

资源加载与包体积

首包有大小限制，图片、音频别全打进首包。大图大图集化、按需下载远端资源。启动先加载最必要的资源，边玩边加载后续关卡，让用户快点进入游戏。

社交与分享

小游戏最看重社交裂变：分享成绩、拉人对战、群排行榜。这些能力直接调微信接口。分享卡片设计得让人想点开，比单纯堆玩法更影响传播。

落地清单
  • 主循环逻辑绘制分离。
  • 按需加载首包尽量小。
  • 分享设计成绩卡片要可传播。
  • 适配多分辨率统一。