Would you like to get AskBug/AnsPress running super fast?

2.82K viewsThemes



To get AskBug/AnsPress to run under 1.5 seconds ~ the Google threshold for slow sites ~ you can probably use just about any caching system, and still only be able to get it down to about 3.5 seconds.

What I did was to use WP Rocket ~ which produced the 3.5 seconds ~ and then added to it “Rocket Lazy Load” [ https://wordpress.org/plugins/rocket-lazy-load/ ] which allowed me to lazy load all those Gravatars that were slowing the page load down.

Now the site is below 1.5 seconds, or even 1 second, if you believe Pingdom.

Yes but, does the page(s) and QAs get updated with those caching plugins ? I have a lot of trouble with them and i had to actually exclude the Anspress urls from caching.

The whole idea of a caching system is that it makes things static. That’s obviously one reason why they load much quicker. So with any caching system on a dynamic site, you will have to tell it what needs to be flushed and updated and under what conditions.

Also, here in this site I use Cloudflare Pro reverse proxy as both a CDN and for security reasons, but that also implies another level of caching in their remote edge servers, so I must be able to flush programmatically, not only the local cache but also the remote caches too.

Therefore I needed a caching system which I could tell to flush locally, when a new question or answer was entered ~ or a new blog post created {same thing} ~ so I chose WP Rocket which is fast and fairly easy to control in this way.

However, it was not optimized to control the problem created by BugPress showing all those Gravatars. To do that I needed the “Rocket Lazy Load” as well, which runs with it and presents all the Gravatars in base64 coding, so they are 0 length and load very fast.

There is one downside to lazy loading and this is that images at the top of the page aren’t loaded until you scroll down the page, and then they magically appear when you scroll back up again. To get around this, If you want to disable LazyLoad on a specific image, it’s really easy. You can do this by simply adding data-no-lazy=”1″ attribute to the image.

Anyway, that’s one solution I found worked for me, but I guess there are many more.