- Part One Chapter 03 – Mobile Website Speed Optimization Techniques
Part One Chapter 03
Causes of Slow Loading Mobile Websites
A slow loading website (or web page) may certainly affect the normal use of your website.
The slow loading website negatively affects the Google organic search ranking of its web pages. The Mobile SEO Best Practices guide explains a website must load super fast on all devices (including mobile, tablet, and desktop).
The major causes of slow loading of mobile web pages include:
Web Servers
A web server (i.e. the software) that is slow by default, or has not been properly configured for maximizing speed.
Web Hosting Solution
A mobile website that is hosted on a relatively slow web hosting solution (or hardware), or has extremely high web traffic which is often heavier than the web hosting can handle.
Web Browser Caching
A mobile website that has not been configured to use web browser caching.
File Size
A mobile web page that requires downloading resources which added up to excessive file size.
HTTP Requests
A mobile web page that requires downloading too many resources such as images, videos, CSS and JavaScript files, which causes too many http requests.
DNS Lookups
A mobile web page that requires downloading resources such as images, videos, CSS and JavaScript files from too many different hostnames. This will increase the number of DNS lookups.
Slow Connection in General
Some intentional and unintentional setups such as redirects, bad requests, etc may considerably slow down page load.
Content Delivery Network (CDN)
A mobile website serving users of a very large country (or across large geographical locations, such as China) and with extremely high web traffic but is not using a content delivery network.
Slow Network
A slow network connection between your web server and the user (i.e. the web browser) requesting your mobile web page.
Techniques to Improve Loading Speed
You will not be able to solve all the causes, but you can apply techniques to optimize the speed of your mobile website. The optimization techniques may include:
- Optimize web servers
- Upgrade web hosting
- Implement web browser caching
- Enable file compression
- Minify CSS and JavaScript files
- Combine multiple CSS files
- Combine multiple JavaScript files
- Implement inline CSS
- Implement inline JavaScript
- Implement Inline images
- Implement CSS sprites
- Reduce DNS lookups
- Optimize the loading order of CSS and JavaScript
- Avoid CSS @ import
- Fix bad http requests
- Avoid redirects
- Implement content delivery network (CDN)
Summary: Causes vs. Techniques
When we associate each technique to the causes:
Cause | Technique |
---|---|
Slow web server software | Optimize web server software |
Slow web hosting solution | Upgrade web hosting solution |
No web browser caching | Implement web browser caching |
Large file size | Enable file compression, Minify CSS and JavaScript files |
Too many http requests | Combine multiple CSS files, Combine multiple JavaScript files, Implement inline CSS, Implement inline JavaScript, Implement inline images, Implement CSS sprites |
Too many DNS lookups | Reduce DNS lookups |
Slow connection in general | Optimize the loading order of CSS and JavaScript, Avoid CSS @ import, Avoid CSS attributes in HTML elements, Fix bad http requests, Avoid redirects |
No CDN | Implement CDN |
Slow network | None |
Google Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP) is a Google-backed open source project which lets you build web pages for static content that render faster. AMP consists of 3 major parts:
- AMP HTML
- AMP JS
- Google AMP Cache
- Previous: Page Speed Test Tools
- Next: Optimize Web Servers
Gordon Choi's Mobile Website Book has been available since November 2016.
Content on Gordon Choi's Mobile Website Book is licensed under the CC Attribution-Noncommercial 4.0 International license.
Gordon Choi’s Other Websites:
SEO Expert in Hong Kong (Gordon Choi’s Blog)
Analytics Book