Many mobile browsers introduce a 300ms delay when a user taps on a link or button. From Google:
Mobile browsers will wait approximately 300ms from the time that you tap the button to fire the click event. The reason for this is that the browser is waiting to see if you are actually performing a double tap.
300ms can have a huge impact on performance, and this is one of the reasons why native apps feel so much faster than web apps. Don’t believe me? This video from Microsoft Research demonstrates how sluggish even 100ms can feel.
Fortunately, there’s a fix.
FastClick.js is script from FT Labs, part of the Financial Times. It removes the delay on touch-screen browsers, making your websites and web apps feel substantially faster.
I use this on every project I work on.
One minor caveat: I (and a few others) have found that if the very edge of a link is tapped, focus is added to the link but a click event is not fired. This is quite rare, and I believe the performance gains more than make up for it, but it is something to be aware of.
Things are getting better #
Chrome for Android removes the delay on sites that are mobile optimized, since double tapping to zoom is unnecessary in these cases. And Apple has a plan for implementing this on iOS as well, though there’s no clear date for when it’s going to ship in their products.
Get the Spare Parts Newsletter
Every week, I send out a short email packed with web development resources and interesting stuff from around the web.