Now that you have installed CloudFlare, you can test you site’s performance at Pingdom, which I mentioned at the beginning of the article, http://tools.pingdom.com/fpt/. Or you can just look at some of metrics.

The following is my site before CloudFlare and W3TC:

The first test took 7.59s for some reason, which I count as an aberration. Most of my load times were under three seconds without the CloudFlare/W3TC combo. This is due to my practice of using sprites, heavily compressed images, and vestigial memories of building sites when people still had 56K modems (some of you may know what I’m talking about). The result is that I’m paranoid about load times and tend to keep very simple sites, even when using CDNs and other performance improving technology.

Now let’s compare the baseline scores with the site after CloudFlare/W3TC:

As you can see, things have significantly improved. My page loads are generally taking place below two seconds. In real life this performance will be increased. We are not seeing the true benefit of the CDN because I have artificially constrained the page loads to a server from New York City. However, the reason I have run these test is to show the improvement in requests and page size. Notice that certain HTTP requests have been combined to reduce their number from 28 to 20. Even more impressive, the page size has decreased by 135.4kB due to compression. Our multi-pronged attack on page loading time is yielding tremendous benefits.

But that’s not all. If we navigate to https://www.cloudflare.com/analytics, we can find further statistics on page loading. I measured the performance of my site for six days. You can see the results below:

Notice the first chart shows regular traffic in green and threats in red. CloudFlare was actively able to detect these threats and deal with them. We can see that most threats originate from USA, Turkey, Germany, China, and France. CloudFlare also provides helpful information on how much it has helped your site speed. In total, it measured a 53% savings in HTTP requests and a 46% savings in bandwidth. Now, according to Pingdom, there are roughly a 39% savings in HTTP requests and a 46% savings in bandwidth. So, it appears that the bandwith savings are accurate, but there seems to be a discrepancy in the HTTP requests savings of roughly 14%. I do not know what this discrepancy could be caused by, particularly since I do not know how CloudFlare is measuring their metrics. Perhaps they are measuring some of HTTP requests saved by blocking threats. I simply do not know.

Conclusion

CloudFlare makes bold claims, when it states that, on average, it can help sites load twice as fast, use 60% less bandwidth, have 65% few requests, and be way more secure. But, from the above tests, you can see that this is not unrealistic marketing hype. While my site fell just short of the marketing claims, it is likely that many sites will meet those claims because of the fact that each site is unique. Additionally, this was just a basic analysis. Extra performance tweaks in W3TC and a better hosting plan could make a very large difference in load times. There is no reason to believe that the marketing claims are false.

If you are not currently using CloudFlare with W3TC, you are doing your site and your visitors a disservice. These are free tools that will lead to a safer and faster Internet.

CloudFlare analytics

Getting to Know CloudFlare

Content Delivery Networks (CDNs) have become one of the hottest trends in the Web development industry. They allow content to be pushed from the cloud at rapid speeds. In Part I of this article, you will find out how to set up CloudFlare, a free CDN, with the W3 Total Cache plugin (W3TC), which is also free. In Part II, you will see real-life performance metrics of this combination taken from my personal site.

CloudFlare is both a Content Delivery Network (CDN) and a novel way of securing your site. As you probably know, CDNs are distributed servers that contain cached versions of your site. When a user agent makes a request to display your site, the server that is physically located closest to the user agent will display this cached content. There are currently 14 CloudFlare servers spread around the world, with the network constantly growing. You can see where the servers are located, here: http://www.cloudflare.com/network-map.html.

CloudFlare is unique in that it is not just another CDN. It also offers active security to protect your site from things like Distributed Denial Of Service (DDOS) attacks, comment spam, malicious user agents, and host of other nasty security issues. The way it does this is by learning about new attacks and spreading that information to the rest of the CloudFlare community. If one site is attacked, CloudFlare will block that attack, and then spread knowledge of that attack to other sites so that they cannot be attacked in the same way.

CloudFlare boldly makes the claim:

