CloudFront + Strangeloop = Greatly Reduced Page Load Time for Outrigger.com

Today we have a post written by guest blogger Alex Dunlap who is a Senior Manager on the AWS Team, responsible for Product Management for Amazon CloudFront and Amazon Route 53. And now to Alex…

— Jeff;

Over the last year, the Amazon CloudFront team has gotten several questions from customers on how they can combine a front-end optimization (FEO) solution with Amazon CloudFront to make their sites perform faster. While there are several FEO offerings out there that customers can choose from, weve recently been working with the team at Strangeloop to make it easy for CloudFront customers to use and add FEO to their sites that are hosted on AWS. Today, Jeff has given me this space to share with you the solution that the Strangeloop team has built for AWS customers.

Lets start by talking about what FEO is. FEO optimizes HTML to speed up page rendering, using practices such as compressing images, consolidating resources, rewriting object names, re-ordering when/how objects are rendered, re-ordering when scripts are executed, opening more concurrent browser connections, leveraging the browser cache, to name a few. When it is implemented correctly, FEO can make pages significantly faster. While FEO treatments can be implemented manually, this is considered a less-than-ideal solution. Its highly specialized work that also happens to be extremely time-consuming and somewhat delicate (manually rewriting HTML can break pages). This is also work that may have to be repeated each time you edit a page.

Strangeloop builds site acceleration solutions for global ecommerce websites and enterprise applications. Their product is called Site Optimizer. Joshua Bixby, President of Strangeloop, described Site Optimizer to me in these words: Site Optimizer is designed to transform FEO from a complex coding process to an automated function performed in real time by an intelligent system. It accelerates large, highly dynamic sites with high traffic demands by automatically optimizing billions of possible page permutations for millions of visitors, adapting in real-time to HTML changes so that pages are always as fast as possible, without breaking.

Today, Strangeloop announced a new version of Site Optimizer that is designed to integrate specifically with Amazon CloudFront. You set up the Site Optimizer service between your origin and your Amazon CloudFront distribution. Site Optimizer does its thing, optimizing the HTML pages themselves by rewriting them as needed — in the process creating a number of optimized resources (images/CSS/JavaScript/etc) that the rewritten pages will reference. Amazon CloudFront delivers all these optimized resources via edge locations that are closest to the actual end users. Amazon CloudFront shortens server round trips, and FEO reduces page requests and payload. Combined, the two solutions reduce page load times, allowing pages to render up to three times faster than unoptimized pages that do not use a CDN and FEO solution. Pricing is based on usage and you can learn more by contacting Strangeloop at the link included at the end of this post.

Heres how it works. Say were running the website www.example.com and we want to add both Site Optimizer and CloudFront to the configuration. Doing this is straight forward and can be done with the following steps:

1. Create your application or website say running at origin.example.com
2. Launch a Site Optimizer – say running at optimized.example.com
3. Point Site Optimizer at your application or website
4. Create a CloudFront distribution that uses optimized.example.com as a custom origin and uses www.example.com as a CNAME for your CloudFront distribution.
5. Configure your DNS to point your www.example.com domain at your distribution, and youre off.

On its way from your servers to an end user, data flows out of your origin and into Site Optimizer, where it is optimized. Then, CloudFront picks up the results and sends them on to your end-users via Amazon CloudFronts network of edge locations.

And it works. Outrigger Enterprises Group, an AWS customer already using the service, was able to cut page load times in half using Amazon CloudFront combined with Strangeloops Site Optimizer front-end optimization solution. While Outrigger chose CloudFront because of its ability to offer competitive content delivery at a lower price point than other CDN services, they combined it with the Strangeloop Site Optimizer to make their site even faster by making the structure of their site more efficient.

Dan Wacksman, Senior Vice President of Global Distribution, Outrigger Hotels and Resorts, says that Together, Amazon CloudFront and Strangeloop cut our page load times in half instantly for both mobile and desktop visitors, without requiring any changes to our site or servers.

If you are interested in learning more about combining Strangeloops FEO solution with Amazon CloudFront, please take a look at Strangeloops site to read more about the Strangeloop CloudFront integration or learn more about CloudFront at thinkwithwp.com/cloudfront.

Alex