We use WP Rocket as cache for our WordPress site.
In the front page we have a view, set to display an infinity pagination of custom posts,.
The problem is that all these images aren't cached by the plugin.
I am in contact with the support team of WP Rocket, and they told me that
"There is unfortunately no way for us to catch the AJAX request and do the replacement. This needs to be done at the level of the plugin with the AJAX feature."
What can we do?
Hi,
Thank you for contacting us and I'd be happy to assist.
The message from the support team of the WP Rocket plugin makes sense.
The objective of using cache for static resources (like images, CSS and JS files, etc) is to improve the page's initial loading time.
The benefit of using AJAX pagination is that the whole content is not loaded at once, during the initial page load. When each paginated segment of the page is called, the relevant content is loaded on demand, improving performance and loading times.
As long as your optimization plugin is set to leverage the browser cache for the static resources, you don't explicitly need to cache AJAX requests and content within it. On subsequent visits, the browser will load the available static resources from its cache automatically.
regards,
Waqar
Normally I wouldn't have any complain about it. The site works well and it's fast enough.
The problem is that these images not being cached have a bad evaluation on the Web Vitals performance measurement, done by GTMetrix or PageSpeed.
This lead to a really low grade index that, from 1.st May 2021, will have a huge impact on Google's ranking.
There's a way to bypass this behavior while maintaining ajax?
Thanks for writing back.
I'm a bit surprised that those images are even showing up in the page speed testing tools, as they're not part of the page's markup when the page initially loads.
Even if you've set the AJAX pagination to show with an infinite scroll that automatically loads, in my opinion, the page speed testing tools should only be evaluating the content that is loaded by default and without any interaction from the visitor like scrolling.
If your only concern is that the page loads fast for the end-users, it is safe to ignore those grades/scores from the testing tools. However, if you'd like to improve them too, you can remove the infinite scrolling that automatically loads the next results and use manual pagination links, that update the results through AJAX, but only when a visitor specifically clicks the next/previous page links.
