One of the popular game on Android devices and maybe the other mobiles is Runners. Like Temple runner, Train(subway) runner etc. I had a fun playing those games. The main mechanic is so easy that even a kid can play it without doubt.
Since I didnt started to make a 3d games yet, I've decided to continue developing in 2d. I think the love to 2d games came from my chilhood when at the age of 7 I've got my first Famicom clone (Dendy) and started to play Mario, Duck Hunt, Chip&Dale, Darkwing duck and other good titles.
So my idea was to make a 2d runner like game. At first I thought it would be great to make an infinite runner but it's much interesting when there is some goal which should be reached.
There are 3 levels of platforms, double jumps to reach platforms at the top, and up-down swipe do fall from current platform.
One of the problems that I've faced is the motions from previous game "Alien Jump". Motions were depend by the time value and in case of Pause it was not working at all. So good idea is to calculate all movements in case of frames or duration of them and have an array with velocities.
I found another issue with html5 canvas - it's skipped frames. This is visible on my laptop and mobile device. I've spent a lot of time trying to solve this issue. My first thought was to move from 2d context to webgl, like Pixi.js does. And I found cool library which translate 2d methods to webgl canvas. But it works the same. I've places 2 canvas on the page and provide the same methods for both of them and they image sitll stuck on two canvases simmulateously. No solution in this case was found. The issue can be checked on the last 10 level of the game.
As I understood it's a long story bug from 2014-2015 years.
On this page you can see that sometimes there is not smooth animation on 60fps line
Anyway, this issue is not permanent and do not bother gameplay.