javascript - Embedding snake game to engage website visitors , while page/module gets loaded in website

Question

In my website there are different flex and HTML modules , which takes some time to load . During that time viewers have no choice instead looking at throbber/loader gif image & waiting that page/module to be loaded up fully.

I want to engage viewers during that time by giving them an option of playing snake game or any other thing which can be timepass activity.

If anyone of you have any idea regarding that , can you please suggest me how to implement it ?

Answer 1

The entire code for a vanilla snake game is available here, please add it to your front-end code.

The idea would be to put this in a div with the same background color as the throbber on the loading page. Load it when page loading starts and to hide (or destroy) the div completely when page loading is complete.

The hard part is seamlessly getting a snake from a throbber (like YouTube does). Hey but even if you load the snake game from the start, it is a good start.