LF1 - simple 2D racing game

I used to frequently visit this forum around 2006 - 2008. At the time I was a student, and trying to make a game as a part of getting into programming. I’m happy to see this place is still alive, and looking from the posts there are still many people with the same kind of inspiration that I had when I joined.

For some indescribable reason I recently got the urge to make a game again. Since I haven’t done anything in this area for severa years, and I was originally trying to make a racing game, I thought I would retrace my steps by making a very simple 2D racing game.

So here’s the first version:

You can play against the AI or against other players. Although the graphics are outdated and the car physics are dubious, it does support both keyboard and touch controls, both local and internet multiplayer, and lap records.

You can find the game here: http://lf1.clrz.nl

And yes, that’s a web link. I did actually implement the game in Java, but I transpiled it to JavaScript using the excellent TeaVM. Compared to 12 years ago I assumed people are much less likely to download random executables off the internet, so this allows people to have a look without scary security implications.

Finally, some notes:

  • Controls are the arrow keys on desktop, plus WASD keys if you’re using local 2 player. If you’re using a touch device you should get the touch buttons automatically.
  • For some reason the web version flickers every now and then. That doesn’t happen to the desktop version (though obviously that uses a different renderer), need to figure out what’s causing it.
  • You decelerate quite slowly. That was kind of on purpose, because racing games where you never have to break aren’t that fun. But maybe I overdid it, and alternating between the accelerator and the brakes is a bit annoying when using the touch controls.

Hope someone enjoys this!

@Mr. Gol, very nice game, i just tried it and i think it’s very fun :slight_smile:
the only problem is when i press down key to brake, the entire screen turns gray for a short time :frowning:
i didn’t about teaVM, it’s really cool !
can you please confirm if it can directly convert java 2D, AWT libraries directly to javascript ?
thanks :slight_smile:

Yeah, decelerate is real challenge in this game ;D

It works fine in Chrome, but kinda slowed down in Firefox, at least for me ???

But it is cool that is works in browser, and there is even local and internet multiplayer.

Thanks! I also noticed the flickering, need to look into that.

TeaVM is extremely useful, but unfortunately it does not support AWT and Swing at this time. The problem is that the authors need to re-implement the entire Java standard library. Swing is well over 1000 classes, so this would be a huge effort. They did mention in an issue (https://github.com/konsoletyper/teavm/issues/406) that this is planned at some point in time, it’s just a lot of work.

So what I did is define a rendering layer that delegates to either Java2D when running on desktop, or to “native” JavaScript when running in the browser. You can actually see the JavaScript part here: http://lf1.clrz.nl/multimedialib.js
Since I’m using the HTML5 canvas for browser graphics the framerate isn’t great. It hits 60 fps in Chrome, but Firefox and Safari tend to be a bit slower, as already noticed by SugarBlood. Probably this would be better if I would use WebGL, but I need to check.

@Mr. Gol, it’s really good to know, thanks ! It’s really hard that a user will download and run the jar’s directly, so being able to make java written games available directly in the browser is really awesome :slight_smile:

I changed a couple of things:

  • Added some graphical effects (skidmarks, smoke, track marshals)
  • AI cars will now seek alternative lines to overtake
  • Improved graphics performance

Performance in Firefox is still significantly worse than Safari and Chrome. Those two easily make 60 fps, while Firefox barely makes 30-40. I did actually try WebGL, but that didn’t make a huge difference. The reason for that is partially because canvas drawing also uses hardware acceleration, and partially due to my incredibly outdated knowledge of OpenGL ES. I will see if I can find a modern tutorial and check if my approach still makes sense.