Key Takeaways
- Cloudflare, born from Project Honeypot, is a provider that offers DDoS detection and protection, reducing server strain and speeding up websites. It also provides the Always Online option, which serves a limited version of a website in case of origin server outage.
- Setting up a site with Cloudflare is straightforward and requires registering a new website on their platform. All existing domain records set up with the domain registrar or hosting provider need to be moved/copied to Cloudflare.
- Cloudflare offers free unmetered DDoS protection, along with sophisticated tools that protect websites on an infrastructure level before malicious traffic even reaches it. Premium tiers offer even more options for website security.
- By default, Cloudflare provides caching of static content and allows users to set rules for cache expiration. Paying customers have access to the Railgun feature, which speeds up dynamic content delivery from the origin server, and image compression/optimization for the Pro plan.
Cloudflare is an industry leader in the content-delivery space, reducing load and speeding up millions of websites.
What is peculiar about this provider is that it didn’t start as speed-up/performance tool, but was instead born from Project Honeypot, which was conceived as a spam and hacking protection service. To this day, this is one of Cloudflare’s major selling points: DDoS detection and protection. Their algorithms take note of visitors’ IP addresses, payloads, resources requested, and request frequency to detect malicious visitors.
Because it sits as a proxy between websites and all incoming traffic, Cloudflare is able to reduce strain on servers significantly, so much so that DDoS attacks won’t even reach the origin websites, as explained in this introduction. Cloudflare also provides the Always Online option, which caches a version of the user’s website and serves a limited version of it in case of origin server outage — when the original website returns 5xx or 4xx errors. It also features a full-fledged page cache.
These features can be a huge advantage: they can salvage a struggling web server under heavy load, and in case of server errors, can give some breathing room to developers to figure things out.
It’s also available free. There are premium tiers, of course, and there are things (like additional page rules) that require paying, but the scope of Cloudflare’s free tier alone makes it worthwhile to learn its ins and outs.
Comparison benchmarks put Cloudflare somewhere in the middle in regard to speed, but it would be hard to argue that it is the best value CDN on the market.
Setting Up Cloudflare
Setting a site up with Cloudflare is very straightforward. After registering at (cloudflare.com)[http://www.cloudflare.com], we can add a new website. While the system scans for the given domain’s IP and other details, we’re offered an introductory video. Upon completion, we’re given new nameservers to set up with our registrar.
We need to register these nameservers with our registrar and wait for changes to propagate across the internet. It may take up to 24 hours.
This change means giving all control over our domain to Cloudflare. This also means that, if we have email on this domain (MX records), we need to transfer these records to Cloudflare. If we have any subdomains, they also need to be set up as respective A records in Cloudflare’s dashboard.
All existing domain records set up with our domain registrar or hosting provider need to be moved/copied to Cloudflare.
Some managed hosting providers may simplify/automate this transition process even more.
For each of our domain records, we can decide to simply let all the traffic pass through directly to our servers — which means we can set exceptions for certain subdomains — or we can turn off all Cloudflare functionality — for example, while we’re making some changes on the website.
Once we’ve set the domain up, that’s basically all the work required outside of Cloudflare’s dashboard. There’s nothing more to do on the website itself, or the origin server. All further tuning is done on the Cloudflare website.
Setting up Encryption
An SSL certificate is part of the free plan on Cloudflare. There are four options for SSL setup, and we can find them under the Crypto tab in the dashboard.
- OFF – this is self-explanatory. All traffic will be redirected to unsecured protocol (http)
- FLEXIBLE – regardless of the protocol of our server, and whether we have an existing SSL certificate on it or not, Cloudflare will serve all our pages to end-visitors over https. Connections from Cloudflare to the origin server will go over an unsecured connection.
- FULL – Cloudflare will communicate to your server via https, but won’t validate certificates on the origin. Traffic from Cloudflare to visitors is served over https.
- FULL STRICT – Cloudflare will require valid (not self-signed) SSL certificates on the origin server. Traffic from Cloudflare to visitors is served over https.
With these settings, we need to make sure the setup is sensible because we have two layers between our end users and our server content, so omissions here can result in a redirect loop, or too many redirections which can end up slowing the website.
Cloudflare also offers the option to buy a custom certificate, and for premium users who require extra safety or care about their market image, it gives the option of uploading custom/premium certificates. This is a part of premium plans.
Securing the Website
This is one area where Cloudflare shines: it gives unprecedented value for free. Across the hosting landscape, DDoS protection is a premium service, and not always provided, even for paying customers.
Cloudflare offers unmetered DDoS protection on the free tier, together with some other, rather sophisticated tools that protect websites on an infrastructure level before malicious traffic even reaches it. It offers rate limiting — throttling of visits according to user-defined, customizable rules. It offers smart firewall rules, country blocks, browser integrity checks, captcha protections, and more.
Today, when botnets rule the internet and freshly installed websites or servers are sometimes drowned in brute-force break-in attempts within minutes of going online, when spammers automatize web comments, and referrer spam is rampant even without any break-ins, POST attacks and slow attacks utilizing unorthodox means are not rare. This kind of protection can make or break smaller- or medium-sized websites.
There’s also scraping protection, denying certain resources to certain visitor profiles, or obfuscating emails.
Premium tiers offer even more options.
Speed and Performance
By default, with Cloudflare we get caching of static content — JavaScript, fonts, stylesheets, even images. We can set rules for cache expiration. For various CMS systems, there are plugins that can connect to Cloudflare so that we can purge the cache from within our website.
These static resources are “taken over” upon DNS setup by Cloudflare’s infrastructure, and are then served from its network of data centers across the globe, depending on the visitor’s location.
Resources can be cached (or fetched from origin) depending on query strings, or on cache headers set by our origin server. For example, in PHP we could set cache expiration like this:
header('Cache-Control: max-age=3600');
If this isn’t enough, we may need to remove Pragma, Expires and Cache Control headers:
header_remove('Pragma');
header_remove('Expires');
header_remove('Cache-Control');
We can also do this on the server level. In nginx, we would set these rules up in a virtual host block/file:
if ($http_cookie ~* "some-cookie") {
#removing headers that stop Cloudflare cloudflare from caching
more_clear_headers 'Pragma';
more_clear_headers 'Expires';
more_clear_headers 'Cache-Control';
add_header Cache-Control "no-cache, no-store, max-age=0";
}
location ~* "(!?.*some-url-path.*)" {
#removing headers that stop Cloudflare cloudflare from caching
more_clear_headers 'Pragma';
more_clear_headers 'Expires';
more_clear_headers 'Cache-Control';
add_header Cache-Control "max-age=3600";
}
Apache users would put something like this in their .htaccess
file:
<IfModule mod_headers.c>
Header unset Pragma env=LONGCACHE
Header unset Expires env=LONGCACHE
Header set Cache-Control "max-age=3600" env=LONGCACHE
</IfModule>
Obviously, some-cookie and some-url-path above need to be replaced with proper values. These rules are also needed for page caching, mentioned below.
We can choose to minify our CSS, JS and HTML. There’s an option to leverage AMP for outgoing AMP links. There’s also a beta feature Rocket Loader that bundles and serves JS asynchronously, using the browser’s local storage to cache it. Be careful with this, though, because small mistakes in the order of loading of resources can break your website.
Paying customers have the Railgun feature available, which addresses the main pain point of caching systems — dynamic content. It tries to speed up dynamic content delivery from the origin server. It requires software installations on the origin server, and works through compressing of delivered content and “maintaining a single persistent connection for multiple simultaneous requests, eliminating network connection latency“. This is reminiscent of the multiplexing feature of the HTTP/2 protocol — only here, between the origin server and Cloudflare.
There’s also image compression/optimization for the Pro plan, in Polish and Mirage mechanisms. Under the Traffic tab, there are Argo route optimization across Cloudflare’s data centers across the globe, and load-balancing options.
Full-page HTML caching
Full-page caching means caching the whole output of our system — CMS, application, blogging system or anything else.
Under Page Rules, there’s a hidden gem that can transform your Cloudflare account into a full-fledged caching system that can compete with professional solutions like Varnish and — thanks to data centers over the globe — probably outperform it.
A Cache level rule set to Cache everything will cache the entire HTML content of the website, along with all other resources.
By ordering these rules, we can achieve complex caching/exclusion solutions and deliver even dynamically generated content with minimum latency. 15x improvements in Time To First Byte (TTFB) are not unheard of.
These rules support wildcards, and need to be ordered by priority:
*some-website.com/static/*
[/static/ subdirectory for static HTML pages]
*some-website.com/*.shtml
[.shtml file extension to signify HTML that is static]
*some-website.com/*?*static=true*
[adding static=true query parameter]
If we combine this rule with a Bypass setting like in the next image, we can set apart sections of our website that need to be cached/omitted from the cache under different conditions — such as admin sections, etc.
If page cache is working, we should see CF-Cache-Status: HIT among our response headers in the browser’s inspector.
Paying customers have additional options of caching, or bypassing cache depending on a cookie. Here, cookie names can be set with wildcards, and content can also be cached depending on device type.
These rules are more sophisticated, and won’t be needed for every type of website. Free customers have three page rules available, but additional ones can be purchased.
HTTP/2 and server push
Browser inspector shows parallel, asynchronous loading of resources on HTTP/2 protocol
By default, free and enterprise customers get HTTP/2 turned on — a big improvement over HTTP/1.1 protocol — which includes:
- multiplexing – multiple resources can be sent within a single connection, in an asynchronous way
- header compression
- server push – server predicts requests for resources, and sends them before the browser even requests them.
While recognizing the need to judge the improvements and value of Cloudflare on a per-case basis, it’s fair to say that, in general, the value that Cloudflare provides (particularly its free tier) sits solidly above average.
Conclusion
This article has covered how to use and configure Cloudflare with a website to make it fast, reliable, and DDoS proof. That’s not to say that a CDNed site is impenetrable. In fact, it brings new vulnerabilities to the table.
When human error caused Cloudflare services to suffer in the case of the Swedish Telia network provider in 2016, it was a major issue for European internet. It’s estimated that Cloudflare services are used by 6.2 percent of the world’s top 1 million websites.
Infographic from Cloudflare’s post-mortem report of the Telia outage, when a misconfigured router rerouted a big part of European network’s traffic to Asia, resulting in packet losses.
Regardless, we shouldn’t fear CDNs because of incidents like these. They’re few and far in between, and contribute to the construction of a vastly more robust network in the end.
Frequently Asked Questions about Making Your Website Faster and Safer with Cloudflare
What is Cloudflare and how does it work?
Cloudflare is a web infrastructure and website security company that provides content delivery network services, DDoS mitigation, Internet security, and distributed domain name server services. It works by protecting and accelerating any website online. Once your website is a part of the Cloudflare community, its web traffic is routed through their intelligent global network. They automatically optimize the delivery of your web pages so your visitors get the fastest page load times and best performance.
How does Cloudflare make my website faster?
Cloudflare enhances the speed of your website through its content delivery network (CDN). A CDN is a network of servers located around the world that cache the static content of a site, like images and CSS/JavaScript files. When a user visits your site, the static content is delivered from the closest CDN server, reducing the load time.
How does Cloudflare protect my website?
Cloudflare protects your website from a range of threats including SQL injection, DDoS attacks, and cross-site scripting. It uses a range of security technologies including a Web Application Firewall (WAF), secure SSL, and a global CDN to protect your site.
What are the different plans offered by Cloudflare?
Cloudflare offers a range of plans to suit different needs. These include the Free plan, the Pro plan, the Business plan, and the Enterprise plan. Each plan offers different features and levels of support, with the Enterprise plan offering the most comprehensive set of features.
How does Cloudflare’s image optimization work?
Cloudflare’s image optimization feature, known as Polish, reduces the file size of images to improve page load times. It offers two modes: Lossless, which reduces file size without changing the image, and Lossy, which reduces file size by removing some image data.
How does Cloudflare’s mobile optimization work?
Cloudflare’s mobile optimization, known as Mirage, is designed to improve the performance of your website on mobile devices. It does this by lazy loading images, consolidating network connections, and serving appropriately sized images based on the device.
How can I set up Cloudflare for my website?
Setting up Cloudflare involves creating a Cloudflare account, adding your website to the account, and updating your domain’s nameservers to point to Cloudflare. Once this is done, Cloudflare will begin caching your site and serving it from their CDN.
What is Cloudflare’s Always Online feature?
Always Online is a feature that keeps a cached version of your website online, even if your origin server goes down. This means that visitors can still access your site even if there are issues with your hosting provider.
How does Cloudflare’s SSL/TLS encryption enhance website security?
Cloudflare’s SSL/TLS encryption protects data as it moves between your website and your visitors. This prevents third parties from intercepting and reading the data, enhancing the security of your site.
What is Cloudflare’s Argo Smart Routing?
Argo Smart Routing is a feature that improves the performance of your website by routing visitors through the least congested and most reliable paths using Cloudflare’s private network. This can reduce internet latency and packet loss, improving the user experience.
Tonino is a web developer and IT consultant who's dived through open-source code for over a decade. He's also a crypto enthusiast, Linux fan, and moderate libertarian.