On the simple act of clicking a link on a mobile device

Have you ever noticed that slight time delay when clicking a link on your smartphone and waiting for the operating system to respond?

In the past I’ve always put it down to hardware performance, multiple Apps being open, my internet connection or just the age of the phone.

However, after listening to the always fascinating Peter-Paul Koch talk with Jen Simmons on The Web Ahead, I’m now much better informed. 

My daily commute is pretty quick now but it does mean these extra long podcasts take a lot longer to get through than when I was commuting to London. However, it’s really worth listening to this one all the way through. As you would imagine from PPK, there’s plenty of information to take in but it’s always relevant and insightful.

So rather than try and summarise the whole interview, I thought I’d highlight one section that I found particularly interesting – where PPK explains why you experience a delay in clicking links in smartphones. (This isn’t going to be a word-for-word transcript but it captures the parts that interested me. For the whole interview head over to The Web Ahead on 5×5).

“In principle, a touch event is very simple. If the user touches the screen… a touchstart event fires, if a user moves his finger a touchmove event fires, if he releases the screen a touchend event fires. And that’s basically it.”

“The complicated part of this is, what do we do with the mouse events, like mouseover, mouseout, etc? In theory we should say these events don’t make any sense on a touchscreen device because it doesn’t have a mouse. The problem is there are far too many websites out there that depend on the mouse events, so mobile browser vendors are required to support them too.”

“So what they do now, is that when you touch the screen, a touchstart event fires first and then all the rest fire; mouseover, mousemove, mousedown, mouseup, mouseclick, they all fire once at the start of your touch on a touchscreen device. Which basically means that the mouse events are hopeless on mobile…but the click events are fairly safe. So if you have a website that depends on click events, don’t worry, that will work fine on a mobile device.”

“However, if you’ve done some testing with the click event on mobile devices, you may have noticed that it usually takes a little while, around 300 milliseconds, for the click events to actually filter through. So basically you touch a link and you expect to be taken to the next age immediately, that does not happen, the browser waits for a little while.”

Research into response times tells us that at 300ms is at the “level of responsiveness [that] is essential to support the feeling of direct manipulation. In other words, “the outcome feels like it was caused by the user, not the computer.” So this is an acceptable delay and I am left feeling that yes, I did cause the link to open, but the delay is definitely noticeable. It’s fortunate that this delay is acceptable because there’s nothing we can do about it:

“That is the main problem we’re seeing right not with touch events…that touch action is overloaded. Because at the moment you do that, the OS has no clue as to what you might do next. You might release the screen immediately again which means you clicked on this and I should follow the link, or submit the form or whatever; you can start to move your finger which means you’re going to scroll now; or you can add a second finger to pinch/zoom.”

“The point is that the OS has to wait for a little while to figure out what you’re actually trying to do and that is something that cannot be avoided. That’s why it’s always the case that when you click on a link it takes a little while for the browser to figure out that you have actually clicked on a link and that’s absolutely insolveable.”

You can find out more by downloading Peter-Paul’s presentation on touch events, given back in April 2011.