Why AMP is fast

The AMP Project aims to bring instant rendering to web content. This is an unsorted list of optimizations that apply to all AMP based documents, which in aggregate makes them load fast. Every web page can have these optimizations, but AMP pages cannot not have them.

While this article is about optimizations in AMP, it might also be useful as a kind of todo list for optimizing a non-AMP website. If we are missing any optimization that might be benifitial to AMP, please leave a comment or send us a pull request.

Lazy loading

Extensive use of preconnect

Prefetching of lazy loaded resources

All async JavaScript

Inline style sheets

Zero HTTP requests block font downloads.

Instant loading through prerendering

While prerendering can be applied to all web content, that may (and does in practice) use up a lot of bandwidth and CPU. AMP is optimized to reduce both of these factors:

Prerendering only downloads resources above the fold

Prerendering does not render things that might be expensive in terms of CPU

Intelligent resource prioritization

Uncoupling of document layout from resource downloads

Maximum size for style sheet

FastDOM-style DOM change batching

In practice this means that in each “animation frame” we first do all the DOM read operations, and then when those are done, do all the write operations. The result is a reduction to 1 style recalculation per frame.

Optimized for low count of style recalculations and layout

Mitigations for third party JS worst-practices such as document.write

Runtime cost of analytics instrumentation is independent of number of used analytics providers

Extensions don’t block page layout

CDN delivery available to all AMP documents

All resources and the document are loaded from the same origin through the same HTTP 2.0 tunnel

Animations can be GPU accelerated

--

--

CTO at Vercel. Curator of @JSConfEU. Writer at industrialempathy.com. he/him

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store