How to setup blazing fast WordPress using myVesta + rocket-nginx + WP Rocket caching plugin

Post Reply
User avatar
isscbta
Posts: 91
Joined: Mon Jul 19, 2021 1:41 am
Has thanked: 7 times
Been thanked: 3 times

In case you use WP Rocket caching plugin, there is a way to setup integration between nginx and WP Rocket using rocket-nginx which is an advanced configuration for nginx to directly serve the caching files generated by WP Rocket.

As said initially by authors of this configuration, it enables nginx to serve directly previously cached files without calling WordPress or any PHP. You will go from NGINX → PHP-FPM → PHP → Static file to NGINX → Static file. In other words, you are serving the static file directly from NGINX instead of passing the request to FPM and then to PHP (for WP-Rocket... at least) before serving the static file.

In combination with myVesta CP settings (and nginx), it also adds headers to cache CSS, JS, and medias to leverage the browser's cache by reducing requests to your web server. By using this, you can noticeably speed-up WordPress sites, and in another hand, reduce the load on the server.

Rocket-Nginx was created by SatelliteWP and they deserve credit for all the content related to it.
Table of contents:
Some IMPORTANT notices before we start:
  • The following is a full and comprehensive guide available on their GitHub page: https://github.com/SatelliteWP/rocket-nginx
  • Please check for updates and adjust the settings below in accordance with any updates after 26th Feb 2022 (when this post is released)
  • This is not officially supported or maintained by myVesta CP and you are using this configuration on your responsibility.
  • For purpose of this tutorial, we set everything up on a demo server with myVesta CP. It is recommended that you test this before using it on your production server.
Automatic installation with our script


In order to follow along with this tutorial, we have already set up myVestaCP using - viewtopic.php?t=81

Steps:

1. Make sure WP Rocket is activated on your WordPress website

2. Then, get the latest build of myVesta.
In your SSH, as root, run:

Code: Select all

v-update-myvesta
3. Now we are ready to activate rocket-nginx template:

Code: Select all

v-activate-rocket-nginx YOURDOMAIN.COM
Instead of YOURDOMAIN.COM insert the domain of your website.
Here you can see script code: https://github.com/myvesta/vesta/blob/m ... cket-nginx

4. Test if everything is working


Manual installation
(for experienced users)


Let's jump on the installation steps:

Starting with the very beginning, keep in mind that there are 3 parts to the setup:
  • First which is done in the terminal
  • Second which is done on myVesta CP
  • Third which is done on WordPress
First part - terminal:
1. In order to follow along with this tutorial, we have already set up myVestaCP using - viewtopic.php?t=81
2. Now let's install rocket-nginx

Code: Select all

cd /etc/nginx
git clone https://github.com/satellitewp/rocket-nginx.git
cd rocket-nginx
cp rocket-nginx.ini.disabled rocket-nginx.ini
php rocket-parser.php
3. In our Nginx configuration file, we have to include this piece of code

Code: Select all

server {
  ...
  
  # Rocket-Nginx configuration
  include rocket-nginx/conf.d/default.conf;
  
  ...
}
4. To achieve this, we are going to do the following:

Code: Select all

cd /usr/local/vesta/data/templates/web/nginx/
cp force-https.tpl force-https-wprocketnginx.tpl
cp force-https.stpl force-https-wprocketnginx.stpl
mcedit force-https-wprocketnginx.tpl #here we will add code from the step 3.
mcedit force-https-wprocketnginx.stpl #here we will add code from the step 3.
IMPORTANT: Look here to see how those files should look like after editing: https://github.com/myvesta/vesta/tree/m ... -templates
It's also important to add %docroot% and %sdocroot% on appropriate place in order for this piece of code to work


Second part - myVesta CP:
5. That's all you need to do in the terminal. Now let's open myVesta CP and go to the desired domain where we installed WordPress and click Edit for that domain:
rocketnginx1-1.png
rocketnginx1-1.png (60.79 KiB)



6. Under Proxy Template we have to chose previously created nginx template with our rocket-nginx configuration:

rocketnginx2.png
rocketnginx2.png (71.59 KiB)
rocketnginx3.png
rocketnginx3.png (128.8 KiB)

7. Go to the end of that page and click Save

8. Go back to terminal and reload nginx configuration but before that - make sure everything is fine with this command:

Code: Select all

nginx -t
9. Now let's reload configuration

Code: Select all

service nginx reload
Third part - WordPress:

10. Basicaly everything you have to do here is just to have WP Rocket caching plugin installed and activated.
WP-Cron Jobs


Your scheduled jobs may not be called because the configuration relies on serving cached files directly from WordPress without having to execute any PHP.

Disabling WordPress cron jobs and creating a real cron job will ensure your scheduled tasks will run when they should.

In your WordPress-config.php, add the following line to disable WordPress cron jobs:

Code: Select all

define( 'DISABLE_WP_CRON', true );
After that, go to your myVesta CP and create a cron job to run every 15 minutes (or less if needed):

Code: Select all

cd /home/user/web/domain.com/public_html; /usr/bin/php7.4 wp-cron.php >/home/user/web/domain.com/cron.log 2>&1
NOTE:
In the case that your website uses a different PHP version from 7.4, insert that version instead of 7.4

At the end, in your SSH, as root, run:

Code: Select all

touch /home/user/web/domain.com/cron.log
chown user:user /home/user/web/domain.com/cron.log
cron1.png
cron1.png (53.06 KiB)
cron2.png
cron2.png (74.5 KiB)
Testing if everything is working


Go to the your website and clear the WP Rocket cache and let it to preload cache again

Now, open your browser in incognito mode (we are using Chrome), open your website and do the following:
  • Right click -> Inspect
  • Click the network tab and select "All"

    test1.png
    test1.png (60.95 KiB)
  • Ctrl+R to reload
  • Click your website name in the left hand side at the top
  • Under “Headers” scroll down until you see X-Rocket-Nginx-Serving-Static

    test2.png
    test2.png (99.86 KiB)
Specifically, we are interested in finding out:

“X-Rocket-Nginx-Serving-Static: HIT”

Our goal (as shown above) is to get a HIT. In addition, you can try refreshing and checking again if you didn't receive a HIT (and turn on the debug below to find out why).

To turn on debug - run following in the terminal:

Code: Select all

mcedit /etc/nginx/rocket-nginx/rocket-nginx.ini
Here change

Code: Select all

debug = false
To:

Code: Select all

debug = true
And then regenerate rocket-nginx config file by running the parser:

Code: Select all

php rocket-parser.php
Check if everything is right with nginx:

Code: Select all

nginx -t
And reload it:

Code: Select all

service nginx reload
Regardless of whether debug is set to true or false, the following header is present:
  • X-Rocket-Nginx-Serving-Static: Did the configuration served the cached file directly : HIT, MISS, BYPASS. This will add the following headers to your response request:
  • X-Rocket-Nginx-Reason: If serving static is not set to "HIT", what is the reason for calling WordPress. If "HIT", what is the file used (URL).
  • X-Rocket-Nginx-File: If "HIT", what is the file used (path on disk).
Check out the following links for more information:
Attachments
autom2.png
autom2.png (149.56 KiB)
autom1.png
autom1.png (50.95 KiB)
Tags:
caching
nginx
optimization
wordpress
Top
Post Reply

Return to “WordPress”