Tutorial on creating Babylon.js multiplayer games and live demo

I implemented Gabriel Gambetta’s exact solution in a virtual world I made before. There is a misunderstanding between us. I’m not saying there is a better way to compensate for lag, I’m trying to explain that even with the BEST lag compensation technique you can still see problems.

In my old virtual world I did this and if lag is really bad then there will be big corrections. The longer the system is predicting the path, the more inaccurate in can be. The problem is still the lag. My virtual worlds are open to all devices, sometimes mobile devices with 3G, so I turned off prediction. For professional games like Counter-Strike gamers tend to use good computers with good network speeds.

1 Like

I tried to find the next step after your tutorial. It is very bed solution to send positions without any lag compensation for smooth movement. Is it impossible for beginners to make smooth movement after deployed on real hosting? I cannot find tutorials with another methods. You said that you turned off input client prediction because it is very bad for bad internet connection (I think 70-100 ms is very bad to send coordinates directly). I want to make mobile games with multiplayer. Or is not impossible smooth movement on mobiles?

Are you not recommend that tutorials above? What is a reason to make two loop on server and clients for input client prediction and another client interpolation if I turn off it in any case later?

Input client prediction and another client interpolation works only on good network speed? What is network speed good? 70ms is good? What is the range of good network speed? Direct positions are better on bad network speed?

aFalcon’s 2 cents,

In context of 3DWeb (cinematography): re-invent “multiplayer”, opposite CounterStrike, to innovative/clever solutions.

Embrace the lag - make it part of the story.

ONE-EXAMPLE:

image

EXAMPLE-TWO:

filter shots, that do not vector (range-of-movement) bounding box? A “doNotSendMode” ?

A beginner also. Just ideas.

:eagle: : )

1 Like

The problem is very big if you send client input directly on the authoritative server. For example, I press a right key. My client will send the right key press on the server. I have 200 ms on mobile internet with 3G. My client will receive a new coordinates only since 400 ms. It is better to begin to move with client prediction. Without the client input prediction we will have very bad result when we will deploy on real server. Try to uncheck “client prediction” on this demo Real time multi-player games with HTML5 and you will see how it is bad on good connection too. I do not know alternative on this method. It is so correct. We press the button and we see the result immediately and we do not need to wait and new position from the authoritative server.

1 Like

If you have a slow 3G connection then there is no way to have a good game. Lag compensation is not magic. If you have players with a lot of lag you will have big corrections happening all the time. Players will be walking one direction then suddenly then will appear somewhere else. Imagine trying to shoot people if that is happening.
My virtual world is not meant for real-time gaming because I want it to be accessible to everyone with all kinds of bad connections. But if you want accurate real-time gaming you still need low lag.

Even games like Call of Duty have these problems (from their website):

Several factors can negatively affect your performance while playing games online. Often collectively described as lag, these factors can lead to a host of in-game performance issues, including:

  • Rubber banding – Your character is running toward a destination and then jumps back to where it was a few seconds prior.
  • Stuttering – An effect that makes your character appear to freeze and skip ahead while moving.
  • Hit marker delays – When it appears you have landed several shots on an enemy, yet the enemy is able to kill you with fewer shots fired back.

Lag can also result in your getting booted from a match or from the multiplayer lobby while matchmaking.

If you’re simply having trouble connecting to the game, check out Connecting to a Call of Duty: Black Ops 4 Game .

Here are a few things that can contribute to lag along with tips to reduce it.

1 Like

Client prediction looks perfect with high lag if people are moving in straight lines. Try running tests where players are changing movement rapidly, ducking / jumping / running / turning corners to escape being shot. You will see client prediction producing bad side-effects. The higher the lag, the worse the side-effects.

If you have a very fast connection but your server is in Europe and you client in USA then there is no way to have a good game without input prediction and interpolation of another clients. 100 ms - is a very good connection. All games in the World uses the lag compensations methods. Without this methods your game will be unplayable. Please, read about an authoritative server, and a lag compensation in this book: Amazon.com

If we delete this method from Counter-Strike this game will be unplayble. In this case you can play on LAN only. This method is the best and it does not have alternative. If you have the best solution, please, show the test results.

There is a big miscommunication between us.
Yes I understand client prediction is necessary. I understand that all the realtime multiplayer games use this method. I understand that is the BEST method for dealing with lag. I know how it works and I have implemented it before.

I’m trying to explain that even with this method you will still experience problems if you have high lag. Counter-strike is better with lag compensation, but if lag is too high then Counter-Strike is not playable. In fact, you will be kicked out of match-making. You will be removed from the game if your ping is too high.

This is the last time I will repeat this. If you do not believe me then there is nothing more I can do.

Old multiplayer games uses these methods too. This methods uses in all books and tutorials. Every beginner must know these methods. I just wanted to say that we need to have more tutorials about it. Only local network do not have network delays. In real word we cannot avoid network latency. It must be the main theme in tutorials. There are enough tutorials for localhost. With direct sending of client input the real time games will be unplayble or looks very bad even with good internet connections. And do not send coordinates directly because all calculations (and collision detection) must be on authoritative server. Server must have 2 loops and client must have 2 loops too. I highly recommend to study this tutorial and code example at the end of article: Real Time Multiplayer in HTML5 - Build New Games

@ozRocker I’ve implemented a chat to this, I’m unsure if you’re interested in adding it to the post but here it is, if anyone wants/ needs it. :stuck_out_tongue:

it uses Babylon.GUI, ENTER to chat /Should/ be working… it isn’t perfect but it is a start :slight_smile:


2 Likes

Awesome! It looks good @Ateria. Was there an advantage using Babylon.GUI over HTML for the chat interface?

1 Like

@ozRocker chances are there’s no added advantage. I come from a backend/java background so babylon.gui feels more comfortable for me. Most I’ve done with html/css/jQuery is some forum work, and running a java applet in the browser. Before chrome killed that off due to the outrageous amounts of java Drive-bys.

I’ve add live streaming TV to the demo.
This is useful if you want to place TV screens around your multiplayer world where everyone watches the same thing at the same time.

https://playground.babylonjs.com/#GG536W#47

4 Likes

@ozRocker that’s actually super cool, wasn’t aware that was possible

My son came home from school telling me they were playing this in class (and on the bus).

Best of the best market-analyst.

:eagle:

3 Likes

I just tried that and it threw an error. “createEngine function must return an engine.” Any idea what caused the problem?

Hey @ozRocker there’s an error: “Error at [16,28641]:i.initFunction is not a fuction”
What shoud I do?