How Cloudflare speed up and protect your website - Part 1.

You don't know what is Cloudflare ? So let's see how cloudflare make your website loading faster, and why you should already use it for all your websites.

1. ) Cloudflare DNS - Free & Fast

Cloudflare provide at first one of the best DNS hosting service available. And to make a website faster you can already start with using a fast DNS hosting.

DNS Provider Speed Comparison by solvedns.com

It's only few Milliseconds but as you can see, Cloudflare is faster than many other providers and most of them offer paid services only. So before paying few dollars for a Premium DNS package, you should try cloudflare. Another feature you will love, is a propagation time around 5 minutes when you edit a record on your DNS. So if you need to migrate your website soon, this is really a good reason to register now.

2. ) Cloudflare - Reverse Proxy with caching 

But cloudflare does not provide only DNS Hosting. It's also a complete solution to speed up and secure your website. For that when Cloudflare manage your DNS if you activate the optimization and security (orange cloud), instead of sending your server IP when a visitor make a DNS request, it will act as a proxy and all your visitors will view only the Cloudflare servers IP when they do a request.

And Cloudflare will not only act as a simple proxy, it will also cache all the static files and deliver them all around the World to your visitors from the nearest Cloudflare datacenter.

The result is awesome because it will make your website faster as it will handle less requests, and it will also save a lot of bandwidth by limiting the number of file requests.

As you can see, with 80 000 visitors per month, it's more than 20GB of bandwidth saved and also more than 20GB of static assets which have been delivered faster.

3) Cloudflare - Website Protection

By acting as a proxy Cloudflare also provide a complete security solution which include :

• Browser integrity check : Each visitor request is checked using the HTTP header and if a thread is found it can be challenged using a captcha or blocked.
• Visitor reputation : Cloudflare analyze daily thousands of IP, and if a visitor try several times to perform any form of hack, it will be marked as a potential thread for Cloudflare
• Page rules : You can use the page rules to allow or disallow access to a part of your website. For example with wordpress your can use a high level of secuirty onthe page  http://yourdomain.com/wp-login.php to protect your website.
• DDoS protection : As  your visitors have to use cloudflare servers to get access to your website,  they will never have access to your server IP and any attack attempt will simply be blocked by the Cloudflare servers. 

  

  But to protect totally your server, you have to be sure there is not any records which point directly to your server. The most common error will be to have a email server with a MX record pointing  on your server IP.  In this case, Cloudflare will not be able to protect your website because the attacker will send the traffic directly on your server IP, and will not have to use the Cloudflare proxy.

  4) Cloudflare - Website Optimization

  And if it wasn't enough, Cloudflare is also able to optimize your website. It can minify all your assets, including the html, reduce the number of connections, and with rocket loader it will make deliver your assets asynchronously. That mean instead of waiting for each file to be downloaded, with cloudflare your browser will download all the assets in the same time when you visit your website, and it will be up to 3x times faster.

  

  The last optimization tool available for free is Rocket Loader, currently in beta, it's a script used by cloudflare to deliver your assets, without blocking the page display. It use the asynchronous loading to load your javascript at the end of the page display and this way it will really improve your pagespeed score. But like any beta, it could create error with some javascript or break your website design by loading too late some assets.

  For this reason you have 2 mode to use Rocket loader :

  • Automatic : Rocket loader will optimize any javascript available on your website but you have the ability to forbid the optimization manually by adding  data-cfasync="false" before the script source.

  
  <script type="text/javascript" data-cfasync="false" src="/js/tether.min.js"></script>
  

  Manual : This time you will have to add data-cfasync="true" for each script you want to optimize with Rocket Loader

  I will complete this article with the HTTP2 and Cloudflare in the next few days.