ampproject / amp-wp

Enable AMP on your WordPress site, the WordPress way.
https://wordpress.org/plugins/amp/
GNU General Public License v2.0
1.79k stars 383 forks source link

AMP Performance aspects in future releases #4997

Closed askmeoffers closed 2 years ago

askmeoffers commented 4 years ago

Respected Weston Sir ,

Thank you for building such a great amp plugin for wordpress and we are loving it .

While I was testing various releases of AMP ( development / production ) I noticed that we are adding some UI / Setup feature in AMP plugin and those features were already added in upto date dev build of AMP here https://github.com/ampproject/amp-wp/wiki/Development-Builds

I noticed that the development build is making site slow and our page speed score got reduced for store page .

I am just giving feedback that we should keep AMP light and fast and not make it heavy .

Performance aspects are main thing and it should majorly focus on achieving high page speed for both desktop/ mobile

https://developers.google.com/speed/pagespeed/insights/

https://askmeoffers.com/coupon-deal-offer-promo-store/oyorooms-com/

Our site is under devlopment since 7+ months as we are only using and relying on AMP plugin .

Thanks Team - askmeoffers.com

westonruter commented 4 years ago

Plugin performance is a top priority and recent changes should definitely not be slowing the plugin down. In fact the opposite should be true.

You mention the development build is making the site slow. Slow in what respect? Server-side performance or frontend performance?

Take note of #4991 which was just merged yesterday. It drastically improves server-side performance.

Please also look at your Site Health. Is there a test for AMP which is warning about CSS transient caching being disabled? If so, try re-enabling it via the button provided in the test.

Performance improvements in the plugin are being led by @schlessera. Please provide as much information as possible.

askmeoffers commented 4 years ago

Hi Thanks for quick revert .

I just installed updates from #4991 and its live on my site .

Also I can see in Site Health that there is a warning about CSS transient caching being disabled as per below snapshot .

How to enable it ? Via which button ?

How I measure speed of my site is by using online below tool and we see scores on both mobile and desktop

https://developers.google.com/speed/pagespeed/insights/

And I am always measuring score of one of our store page always so that we are consistent in testing the same page with same content https://askmeoffers.com/coupon-deal-offer-promo-store/oyorooms-com/

image

Team - askmeoffers.com

westonruter commented 4 years ago

Since you have an external objet cache then this is not applicable. No button is shown because parsed CSS transient caching is not relevant. So that's not the issue.

How do you know the issue is with the AMP plugin being slower or if the issue is a change due to an update in Lighthouse with the introduction of Web Core Vitals?

askmeoffers commented 4 years ago

Thanks!

I will do below steps to replicate the issue and share the details

1) I will discuss this with our theme development team to get their feedback as well. 2) I will do the detailed testing with different releases of AMP plugin and see how scores are improving/reducing ( page speed score of the lighthouse ).

Yes, I am aware of Web Core Vitals and also familiar that they are throwing unused JS for amp libraries and this is not recent.

As I am deeply involved in my project from 6+ months using AMP WordPress plugin so we know and we eagerly wait for performance releases of AMP plugin.

When 1st release of Optimizer updates was made it improved our page speed by 10+ and every time we measure the page speed of our one page

Sample Test Page we always consider Oyo Coupon store https://askmeoffers.com/coupon-deal-offer-promo-store/oyorooms-com/

I will collect all the data and share soon .

Thanks Team - askmeoffers.com

schlessera commented 4 years ago

I'm definitely interested in hearing more details about the exact changes. We're currently heavily invested in making the performance as good as technically possible, and the more data we have, the better we know what to optimize for.

Also, great to hear that the Optimizer release already had such a good result for you, thanks for letting us know!

askmeoffers commented 4 years ago

Hi @schlessera ,

My team is still debugging the issue of slowness and I will share the detailed report with different versions of AMP plugin soon.

Meanwhile, I had a few points which we can think of and which might improve the performance of a page

The only metric we use is the Lighthouse score ( Web Vitals )

Point 1) Optimizing DOM elements using AMP plugin ( like CSS tree shaking)

A large DOM will increase memory usage, cause longer style calculations, and produce costly layout reflows.

If AMP plugin can take care of optimizing and make the loading/style calculations in parallelism with DOM prioritization it might boost a web page.

Point 2 ) Reducing the number of external amp library calls ( embedding / or using inline js )

Point 3) Image conversion to modern webp formats

Point 4) Utilizing Object Cache /Memcache or any other caching to cache costly SQL queries .

I will soon update more test results

Thanks Team - askmeoffers.com

schlessera commented 4 years ago

Thanks for these suggestions, @askmeoffers!

Point 1) Optimizing DOM elements using AMP plugin ( like CSS tree shaking)

Yes, this is an on-going effort that is a big part of the plugin.

Point 2 ) Reducing the number of external amp library calls ( embedding / or using inline js )

We might be able to drastically reduce this for images as WordPress will provide the needed information right away.

Point 3) Image conversion to modern webp formats

This is hard to do reliably across web hosts, as we'd need to run a binary and also figure out where to store the new files (the filesystem might be read-only?).

Point 4) Utilizing Object Cache /Memcache or any other caching to cache costly SQL queries

We're already making use of the object cache in some instances, but not sure whether we're already covering everything that's applicable.

I'm looking forward to see your detailed test results!

Camilo517 commented 3 years ago

Also the queries, I don't understand why when visiting /wp-admin/plugins.php the "amp" plugin makes 5 queries http://prntscr.com/vnzrek

westonruter commented 3 years ago

@Camilo517 These queries are related to AMP Developer Tools being enabled in your user profile. They are used to populate the AMP admin menu, namely the Validated URLs and Error Index menu items.