Developing for mobile web has challenges, right? Varying screen size, intermittent connections, poor support of modern web APIs on mobile browsers—just to name a few. All of these challenges affect the quality of a user’s experience.
However, the largest challenge by far is the speed and performance of mobile web. As the user experience on web becomes richer and more compelling with vibrant imagery, videos, fonts, advanced functionality, and beautiful animations, pages and apps have become larger and larger.
A quick look at httparchive.org shows the average size for all content in a page essentially doubled in size from 2013 to 2017 or 1617kb to 3337kb. This increase in size combined with the fact that mobile traffic is increasing (now reported at 50% globally) creates a big problem for users and developers.
Why? Users don’t like slow things. This is what AMP attempts to solve.
Accelerated Mobile Pages is a Google initiative to make the mobile web faster. The argument for the project is sound: a faster web is a better experience for everyone.
What AMP brings to the table
Google creates so many great products (so many). Google also deserves mountains of credit for pushing best practices and advanced developer tooling to the community. AMP is no different.
The AMP project brings together several tools for creating fast, cacheable content (pages) that load amazingly fast on mobile devices. When I say fast, I mean almost instantaneously. A single AMP page loads in tenths of a second compared to the average 22 second load time for mobile pages. This difference is remarkable. In a business sense, this decrease in load time is the difference between closing the sale, converting a customer, or increasing ad revenue.
AMP enables this blazing speed with the implementation of a subset of HTML called AMP HTML and a CDN (content delivery network) called AMP Cache. By creating additional versions of your content (articles, products, media) using AMP HTML and implementing additional metadata in your app, the newly created AMP content is cached by Google and prioritized to users in mobile search engine results page.
Doing a Google search for new iPhone on my Android brings up the above results. AMP-enabled content is displayed in a top-fold content carousel and branded with an AMP icon:
Users can then swipe left or right through to find the best article. Once a user taps on an article, the content loads almost immediately. It should be noted that users are not directed to your domain, but a second CDN url.
In the example below, the domain I was taken to was not Forbes, but a url prefixed with https://www.google.com/amp. While this redirection doesn’t affect your traffic stats, it does call into question the open nature of the web:
The last two points, prioritization of content in search results and caching content on Google’s CDN, are where I think AMP goes wrong.
AMP as a tool
The fact that AMP content is prioritized in search results and served from a singular organization changes the playing field. Should developers and stakeholders implement AMP for performance or promotion? Two very different goals.
If you’re a content creator, there is value in implementing AMP enabled content. As of spring 2017, there were 2 billion AMP pages covering some 900,000 domains. If your competitors are there, you probably should be too.
However, don’t lose sight of the original problem—the web is becoming slower while traffic from mobile devices is increasing. The problem is larger than just figuring out how to better promote a portion of your content in the name of competition. The problem is that your core user experience is likely not performant enough to keep mobile users engaged.
The fact is, you may not need AMP.
Use the right tool for the job
If the goal of your organization is a sustainable, compelling user experience on the web across all devices, focus on the overall speed of your web application. Focus on strategies that paint the screen fast, load features only your users need, show the user that content is loading, cache content locally, and handle the network smartly with APIs like service workers.
If you need ideas for low hanging fruit, pay attention to:
- Image optimization
- Splitting HTTP requests for loading assets
- Caching reusable content
In fact, Google has a great tool called Lighthouse that provides a straightforward report card for your site with suggested fixes.
AMP is only a single tool and, make no mistake, in its current form, AMP is a promotional tool—not a performance tool. Google has another initiative, Progressive Web Apps, that does address the growing performance problem. I highly recommend watching a great talk by Ewa Gasperowicz on Progressive Web Strategies. She outlines a great starting point and a sequence of steps your organization can take to improve performance of your web project.