Mobile HTML5

Chapter 14. Mobile Performance

Whether or not your design or development is mobile first, your development process should always have performance at the top of the list of concerns.

Although the modern mobile landscape has browsers that are generally more advanced than the desktop browsers we must still cater to, the devices themselves may have similar memory and bandwidth constraints to the Pentium III you were using back in 1999. The mobile device itself, rather than the mobile browser, creates various constraints that we must consider during development.

The average website is over 1 MB. While responsive web design is currently the hot mobile topic at most conferences, mobile performance is really more important: who cares what your website looks like on the phone if your users can’t download it or render it on their device?

There’s a lot more to think about than the breakpoints of our adaptive design. We need to worry about feature detection, device APIs, touch events, content strategy, conditional loading of assets, and actual device performance. We need to take battery life, latency, memory, and UI responsiveness into consideration throughout the development process.

Battery Life

Unlike desktop computers that are tethered to the wall at all times, and even laptop computers that are generally used by stationary users, mobile users do not recharge their devices throughout the day. Mobile users expect their devices to last, at a minimum, 24 hours between recharging.

Your users ...