“On average, websites on CloudFlare load twice as fast, use 60% less bandwidth, have 65% fewer requests and are way more secure.”

We shall find out if this is true or not. If you want, you can head to http://tools.pingdom.com/fpt/ to get some baseline statistics for your personal Web site before starting the tutorial. After the tutorial, you will be able to make a comparison with your newly optimized site.

Signing Up

You can sign up for CloudFlare at, here: https://www.cloudflare.com/sign-up. You will receive an email welcoming you to the service. Now, you will need to enable CloudFlare for your Web sites: https://www.cloudflare.com/my-websites.html. List your domain and click the “Add this website” button.

Signing up for CloudFlare

You will soon receive an email giving you new name servers for your site. You will eventually replace your existing name servers with the new name servers. But before we do that, I want you to get your IP number for your site. I have found that after changing existing name servers to the CloudFlare servers, it can be difficult to log into cpanel or FTP files to your server. Fortunately, this is easy. Simply go to http://www.intodns.com/ and enter your domain name. After you change your name servers, you can access your cpanel with the IP. For example, you would use “55.555.55.55/cpanel” instead of “johnsrandomdomain.com/cpanel”. Of course, you would use the “55.555.55.55″ IP for your Host with your FTP settings, as well.

Changing the Name Servers

Every host is different, so if you don’t know where to insert the name servers for your host, you will have to shoot their support an emall or find it in their FAQ. I use WPWebHost, so I simple log in and view “My Domains”. Then I choose the domain that I want and click “View Details”. Then I replace the existing name servers with the ones that CloudFlare gave me.

Entering the Name Servers

Once again, you will need to figure out where your name servers are located if your host is different than WPWebHost.

Setting Things up on the WordPress Side

W3TC is the free WordPress plugin that works seamlessly with CloudFlare to speed up your site via GZipping, minifying, and caching. You will need to download this plugin, which you can find, here: http://wordpress.org/extend/plugins/w3-total-cache/. Once you have installed, and then activated this plugin, a new tab called “Performance” will be set up at the bottom of the left-hand navigation menu. Upon clicking the “Performance” link, a seemingly bewildering collection of options will be shown. Don’t be intimidated, there are only a few settings I’m going to touch right now. You will want to enable Page Cache, Minify, Database Cache, Object Cache, and Browser Cache, all at their default settings. These are good enough, for now, especially if you only have a basic hosting plan.

Now, on the same page, scroll down to the section titled “Network Performance and Security powered by CloudFlare”. This is where you will enable CloudFlare. Enter your account email and domain name. You will also have to enter your API key, which you can find by clicking on the “find it here” button. Make sure development mode is off and click “Save all settings.”

Setting up CloudFlare through W3TC

Now, CloudFlare is set up and your performance statistics will immediately improve! But, we need to set up one more plugin.

There is a special plugin for WordPress called “CloudFlare” that, strangely enough, helps CloudFlare work with WordPress. It is located, here: http://wordpress.org/extend/plugins/cloudflare/. Fill in the fields and click “Update options”.

Enabling the CloudFlare Plugin

Once installing and activating this plugin, any comments that you designate as spam will be sent to CloudFlare to prevent those comments from appearing on other blogs in the CloudFlare network. If your hosting plan allows it, you can also click the “Run the optimizer” button to optimize your database. If you have a basic hosting plan, you will not be able to optimize the database and you will receive the following message,

“The current user does not have the permission ‘manage_database.’”

This is just a warning; it does not mean anything is broken, so don’t be concerned.

Celebrate

That’s it. You have just installed CloudFlare and W3TC on your site. Look out for Part II of this series, where you will see if CloudFlare is worth the hype.

Join the Austin Adobe User Group’s March 9 meeting when Eli McMakin will demonstrate his Optimized Photography Workflow using Bridge, ACR (Adobe Camera Raw) and Photoshop CS 5.5. He will aggregate the RAW files in Bridge, tweak them nondestructively in ACR, and output them through Photoshop. He will demonstrate best practices for a photographic pipeline and show how to decrease time spent fixing photos on the computer so that you can spend more time making money.

