Jump to content

Celebrating 2.5 - Babylon.js challenge is back!


Recommended Posts

Hey guys,

I think it has been almost a year since the last challenge. The Babylon challenge is back!

For the new guys - I used to post a monthly challenge focused on a specific topic every time. The winner would get amazing prizes such as respect from the community, free access to the documentation website, or the secret cheat codes for the sponza demo. And also beer, if you are ever in Berlin!

There is a single change to the rules - the challenge will span 2 months and a half instead of one.

Other than that, the regular rules apply:

  • Code must be original! Don't copy and paste someone else's code.
  • You can use external resources.
  • The game must be playable. No static animations when pressing a mouse key.
  • As we are celebrating 2.5, Babylon.js 2.5 must be used.
  • Extra points for open-sourcing your code!

The 2.5 challenge:

Very influenced from the (amazing!!) new demos that were created in the ISART School (http://cdn.babylonjs.com/wwwbabylonjs/Scenes/prosecution/index.html for example, @Temechon can explain everything much better than me), we will create games!

Multiplayer games.

Simple multiplayer games!

The game's theme doesn't matter. It also doesn't matter if it is roles-based or real-time. Also, no one expects you to be master of websockets. 

You can work alone, or in teams. You can take an existing game and make it multi-player. Do whatever you want!

If you need deployment tips, help with development, financial aid, french lessons, dev-env suggestions, please don't hesitate to contact me! (I don't speak french, but I know a few others that do :)

You guys have time until the 28th of February! Which is a long time. 


The winner(s) will get a Babylon.js t-shirt! And honor and glory. 

For the rest of the participants - I will need to see what's possible.  Oh, and since this is self-financed, please be considerate to the amount of people in a team :) 


I hope to see a lot of activity! I will do my best to actually participate in this challenge (I have participated in all challenges until now), but it will be great if we will have at least 4 submissions!

Party on!



Examples of previous challenges:





Link to comment
Share on other sites

@jerome, this is an interesting point. 

Any multiplayer game, even a classic dual screen with two players on the same keyboard will be accepted.

Having said that , @endel has a wonderful solution for the multiplayer server, and it can all be deployed to heroku for free (the basic level is free) which will be more than enough for the demo. I think he'll write about it soon.

Link to comment
Share on other sites

Hey guys, I've created a template project using BabylonJS + Colyseus, and made it available here: https://github.com/endel/babylonjs-multiplayer-boilerplate

There's a button to deploy your own in the README. Here's the live demo: https://babylonjs-multiplayer.herokuapp.com/

It's basically a simple BabylonJS example from the website, connecting to a Room on Colyseus. If you open the developer tools you'll see a new log appearing for each user visiting the page. 

Feel free to ask if you have any question and good luck with your games :D


Link to comment
Share on other sites

@endel   l'm not sure if I should post here or the Github issues queue, but I'm having a little trouble getting started with your babylonjs-multiplayer-boilerplate, probably because of my unfamiliarity with some of these technologies (haven't worked much with node before).

I'm running the latest node (6.9.2) and npm (4.0.3) on my local Windows 7 machine. After running npm install and start in both client and server folders, then visiting http://localhost:8080/ I get the following js console error:

Uncaught DOMException: Failed to construct 'WebSocket': The URL 'ws:://localhost:2657' is invalid.

Yet the server reports it's "Listening on 2657".

What am I doing wrong? Thanks in advance.


On killing the cmd windows I noticed npm-debug.log file in each of server and client folders.

For the server the relevant error lines are:

23 error     onchange 'src/**.ts' -i -d 1000 -- ts-node src/index.ts

And for the client it's:

23 error     webpack-dev-server --host


Link to comment
Share on other sites

Hi @inteja. Oops, that was my mistake. The fix is quite simple, though. I've updated the project already. You can pull with git or update your local version manually.

I couldn't test it on Windows, but it should work fine. Please feel free to open issues on GitHub if something goes wrong, I'd be happy to support you.


Link to comment
Share on other sites

@endel your boilerplate is pretty cool :D

I don't have much experience with node and related, so at the moment it all seems like magic. I don't yet understand where the ts is getting compiled to and code changes are reflected in the browser automatically. I'm more familiar with using Webstorm watchers for ts and scss compilation into the same project folder. I guess I have a lot to learn about the node ecosystem.

Link to comment
Share on other sites

realtime multiplayer is hard.  You have to implement some kind of prediction to compensate for lag.  Even then, its not a perfect solution.  The more lag there is, the more inaccurate it will be.  You are either shooting at a location that the opponent is no longer in (lag) or shooting at a location that the server is guessing the opponent will be in (prediction) 

Link to comment
Share on other sites

On 17/12/2016 at 0:32 AM, ozRocker said:

realtime multiplayer is hard.  You have to implement some kind of prediction to compensate for lag.  Even then, its not a perfect solution.  The more lag there is, the more inaccurate it will be.  You are either shooting at a location that the opponent is no longer in (lag) or shooting at a location that the server is guessing the opponent will be in (prediction) 

Or shooting at the position, that the opponent Was in when the server sent the state (+/- interpolation time).



I'm just not sure of how to implement this. When you read various articles, they mention the fact that you 'rewind' the time, and then apply your projectiles, rays etc.

But wouldn't that possibly cause issues, like, if 10 or maybe 20 people are shooting all at once, the states are rewinded, and then, even if this is a fast process, you'll likely, at some point, send a rewinded state back to all the players. Maybe you could have a boolean like mode.isRewinded, and if this is true, then don't send the state just yet, but wait a few miliseconds. Another way might be to create new instances of the physics objects every time a shot is fired, but won't this be draining ressources, even if you destroy the objects after use.

Hmm. Maybe just create One physics body for each player, and queue these for the intersection function?

Link to comment
Share on other sites

On 12/21/2016 at 10:04 AM, V!nc3r said:

I'm on it, in team with @Nabroski !

Yeah! teams! just what I like to hear.

@Raggar - you are not the first one facing this issue. There are a lot of resources about it (http://www.gamedonia.com/blog/lag-compensation-techniques-for-multiplayer-games-in-realtime for example). Timeframe, the project you linked to, is integrated in @endel's server implementation, so I would recommend giving it a try.

My 2 cents - don't overcrowd the network channel. Send only what's needed, do whatever you can on the server. Limit the number of players in a single game, or have very strong servers :) one of the two.

I remember reading an article about slither.io , which have around 600 players in each world. This do nothing new - compensate for lag using calculations on the server and estimations to your next point. If you play the game with network throttling you can actually see how they correct your position

Link to comment
Share on other sites

I also got stuck on the messaging system.  If there are 30 people running around far away from eachother, I don't want all movement messages from all 30 people going to everyone.  This would clog up the network.  I tried to create a grid-like system where only players within 2 grid cells away would be notified of movement.  It got really complicated and I couldn't find any info on this so I gave up.  But I'm sure in large multiplayer worlds there is some kind of streamlining going on with message broadcasts.  I doubt World of Warcraft would broadcast the actions of every single item and player to everyone connected.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...