一个中年开发者的网页 Tetris：零营销、半年 2000+ 月活，技术实现、迭代与玩家反馈。

大家好，我是 Jesse，OnlineTetris 的开发者，我使用原生 JS + HTML5 Canvas 做了个网页版俄罗斯方块，4 月底上线初版后没怎么管，一个月后发现每天都有二十来个陌生玩家在玩，还给我提 bug。于是一路修一路做，现在每月有 2000+ 活跃用户，分布在上百个城市。这里分享一下动机、技术细节、特色功能、零营销的经历、数据和一些小心得。

1. 想法：我为什么要做俄罗斯方块游戏

今年 4 月份的某天突然想起小时候握着掌机打俄罗斯方块的感觉：规则简单、反馈直接、失败也能立刻再来一把。我想做个能随时打开就玩的网页版本，算是对那段时光的致敬。
4 月底我把初版上线了。当时没准备推广，也没想花精力运营，纯粹“做完放那儿”。

一个月后偶然看数据，每天大概有 20 个玩家在玩。更意外的是，有人主动通过站内评论向我提出很多建议，包括游戏玩法和 UI样式等。那一刻我意识到，这游戏真有人喜欢。于是我开始按反馈修改 Bug 和迭代新功能。

2. 技术细节：我怎么把它开发出来的

• 前端栈：HTML5 + 原* + Tailwind CSS。尽量保持简单，方便我一个人维护。

• 渲染：Canvas + requestAnimationFrame。一开始我犯的错比较典型：

  • 刷新频率和逻辑耦合太紧，导致GPU 占用偏高、动画掉帧；
  • 局部重绘做得不够克制，很多无关区域也被重画；
  • 浏览器差异、设备差异（尤其是集显）让极限情况更明显。

• 我做的改动：

  • 把“逻辑层”和“渲染层”拆开，减少无意义帧；
  • 尽可能做最小脏矩形重绘；
  • 动画走独立的轻量通道，降低相互干扰；
  • 针对集显做了一些特效降级（例如部分主题动画降低频率）。

• 后端：

  • 用 Supabase 做数据库。
  • 每局游戏结束后，记录都会存储到数据表，并且实时更新到排行榜中。
  • 把排行榜相关的统计放在 SQL 视图里，避免在前端堆太多聚合逻辑；

3. 特色功能：

① 全球排行榜（个人榜）

• 按玩家个人最高分进行全球排名，让玩家感到有参与感和成就感。
• 提交逻辑会做一些基本校验，尽量减少异常数据。

② 全球排行榜（地区榜）

• 我们将每个地区玩家的得分进行汇总，得到该地区的累计总分，并据此与全球其他地区进行对比排名。
• 还在逐步完善地图上的“气泡标记”交互（缩放、悬停查看详情）。

③ 皮肤系统

• 这是纯“快乐工程”：木质、霓虹、复古、像素风……
• 现实的教训是：好看≠高配。有些主题动画对集显不太友好，于是我加了开关和降级策略。

4“营销”：其实我没做营销

• 我不是做市场出身，也没预算。
• 上线初期没有投广告，没有发媒体稿。
• 我只把链接丢给几个朋友试试，后面基本就是自然传播。
• 说实话，这也逼着我把时间都花在体验本身。

5 六个月后的数据（概况）

• 上线到现在大约半年。
• 月活：稳定在 2000+。
• 地域：来自全球上百个城市。
• 感受：规模不大，但是真实。有人会反复回来玩。

6 一些经验：都是被玩家教出来的

• 把玩家当朋友。他们的每条反馈都在帮你做产品评审。有人说动画卡，我就去录性能火焰图；有人说锁定手感差，我就重做“触底延迟”的逻辑。
• 体验优先，哪怕是很小的点。比如“方块触底后是否给一小段可移动时间”，这会极大影响手感。
• 面向真实设备优化。集显用户很多，不要只在高配机器上做“自我感动”的效果。

7 更新 & 接下来

• 近期在做：

  • 进一步降低某些主题下的 GPU 压力；
  • 地区排行榜的地图交互打磨；

• 计划中：

  • 更完整的“城市锦标赛”玩法；
  • 成就/称号与适度激励；

最后

这个项目从“怀旧”开始，靠“玩家反馈”活下来，又靠“持续把小事做好”慢慢滚动起来。
如果你也在做网页小游戏，欢迎交流性能和手感的话题；如果你只是路过玩家，也欢迎随便玩一把，吐槽更好。

站点：onlinetetris.org （随手玩两局即可。我会继续听反馈、慢慢把它打磨好。）