CSSQuake

原文 ↗ Hacker News 讨论 ↗

渲染与实现

  • 游戏仅使用 CSS 和 HTML 进行渲染；所有核心游戏逻辑都用 JavaScript/TypeScript 编写。
  • DOM 元素和 CSS 3D 变换取代了传统的 canvas/WebGL 渲染。
  • 构建步骤会把 QuakeC/progs.dat 中的数据提取为 JSON（状态、模型、攻击、音效），供 TypeScript 运行时消费，用于“Quake‑ish”玩法。
  • 一些评论者提到 CSS 音频特性（aural style sheets），但这个演示中的声音是通过游戏内选项/键盘快捷键控制的，而不是纯 CSS。

与其他项目的关系与谱系

  • 有多人把它和类似的“CSS Doom”项目作比较；讨论串澄清它们是不同的项目。
  • 二者都被视为更早一系列实验性 CSS3D 引擎和 FPS 演示的一部分。

玩法、控制与 UX 问题

  • 报告了若干控制怪异之处：移动有橡皮筋效应、在拐角和斜坡上卡住、穿过物体，以及难以退出游戏。
  • 在窗口内点击时菜单可能会消失；变通方法是按 Tab 显示菜单、按 Esc 退出，或关闭标签页。
  • 有些按钮最初需要射击而不是触碰；这一行为后来已调整。
  • 深色模式扩展会让地图的某些部分几乎不可见。

性能与浏览器差异

  • 体验差异很大：有些人在较普通的硬件上也能看到流畅的 60 FPS，另一些人则报告严重卡顿或崩溃。
  • Safari/WebKit 常被报告为卡顿且有故障；在各种平台上的 Chrome 和 Firefox 通常更顺畅。
  • 许多人把这种不流畅的性能与原版 Quake 在弱得多的 1990 年代硬件上的表现作对比，强调把 CSS 当作渲染管线的代价。

对 CSS 作为媒介的反应

  • 人们对这一技术成就和“因为我们能”的精神表示强烈赞赏。
  • 有些人认为这很惊艳，但本质上是对声明式样式语言的低效滥用。
  • 还有人认为这只是利用了现有的 3D 变换能力和一个有趣的挑战，而不是一个严肃的引擎选择。

怀旧与文化注记

  • 很多人因几十年前玩过 Quake 而产生怀旧反应，至今仍凭肌肉记忆记得关卡和移动方式。
  • 讨论串还包括一些关于 CSS 的轻松玩笑（float、z-index、居中 div）以及“科学是不是走得太远了？”风格的评论。