My Snake Game – First Post

My Snake Game – First Post

Hey there!

This is my implementation of a very popular game, which appeared in 1976 and became a standard game for Nokia phones in 1998. You must have already played this. The rules are simple, eat as much food as possible and don’t eat yourself. This game becomes difficult as you go on playing it because the snake gets longer as you eat.

This came up as Web Technology (a CSE course) assignment. The task was to use HTML5 Canvas and Events. So I thought to create a simple snake game from scratch in javascript.

You can play it here.

Now for a bit of technical part, I used HTML5 Canvas to render the game, window.onkeydown to listen to the arrow keys, requestAnimationFrame to update the canvas and localStorage to store player’s high score. Here I am leaving it up to web browsers to decide and maintain the frame rate (FPS) by using requestAnimationFrame function to update the canvas. After playing the game for a while, you might have noticed that sometimes it is fast and slow sometimes or on different browsers/computers the speed is different, it is because of the requestAnimationFrame function. Another issue is the size of the canvas is fix (820 x 520).

If you believe this can be made better, you are free to do so. Here is the code on GitHub. The future improvement I can think are –

  • Making it multiplayer using
  • A better UI.
  • More steady frame rate.
  • Storing score on the server side.

There are two themes Dark and Light Theme.

This is my first post on this blog. I wish to create more, better and useful posts. I hope u like it. 


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s