江苏龙网

  1. 首页 > 人文 > >

『小熊带你玩科技』KB代码实现3D赛车游戏？2kPlus Jam大赛了解一下，如何用2( 二 )


代码需要被压缩到2KB以内 。 如果你不想选用上一种方案 ， 还有一个类似的、但功能较弱的工具——RegPack ， 它可以在严格遵守规定的情况下编译JavaScript 。 无论哪种方式 ， 策略都是一样的 ， 尽可能使用重复的代码 ， 然后在压缩的时候压缩它们 。 例如 ， 某些字符串经常出现 ， 因此它们的压缩比很大 。 「c.width」、「c.height」和「Math」就是一些很好的例子 ， 但还有很多其它的小问题 。 因此 ， 在阅读这段代码时 ， 请记住 ， 你经常会看到一些重复代码 ， 这些重复是有目的的——便于压缩 。
CodePen
下面我们将给出一款在Codepen上运行的游戏 。 你可以在iframe上玩这个游戏 ， 但是为了获得最佳的游戏体验 ， 我建议你使用链接（https://codepen.io/KilledByAPixel/pen/poJdLwB）打开它 ， 这样你还可以编辑或是创建代码分支 。
HTML
我的游戏使用到html的部分很少 ， 因为它主要是基于JavaScript开发的 。 JavaScript创建全屏画布的方法和与后面将画布大小设置为窗口内部大小的代码都是最节省空间的 。 我不能确定为什么CodePen中需要将「overflow:hidden」添加到「body」标签中 ， 但是直接打开应该也可以正常工作 。
最终的压缩版本使用了更小的设置——把JavaScript包在一个「onload」事件的「call」方法里（） 。 但是 ， 我不喜欢在开发的时候用这种压缩的设置 ， 因为代码是以字符串形式存储的 ， 这样编译器也就无法正常地强调语法 。
常量
游戏中的很多东西都是由常量来控制的 。 当我们用类似GoogleClosure这样的工具来进行压缩时 ， 这些常量就会被替换成类似于C++中的「#define」的形式 。 将它们放在开头能够更快地调整游戏玩法 。
//drawsettingsconstcontext=c.getContext`2d`;//canvascontextconstdrawDistance=800;//howfaraheadtodrawconstcameraDepth=1;//FOVofcameraconstsegmentLength=100;//lengthofeachroadsegmentconstroadWidth=500;//howwideisroadconstcurbWidth=150;//withofwarningtrackconstdashLineWidth=9;//widthofthedashedlineconstmaxPlayerX=2e3;//limitplayeroffsetconstmountainCount=30;//howmanymountainsarethereconsttimeDelta=1/60;//inverseframerateconstPI=Math.PI;//shorthandforMath.PI
//playersettingsconstheight=150;//highofplayerabovegroundconstmaxSpeed=300;//limitmaxplayerspeedconstplayerAccel=1;//playerforwardaccelerationconstplayerBrake=-3;//playerbreakingaccelerationconstturnControl=.2;//playerturningrateconstjumpAccel=25;//zspeedaddedforjumpconstspringConstant=.01;//springplayerspitchconstcollisionSlow=.1;//slowdownfromcollisionsconstpitchLerp=.1;//ratecamerapitchchangesconstpitchSpringDamp=.9;//dampenthepitchspringconstelasticity=1.2;//bounceelasticityconstcentrifugal=.002;//howmuchturnspullplayerconstforwardDamp=.999;//dampenplayerzspeedconstlateralDamp=.7;//dampenplayerxspeedconstoffRoadDamp=.98;//moredampingwhenoffroadconstgravity=-1;//gravitytoapplyinyaxisconstcameraTurnScale=2;//howmuchtorotatecameraconstworldRotateScale=.00005;//howmuchtorotateworld//levelsettingsconstmaxTime=20;//timetostartconstcheckPointTime=10;//addtimeatcheckpointsconstcheckPointDistance=1e5;//howfarbetweencheckpointsconstmaxDifficultySegment=9e3;//howfaruntilmaxdifficultyconstroadEnd=1e4;//howfaruntilendofroad
鼠标控制
输入系统是非常简单的 ， 只用到了鼠标 。 使用下面这段代码 ， 我们可以跟踪鼠标点击和水平光标位置 ， 并将其表示为-1到1之间的值 。 双击是通过「mouseUpFrames」实现的 。 「mousePressed」变量只在玩家第一次点击开始游戏时使用一次 。


推荐阅读


上一篇：【暖特加低氮燃气锅炉】暖特加--燃气锅炉·领跑者

下一篇：「华为荣耀」狙杀荣耀X10！红米K30新版入网：1799元起性价比炸裂！