Are you managing an international-based brand-serving customer all over the globe? Then, using a Content Delivery Network (CDN) is the best idea. CDNs are a well-known technique to manage high-traffic websites. It is commonly used to distribute static assets such as images, CSS, and JavaScript as quickly as possible to the nearest location of the customers, which decreases the download times of the website.
The modern CDNs have much more to offer than just serving the assets to the customer. Currently, they improve the user experience with optimized HTML output, merging and deferring JavaScript, TCP optimization, and much more. Basic or advanced security is also top-of-mind, such as (D)DoS protection, SSL, Web Application Firewall (WAF), and much more.
For this recipe, we will use a Droplet created in Chapter 2, Magento 2 System Tools, at DigitalOcean, https://www.digitalocean.com/. We will be using NGINX, PHP-FPM, and a Composer-based setup including sample data connected to the CloudFlare CDN. No other prerequisites are required.
For the purpose of this recipe, let's assume that we need to create a Magento 2 Varnish setup. The following steps will guide you through this:
Changing your records in this screen will not change anything in production yet. We still need to adjust the primary and secondary Nameservers before everything works. We will do this as shown in the following screenshot:
Depending on your current DNS provider, this could be a simple or hard step. Changing the Nameservers is not always allowed by your provider.
You can check your e-mail or refresh the CloudFlare dashboard to check whether your domain is Active:
Once the cloud is orange, including an arrow passing through, then you are connected. Click on the cloud icon to change it:
dig yourdomain.com NS +short
The output looks as follows:
root@mage2cookbook:~# dig mage2cookbook.com NS +short rocky.ns.cloudflare.com. kate.ns.cloudflare.com.
You can also use the following command to check the IPs:
dig yourdomain.com +short
root@mage2cookbook:~# dig mage2cookbook.com +short 104.18.56.216 104.18.57.216
Let's recap and find out what we did throughout this recipe. In steps 1 through 9, we installed CloudFlare as a CDN to optimize our worldwide performance.
In steps 1 through 8, we created an account and moved our domain to the CloudFlare DNS. In step 7, we activated the orange cloud in DNS to start using the CDN optimization.
If you are interested in how to test the performance of the CloudFlare setup, stay put. Here are some basic commands that you can use:
time curl --I http://yourdomain.com
The output looks as follows:
time curl -I http://mage2cookbook.com HTTP/1.1 200 OK X-Magento-Cache-Debug: HIT Server: cloudflare-nginx CF-RAY: 257330a8444d2bd6-AMS real 0m0.198s user 0m0.006s sys 0m0.005s
Without CloudFlare, it looks as follows:
time curl -I http://mage2cookbook.com HTTP/1.1 200 OK X-Magento-Cache-Debug: HIT real 0m0.253s user 0m0.011s sys 0m0.010s
Keep in mind that this current website is using Varnish. Our Magento 2 server is located in New York while our test server is located in Amsterdam. As you can see, in this test, we save 0.055s
. This test is done from server to server. Doing a test from server to real browser clients on a desktop, or mobile device, will result in larger numbers. Larger numbers result in slower connections, which will result in lesser user experience.
Another great load testing tool is Siege. Using Siege helps you to understand how many concurrent clients can visit your website during high loads. We will just cover the basics of Siege here. Install Siege on another Droplet somewhere else in the world. Use the following command to install Siege:
apt-get install siege
Now let's run the following command. We will simulate 50 concurrent users for a period of three minutes. The –d
option is the internal delay, in seconds, for which the users sleeps:
siege -c50 -d10 -t3M http://yourdomain.com
Without CloudFlare, the output looks as follows:
siege -c50 -d10 -t3M http://mage2cookbook.com Transactions: 1732 hits Availability: 100.00 % Elapsed time: 179.79 secs Data transferred: 15.47 MB Response time: 0.18 secs Transaction rate: 9.63 trans/sec Throughput: 0.09 MB/sec Concurrency: 1.71 Successful transactions: 1732 Failed transactions: 0 Longest transaction: 0.34 Shortest transaction: 0.15
With CloudFlare, the output looks as follows:
siege -c50 -d10 -t3M http://mage2cookbook.com Transactions: 1716 hits Availability: 100.00 % Elapsed time: 179.74 secs Data transferred: 14.05 MB Response time: 0.10 secs Transaction rate: 9.55 trans/sec Throughput: 0.08 MB/sec Concurrency: 0.96 Successful transactions: 1716 Failed transactions: 0 Longest transaction: 0.62 Shortest transaction: 0.08
In the last test, we can see that the Response time is 0.10 seconds compared to 0.18 seconds.
The test Droplet that we used was located in Amsterdam using two CPUs and 4 GB memory. For a real browser test, it is best to use tools such as Chrome developer tools. Those timings are more accurate and give you a better idea of the real user experience. Testing on a mobile device is a totally different ball game and is out of the scope of this book.
18.219.236.70