The event will be held from 1:15pm to 3:30pm at the New Horizons Computer Learning Center.

Philosopher/Poet Christopher Wallace

Humans used to have problems. Real problems: our dinner could be dangerous and was difficult to find and catch; the remedy to disease was to take some herbs and pray to the gods that sickness went away; and disputes were often settled with bows and arrows. Turn your pagers to 2012. Our basic needs have been met. There is so much food that the government pays farmers not to grow crops. Third-world diseases, like dysentery and cholera, have been replaced with first-world diseases, like diabetes and heart-failure. And disputes can be resolved by a gavel. As the great philosopher-poet, Christopher Wallace, once said, “Things done changed.”

Well, most would say that things done changed for the better. And yet, we still face major challenges. For example, pollution from industrialization is bad for the environment and human health. It is estimated that tens-of-thousands of people die from the carcinogens released from tail-pipes and factory smoke-stacks. However, these are not real problems. Hold on, let’s clarify – these are not problems we have evolved to face. These are not problems where we are battling a saber-tooth tiger with a spear in one hand while bathed in the light of a flaming torch in the other hand. Many of the major issues we face today are those caused by, humans – that is to say, the problems are artificial.

As a society, we already have a logical understanding of how to solve our artificial problems. For example, the previously mentioned pollution problems can be greatly ameliorated by a floating-rate gas tax that would gradually increase over time. This tax would establish a target-price for gas prices. The price of gasoline on the open market would still fluctuate, but the shocks would be tempered by the target rate. If the market rate ever somehow exceeded the target rate, the tax would fall to zero.

The advantages of a floating-rate gas tax are numerous:

• The expectation of rising costs would incentivize consumers to buy fuel efficient cars and incentivize researchers to develop technology to improve energy efficiency.
• Consumers would drive less and travel with others more, thereby reducing traffic-jams and travel time for commuters.
• Tax money could be used to pay for roads, bridges, and other infrastructure assets.
• Knowledge of future prices would allow businesses to fix their transportation-costs, allowing more, and smarter, business investment.
• Negotiating power with other countries would increase due to greater US energy independence.
• There would be a drastic reduction in pollution.

Unfortunately, there would be one small disadvantage:

• The average cost of gasoline would increase slightly.

This point is so significant, that it overrides all logical thinking. We already subsidize gas by paying for it in time lost to traffic jams, increased sickness from carcinogens, and environmental damage. But the floating-rate gas tax would never receive approval. Even the proposal of gasoline taxes would spark fierce resistance and even death threats. Why? The crux of the problem is that humans want things for free. They want infinite goods and services in a world with finite resources. They want a Ferrari for the price of a Taurus.

This guy had to work for food.

This is the cause of some major crises in first-world countries. From the debt crisis in Greece, to water shortages in the southern US, to the worldwide financial crisis of 2008 – all of these problems are caused by the desire to get something without paying for it. The solution to these problems should be simple. We know how the free-market works. We know that correctly pricing goods and services is the most efficient way to allocate resources. And yet, the drive to get something for nothing is so tempting, it consistently propels us towards avoidable crises.

“There’s no such thing as a free lunch.”

—Milton Friedman (Somewhat successful economist)

The new site is runs on the WordPress platform. Now I can log in to my site from any Internet enabled device and make updates or upload my stuff. Widgets automatically inject my Twitter feed into my site, and also allow viewers to see a link to my latest posts in the sidebar. Everything is much more dynamic, which saves me time when I’m updating my blog.

I have also decided to move my galleries from Flash to jQuery. While I liked the reliability and interactivity of my galleries in Flash, I was restricted to using smaller photos. Additionally, the Apple’s unwillingness to support Flash on some of its products hurt the usability of the site. That is no longer a problem with the JavaScript galleries and I hope those of you with iPhones and iPads will enjoy my work.

So, what do you think of the refresh?