Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Tips to Improve Mobile Page Performance

DZone's Guide to

Tips to Improve Mobile Page Performance

Make sure you know the norm for mobile web performance, and consider the benefits of adaptive or responsive web design to boost your page's speed.

· Performance Zone ·
Free Resource

Container Monitoring and Management eBook: Read about the new realities of containerization.

Google is on a mission to make the web faster. In 2010, they included page speed as a contributing factor to search rankings, but this focused only on desktop search results. Starting in July, they will be extending that to mobile devices. Mobile load times will now be a factor in determining mobile search results.

It is no surprise that mobile performance is now going to be a consideration for search results. In the US alone, more than 8 in 10 internet users access the internet through a mobile phone regularly, according to eMarketer. The same study said 15% of internet users access the internet only from their phones, a number that is steadily increasing.

The search algorithm changes are expected to only impact the slowest pages and a small number of queries. The content on the page will still be an important factor, even if a page loads slowly. To ensure you don't lose out on valuable mobile traffic, check out these tips to increase your mobile page load times.

Do You Know How Fast Your Mobile Pages Load?

Response times on 4G wireless nodes were slightly higher ranging from 5.5 seconds to 15.5 seconds.

4G response times were 60% to 75% greater than the backbone response times. 3G access led to response times that were 231% to 514% higher than backbone response times.

Response time from Boston:

Response time from Los Angeles:

Consider Adaptive or Responsive Web Design

In Is Your Site Designed for Optimal Performance, we analyzed the performance of 30 websites -15 using adaptive design and 15 using responsive design. The table below compares key metrics as tested from 4G and last mile Catchpoint nodes.

The adaptive websites loaded 40.2% faster on average as they downloaded significantly less content.

Consider the following if adaptive isn't an option.

All users, not just mobile users, can benefit from smaller file sizes. In the last three years, the median page weight has increased across both desktop and mobile devices. According to HTTPArchive, desktop pages have increased approximately 30% while mobile pages have increased 91%.

For the media sites, all except CNN have page weights between 1.1 MB and 2.6 MB.

CNN is the outlier with more than 5MB of content downloaded to a mobile device. CNN does offer a mobile version of its site which is much smaller in size as there are no images. This version of the page downloads only 73 KB.

To reduce the size of files:

  • Enable GZIP compression on HTML, CSS, XML, and JavaScript.
  • Minify CSS and JavaScript to eliminate comments and white space.
  • Compress and optimize images. Reducing image size usually doesn't affect the user's perception.
  • Consider alternate image formats that are smaller such as WebP.

Third-party tags, whether for advertising, social media, or content services, are a potential pitfall for web performance. Just as the total weight of web pages has increased so have the bytes attributed to third-party elements. In The Performance Impact of Tags 2.0, we identified growth in bytes from third-party content of between 3% and 11% across multiple industries.

A greater number of hosts is an indicator of a greater amount of third-party content.

If third-party hosts slow down or become unavailable, your site slows down. Consider the following:

  • Know where your tags are and what functionality they provide.
  • Question whether third-party content is necessary for your mobile and desktop sites.
  • Install a tag manager to help you find or eliminate tags that perform duplicate services.

Delivering content across multiple domains, AKA domain sharding, was once a popular technique for improving page performance. Opening up multiple connections to retrieve objects in parallel addressed the shortcomings of HTTP/1.1. On mobile, this technique can hurt more than it helps. The overhead of additional DNS resolutions and TCP connections may penalize performance. The emergence of HTTP/2 has also made this technique less relevant.

When looking to improve mobile page response times, do some analysis to see where changes can be made and regularly test to see how those changes impact the user experience. Faster pages mean higher search rankings and happier users.

The number of connections made by the news sites varied considerably, and it is not a big surprise that the sites with fewer connections are the fastest performing sites on 3G and 4g connections.

If search rankings are important to you (and chances are they are important to your company) make sure you are following these tips to reduce page load times on mobile devices. Continually measure the performance of your mobile pages from mobile devices and wireless providers to make sure you are delivering the best possible experience to your end users and your search rankings don't drop.

Take the Chaos Out of Container Monitoring. View the webcast on-demand!

Topics:
performance ,mobile ,mobile performance ,web performance ,performance optimization

Published at DZone with permission of

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}