『小熊带你玩科技』KB代码实现3D赛车游戏？2kPlus Jam大赛了解一下，如何用2 选自frankforce作者：Frank机器之心编

选自frankforce
作者：Frank
机器之心编译
参与：王子嘉、GeekAI
控制复杂度一直是软件开发的核心问题之一，一代代的计算机从业者纷纷贡献着自己的智慧，试图降低程序的计算复杂度。然而，将一款3D赛车游戏的代码压缩到2KB以内，听起来是不是太夸张了？本文作者Frank是一名资深游戏开发者，在本文中，他详细介绍了如何灵活运用代码压缩、编译、随机数生成、代码复用、设计模式等十八般武艺仅仅通过2KB的代码就能实现一款强大的3D赛车游戏。
几个月前，当我听说传奇JS1K游戏编程竞赛将不再举办时，当即把这件事告诉了其他开发者，最后我们决定在itch上搞一个2KB版的编程竞赛以弥补这一遗憾，我们将其称之为「2kPlusJam」。这个竞赛的主要目标是制作一个只需要2KB压缩文件就可以容纳的游戏。如果你知道一个3.5英寸软盘可以存超过700个这样的游戏，你也就知道这有多小了。
我的作品（HueJumper）是对80年代赛车游戏渲染技术的致敬。这里的3D图像和物理引擎是我纯粹地使用JavaScript从零开始实现的，同时我还花了大量时间去调整游戏玩法和视觉效果。
游戏编程竞赛强调「变化」（shift），所以每当玩家通过关卡时，我就会改变整个世界的色调。我想在玩家通过关卡时，会感觉到像进入了一个色调不同的新的维度，这就是我为它取名为「HueJumper」的原因。
本文包含了这个游戏的完整JavaScript代码，所以可能会有点长。不过代码的注释很友好，所以我不打算一行一行解读，也不要求你现在就通读所有代码。我的目的是向你解释它的工作原理，还有为什么我要这样做，以及这个项目的整个结构。你也可以在CodePen上找到这份代码（https://codepen.io/KilledByAPixel/pen/poJdLwB），并进行现场调试。
那么，系好安全带，坐稳，我们要开始啦！
灵感来源

文章图片
我的灵感主要来源于80年代的经典赛车游戏，比如《OutRun》。使用相似的技术，他们能够在非常早期的硬件上实现实时三维图形。我最近也在玩一些现代的赛车游戏，比如《Distance》和《LonelyMountains:Downhill》，这些游戏也对我的视觉设计和游戏体验有所帮助。
JakeGordon用JavaScript写的一个伪3D赛车的项目（https://github.com/jakesgordon/javascript-racer/）帮我减轻了很多负担。他还为此写了一系列解释其工作原理的博文。尽管我的项目是从零开始的，但是他的代码助我解决了遇到的包括数学在内的一些问题。
我还看了ChrisGlover开发的一款名为「Moto1kross」的JS1k游戏（https://js1k.com/2019-x/demo/4006）。这款简单的1KB赛车游戏给了我一个参考，让我知道什么是可能实现的。现在我有额外的1KB可用空间，因此我得远远超过它。
总体策略
由于游戏大小有严格的限制，程序的架构就显得尤为重要。我的总体策略是让一切尽可能的简单，以实现创造一款视觉感受和游戏体验都很棒的游戏的最终目标。
为了压缩代码，我用GoogleClosureCompiler(https://closure-compiler.appspot.com/home)来运行它。这个编译器会删掉所有空白，把变量重命名为1个字母的字符，并且做了一些简单的优化。你可以通过下面的链接使用这个编译器：https://clocompiler.appspot.com/home 。
不过，这个编译器还做了一些无用的事，比如替换模板字符串、缺省参数和其它有助于节省空间的ES6特性。所以我需要手动撤销某些无用的工作，并预先准备一些更「冒险」的压缩技术，以节省每一个字节。但这并不是最主要的成功之处，大部分文件体积的压缩还是归功于代码本身的架构。