HTML5 Async Facebook Multiplayer Game (turn-based multiplayer)

Recommended Posts

Hi guys,


I need some general advices regarding building a turn-based multiplayer game using HTML5 that runs of Facebook. It would be my first multiplayer game, so please be kind with me :)


It's a sort of "quiz-game" in which you:


1. select a Facebook friend to challenge and

2. answer 3 different questions


Then, when the other player has completed his turn, the game will choose the winner.


I believe that the server logic it's very simple because it only has to

1. calculate the players' scores on each answer

2. check who's the winner

3. post the scores to a database to build a leader board.


I'd like to know which is the best way, the best library or the best tech-stack to build such a multiplayer environment.

I need to connect two players to the same game (asynchronously, they don't need to be connected at the same time), having their scores updated by a server (to avoid cheating).


I'm looking for something like PeerJS (http://peerjs.com/examples), don't know if there's something more specific.


I need a simple solution that works :)


Thanks for you advices :)

Share this post

Link to post
Share on other sites


this is a really simple setup. Do not confuse this with WebRTC or any other client side library. Just forget about JS for a moment.

It's simple because it's basically a server side application where you have users and challenges between two users.


A challenge consists of at least two actions- these are your requests forming the asynchronous game.

1. Creating the challenge by user A at moment M (including a set of answers given)

2. Answering the challenge by user B at moment N (also including a set of answers given)


The hard work is before, between and after those two requests :)


3. You have to get your hands on the FB authentication (I do this most often with the JS SDK. I use the JS response from facebook (with the acquired oauth token and the user id) to form a request to my server. There I will request any missing information from FB via Open Graph (and the acquired token) and finally create the user.



4. You have to get comfortable with the FB Notification API to send the challenge URL to user B after user A was playing. (This is done on the server after a challenge was created by user A)

This API is really easy. Send a text template & a url to the user. Again via Open Graph. Do not forget to set an application namespace in your FB App otherwise you will wonder why your notifications are not sent - I debugged this for hours months ago. So beware of it!



5. You have to create a performant leaderboard list. Think about it. Thoroughly. This could be a huge performance issue if you do not care and you have a big user base.

Do you want it to be ordinal (everybody has a different rank number) or dense (there can be multiple users on a position, after two first rank you would have a third place, no second place).

Look for a good query. I use postgres and there I can use rank() in combination with CTE (Common Table Expressions)- it's like creating a temporary table. In mysql I would have to create a simple sub-query with variables. The postgres way feels very sane. And do not forget to add proper indices. This is on the list which separates good developers from spaghetti code developers.


Here some relevant resources in the postgres universe:





6. Stack

This is the stack I would use as I'm comfortable with it: Rails 4 + Postgres

But you could also put node.js with express + mysql in there, use plain old PHP or go fancy with Java. Just use what you're comfortable with OR use the opportunity to get your hand on a language you always wanted to try. This is a game I would use to do so if there is time. Moving out of your comfort zone is a life changer, I clearly remember when I moved from my hatred PHP to Rails more than two years ago. Sun is shining now.


Notice: It's not done with those five steps. I can only give you a small overview.

I have done these games before and I'm planning on the next one at the moment. So I've happily answered your question to cross-check my own thinkings ;)




Share this post

Link to post
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.