AMPAlex nadalin - namshi.com

acceleratedAlex nadalin - namshi.com

MobileAlex nadalin - namshi.com

ProblemsAlex nadalin - namshi.com

This is how your data balance looks like when browsing these websites:

This is how your data balance looks like when browsing these websites:

The worst part is:we only need ~100kb to show the

user some meaningful content

To put it in perspective:

To put it in perspective:

Good people

To put it in perspective:

Good people

We mortals

To put it in perspective:

Good people

badasses

We mortals

What makes a webpage fat?

In 2016, the average webpage is the same size as Doom (yes, the game)

In 2016, the average webpage is the same size as Doom (yes, the game)

In 2016, the average webpage is the same size as Doom (yes, the game)

In 2016, the average webpage is the same size as Doom (yes, the game)

In 2016, the average webpage is the same size as Doom (yes, the game)

What makes a webpage slow?

What makes a webpage slow?

What’s below the fold

Blocking resources

Janky animationsLots of resources

How doesAMP help?

Avoid js

Avoid blockingresources

Size everythingIn advance

Inline styles

...and other interesting things like resource hints, gpu-accelerated animations only, etc.

https://www.ampproject.org/learn/how-amp-works/

AMP is nothing but a set of guidelines on how to structure your HTML

documents...

...and some additional tags like <amp-image /> which enhance the

regular ones

https://validator.ampproject.org

g.co/ampdemo

Google caches the content on their side and they try to

refresh it as much as possible (ie. at every amp hit or

https://developers.google.com/amp/cache/update-ping)

To put it in perspective:

AMP

To put it in perspective:

AMP

We mortals

To put it in perspective:

AMP

We mortals

To put it in perspective:

AMP

We mortals

Too lazy?

https://mercury.postlight.com/amp-converter/

Too good to be true?https://www.tunetheweb.com/blog/do-we-really-need-google-amp/

Worst-kept AMP secret?

If you’re that good you wont need amp

Check https://www.filamentgroup.com/

In general...

AMP alone won’t makeYour website fast

It will help yousolve problems on

the right layer

“don’t integrate things on the client side, just because that is easier, when the user experience

would be better with a server side integration.“

https://www.ampproject.org/learn/design-principles/

If you get performance right, AMP will be an easy

addon

If amp = hard:Performance = hard

Make the web faster.

Make the web thinner.

Make me buy less data.

questions?

github.com/odino

twitter.com/_odino_

odino.org

VP Technology

github.com/namshi

twitter.com/TechNamshi

tech.namshi.com