I am using one of the many javascript game engine (impactjs, craftyjs, melonjs, easeljs etc) out there to handle the animation client-side. And I have a way of calling server-side functions and syncing variables between client-server (can be done using node.js/socket.io or libraries like nowjs). Everything is written in javascript.

I was wondering if I am doing the multiplayer right?

playerPosition = { x : 0; y : 0 } 

updatePosition = function (a,b) 
  playerPosition.x = a; 
  playerPosition.y = b; 

"playerPosition" is a server-side array containing the x and y position of the player. "updatePosition" is a server-side function that updates the position.

What I am doing now is when the player presses a movement key, I let the client-side Javascript engine handle all the movement and collision. Then call "updatePosition" to update his position on the server. The relevant values in the "playerPosition" array is passed to the client to sync.

Obviously, players can cheat by hacking the client and feeding whatever value they like for inputs "a,b". (updatePosition is server-side but it is called from client-side) To stop that, I added a check to see if the next position values "a,b" is too far off. E.g. I call updatePosition every frame, and I know players move only 5 pixels per frame, so I ignore "a,b" inputs that differs from the old position by more than 5. (essentially, the client processes keypresses and moves the sprite but this movement is only updated on the server if the server thinks its valid)

Collision is entirely handled by the client-side Javascript game-engine so I am not sure how to check it server-side. Perhaps I will have an array server-side holding all the coordinates that the player is not allowed to move to (solid, colliable objects etc) and use the check as before.

Question: Am I doing it "right"? Or is this totally naive and prone to catastrophic failure? :D

If I am not wrong, I should be doing movement and collision server side? Javascript game engines are written to draw stuff on the HTML5 canvas client-side. I am not sure how to run those engines server side. Or is it enough to be validating moves and what I am doing above, and let the client handles all the movement and collision?

  • 2
    \$\begingroup\$ Collision is usually mirrored on the server because it's needed for movement validation, LOS, pathfinding, etc...; which is what you're already suggesting. Client-side movement handled immediately and then verified by the server is a great method when combined with server proxies with interpolated moves. You're doing fine, and better than some. \$\endgroup\$ May 24, 2012 at 15:30
  • 2
    \$\begingroup\$ That should be an answer. \$\endgroup\$
    – jhocking
    May 24, 2012 at 15:32
  • \$\begingroup\$ Legendre can create an answer with pieces of that he uses, hopefully with a description of how he refactored any code. It's too short to be a real answer in this Q&A reference format. \$\endgroup\$ May 24, 2012 at 20:05
  • \$\begingroup\$ Thanks Patrick. Question: what do you mean combined by server proxies with interpolated moves? Sorry, I am new to multiplayer networking, not familiar with the lingo. :p \$\endgroup\$
    – Legendre
    May 24, 2012 at 21:12

1 Answer 1


After some more reading, asking on other forums and comments from Patrick Hughes, this question is pretty much resolved.

Based on what I gathered, this should be a viable approach: when the player press a movement key, the input is sent to the server and his position is updated server side. The Javascript engine remains client-side and is used to draw the animation of this movement.

I would validate the movement server-side. E.g. check if each move does not exceed certain bounds. Also, collision has to be validated server-side. E.g. keep an array of coordinates that would result in collision and make sure moves does not cause player coordinates to take values in this array.


You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .