北京
你大概见过这个画面：Wi-Fi 突然掉线，Chrome 页面加载失败，屏幕上出现一只像素小恐龙。按下空格键，它就开始在一片沙漠里奔跑。 这个自2014年起藏在“No Internet”错误页背后的小游戏，每个月被玩大约2.7亿次。它在 Google 内部的代号是“Project Bolan”，致敬摇滚乐队 T. Rex 主唱 Marc Bolan。Chrome 基于开源项目 Chromium 构建，所以整个游戏的代码都是公开的。所有常量、设计决策、实现技巧，全都放在公开代码库里，任人阅读。 于是我去读了，而且读完了全部。这个看似简单的游戏，其实是一堂小型游戏设计课：它会在不知不觉中教会你操作；它不会用不公平的方式杀死你；它会让月亮呈现出七个不同相位；它还有一个拼写错误，跟着代码一起被送上了数以亿计的设备，一传就是十年。 如果你想边读这篇文章边玩这个游戏，不需要真的断网。网上有在线版小恐龙游戏，freeCodeCamp 也提供了一份在离线或在线环境启动它的指南。游戏的源码在 Chromium 代码树中，可以通过 source.chromium.org 浏览。从历史上看，整个游戏就是一个文件，大约3000行，不依赖任何框架，纯原生 JavaScript，绘制在一块普通的 canvas 上。没有游戏引擎，没有框架，甚至连 jQuery 都没有。 顺带一提，整个游戏的美术资源只有一张很小的 PNG。代码中引用的每一个精灵图，都靠坐标定位在这张图里。 为什么小恐龙游戏在所有设备上跑得一样快？ 这是每个游戏都要解决的第一个问题：浏览器不会以固定帧率重绘画面。一台 144Hz 的电竞显示器，每秒会触发 requestAnimationFrame 144 次；而一台性能吃力的旧笔记本可能只有 40 次。如果每帧移动固定像素，性能更好的设备上，游戏速度就会快出 3 倍。 小恐龙的解决方案是业界标准做法，而且实现得很干净。代码将速度定义为“在假设 60FPS 下，每帧移动多少像素”，再根据实际帧率进行缩放，从而保证游戏在不同设备上的体验基本一致。 这就是那只看起来不起眼的小恐龙背后的一部分秘密。它简单，却并不简陋；它藏在一个错误页面里，却拥有千万级玩家；它看起来像临时作品，却暗含了大量精心设计。下次断网时，不妨再看一眼那只恐龙。它不只是个彩蛋，更是一份写在错误页面里的游戏设计教材。
特别声明：以上内容(如有图片或视频亦包括在内)为自媒体平台“网易号”用户上传并发布，本平台仅提供信息存储服务。
Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.
