Fix Input Lag on Android in GameMaker HTML5 Games
The other day we released updates for several of our web games fixing a pretty critical bug on Android. Here’s how we fixed it, with a code snippet helpfully provided by SnoutUp Games!
What’s the problem?
When playing your GameMaker HTML5 games on Android, you may have noticed an issue on some devices. When the player taps on the screen, they have to hold their finger down for almost a full second to register any kind of touch.
This is mildly annoying for some slow-paced games, and absolutely disastrous for anything that requires speed and accuracy.
This bug has been reported dozens of times on GameMaker’s official forums and their Github for at least two years now and they haven’t fixed it. But that’s OK, because there’s quite a simple solution!
What’s the solution?
To fix the problem, all you need to do is insert the following code into the <head> section of the index.html file containing your GameMaker HTML5 game:
<script>
document.addEventListener('touchstart', e => {
e.preventDefault();
}, {passive: false})
</script>This works by telling the browser on the Android device that we want to prioritise touches that we’re “listening” for in the GameMaker game over touches related to scrolling the browser window. Since you should be programming your web games to fill the window on mobiles anyway, there shouldn’t be any issue with disabling the normal scrolling behaviour like this.
Why the GameMaker team haven’t added this, at least as an optional checkbox, I don’t know. Maybe it’s considered bad practice – but after hours of testing it seems to have literally zero negative effect on our games, so I’d say it’s safe to use it.
Another huge thank you to SnoutUp games, who have some great games and more useful GameMaker tutorials on their website here.
