Comment on Amp Page

@mj00712 Can you share your site URL or inform me what mode of the plugin you are using?

Reader mode

The ability to view comments and post new ones is not currently supported in Reader mode. However, we plan to add support for this by the end of June at the latest. For updates you can follow https://github.com/ampproject/amp-wp/issues/2044

• This reply was modified 4 years, 9 months ago by Weston Ruter.

@westonruter hi again! ??

As I understand we need to wait until June to output comments on AMP post pages, right?
Because I’m now trying to output comments with wp_list_comments() and amp-live-list and wp_list_comments() returns nothing.

Thanks.

@nikitasp You can output comments now on AMP pages when using Transitional or Standard mode. It will be easier to do comments on AMP pages in Reader mode when v1.5 comes out at the end of this month. As for the specific code used to add the comments, you should then be able to use wp_list_comments() because in v1.5 the global $post will be set properly: https://github.com/ampproject/amp-wp/blob/88a136b484ff8a9c0d30986ce95a739a3e70fafc/includes/templates/reader-template-loader.php#L15-L19

@westonruter I’m using reader mode for now, because we’re not ready for AMP-first websites because of limits of AMP version. So seems I’ll wait for 1.5 update.

Thanks.

@westonruter I’m trying to get comment list with wp_list_comments() and it still returns nothing, after 1.5 update. You didn’t fix that, did you?

Thanks

I should be able to check this by tomorrow.

@nikitasp Here is a demonstration plugin showing how comments can be added to the Reader mode templates as bundled with the AMP plugin: https://gist.github.com/westonruter/b14c95d5e8531dbc1167ebfc80c74562

@westonruter seems working!

I’ve just added <?php comments_template(); ?> to my single.php and copied a bit code to style.php from the original style.css (I hope Search Control developers already updated the 50kb limit and I wont get warnings because of 50?631b file size) and it’s looks cool, there is even answers.

Thank you VERY MUCH! You’re the best, really! Some devs are unresponsive in support treads. I know there are a lot of topics created with people who use WP like just a constructor (theme + plugins) and they doesn’t understand common things. And I try to make my questions clear and correct but they ignore them too, but not you.

I really appreciate that!
Maybe there is something I could help with?
Thanks.

Excellent.

Yes, AMP’s CSS limit is bumped from 50KB now 75KB.

Nevertheless, if the CSS file you are using is 50KB do note that the AMP plugin in Reader mode now also does CSS tree shaking, so most likely the total byte size of the style[amp-custom] element’s text content would be much smaller (if the input is 50KB).

We’d appreciate a plugin review!

@westonruter done! ??

Interesting technology (I’ve googled a bit about it) – it’s really the way we should go instead of splitting CSS file to parts and injecting them into pages (It’s anoying while development a bit).

Will Google PageSpeed module for servers (IDKN what is the right name) support this, or wee need to release it in the PHP?

Thanks.

Thanks!

The CSS tree shaking here is tailored specifically for the AMP use case. It is basically impossible to do reliably on an arbitrary site which had any custom JS modifying the page. But since AMP uses a declarative component model it is much easier to statically analyze a document in order to determine what CSS may be used during the life of a page, and which CSS can be safely removed. From analyzing themes on www.remarpro.com, the CSS reduction is around 75%.

@westonruter well, the code could analyze classes in JS and exclude them from removing for example.

The thing is I was struggled with PageSpeed Insights a week ago to improve the website speed for mobile (100 on desktop, 76/100 mobile), and removed a few unused bootstrap components (some of them had to get back after a few updates), but it’s a small boost and I faced with next problems:

1. Unused CSS – CSS of the elements from other pages or hidden elements. There is only one way to solve – group CSS code to blocks and compile it for each page, but it’s not comfortable, because we always working on the project and making it better.

2. Reduce JavaScript execution time – google recaptcha v3… omg. why? why Google? For what? Had to replace with Cerber antispam system (WP plugin), but still get 2.1s.

3. Minimize main-thread work 5.6 sec – jQuery, Bootstrap + 218kb custom file with minimized libs (jQuery event move, inview, cookie, lazyload, owl-carousel, fancybox, international-tel-input) and custom init code for those libs, Google Analytics, FB Pixel, Mailchimp pixel, really nothing unnecessary.

4. Serve static assets with an efficient cache policy – for external 5 libs for statistics. – I don’t want to store it on my server and make CRON update – it sounds not sexy ??

So I was trying to find something more to do to improve speed, but as I understand there is no way to improve is more that’s why I’m interested in this solution.

All the competitors have lower rates, sometimes too low (<40), but they are still in the top of search results ??

• This reply was modified 4 years, 7 months ago by Nikita_Sp.
• This reply was modified 4 years, 7 months ago by Nikita_Sp.

well, the code could analyze classes in JS and exclude them from removing for example.

That may provide some benefit, but it would be very difficult to reliably parse JS code to try to detect class names as well as any other changes that JS may make to a page, like toggling attributes, creating elements, and so on.

So I was trying to find something more to do to improve speed, but as I understand there is no way to improve is more that’s why I’m interested in this solution.

I’m glad you’ve come to this conclusion. We’ve concluded the same and that’s why we’re so invested in the AMP plugin as a way to democratize performance and help publishers succeed on the web.

We feel strongly that AMP provides the most accessible way to attain high page performance, especially in WordPress where the theme/plugin ecosystem has so few constraints imposed on it. It’s the wild west, and a plugin at any point could introduce some JS to the frontend that severely impairs performance. The AMP plugin helps you to build a fast site and keep it fast by means of the sanitization and validation process. A theme/plugin just has to be sure to use AMP’s components to achieve the desired interactivity. But even when they don’t, as long as the theme/plugin is written properly with progressive enhancement so that it works properly when JS is turned off, then this by default becomes the baseline AMP experience since the AMP plugin strips out custom scripts (while also unwrapping noscript tags so their contents become the AMP version by default).

The AMP plugin will be doing more to further improve performance in upcoming releases. You can track some of those in the Optimizer label on GitHub: https://github.com/ampproject/amp-wp/labels/Optimizer