search

ampproject / wg-performance

Monitoring and improving AMP's load and runtime performance for compliant documents. Facilitator: @erwinmombay
Creative Commons Attribution 4.0 International
7 stars 6 forks source link

Pixi: Poor page experience #52

Closed barruka closed 4 years ago

barruka commented 4 years ago

URL

https://www.alpel.es/hoja-cuchilla-afeitar-ragnar-100-unid-simple

Details

Metric Field data Lab data
LCP n/a 3.8 s
FID n/a 118 ms
CLS n/a 0.26
HTTPS pass ---
Safe browsing pass ---
Mobile-friendliness pass ---
Intrusive Interstitials <pass/fail> ---

Notes

Components in use: amp-analytics, amp-sidebar, amp-form, amp-image-lightbox

/cc @ampproject/wg-performance

kristoferbaxter commented 4 years ago

Thanks for the report, I've added Kevin Kimball to the issue to take a look.

kristoferbaxter commented 4 years ago

Also, it seems there are 3 recommendations for this example.

image

@barruka Can we address these three recommendations and re-run?

barruka commented 4 years ago

@kristoferbaxter I am very sorry but I really think that the issue is not with that three recomendations, let me explain myself:

First: Got the page and saved it like .html: https://www.alpel.es/test_amp.html

Secong: Edit .html and remove all amp js and style boilerplate, changed amp-img to img and saved it: https://www.alpel.es/test_noamp.html

I tried to keep html as equal as possible in both pages, so I didn't remove on="tap:AMP.navigateTo

Theese three recomendations are even on both html files, same images and same initial server response time.

I don't know if these files can provide any help to you, sorry for not being able to help you.

kristoferbaxter commented 4 years ago

Assigning this back to me. I'll create a public copy of this document with the AMP Optimizer, transformed hero images, and a shorter response time from the server as an example.

kristoferbaxter commented 4 years ago

@barruka I created a temporary copy of the origin document and applied a few of the recommendations from the Page Experience tool (Pixi).

Before

Screen Shot 2020-10-19 at 11 47 01 AM

After

Screen Shot 2020-10-19 at 11 44 17 AM
With some of the recommendations applied from the tool, the following changes occured: Category Before After
LCP 3.5s 2.8s
TBT 120ms 136ms
CLS 0.21 0.09

This means the only category in the lab data tests needing enhancement is LCP.

The final recommendation from Pixi "Use the JavaScript Module version of the AMP Runtime", is currently experimental. Using this version of AMP results in an invalid document. However, I was able to force the results... netting a LCP of 2.6s. @nainar is working with the Caching Working group to ensure this incongruity is addressed quickly.

This means the result from all the recommendations is a page that is passing and not passing Core Web Vitals based on network conditions within the Lab environment. In our experience, this means the document will pass in the real world based on the 75th percentile of real world traffic.

Edit: Grammar mistakes

barruka commented 4 years ago

@kristoferbaxter what a great job, thank you very much! I'm sure everyone really appreciates your effort

kristoferbaxter commented 4 years ago

Closing this issue out. Seems resolved.