The Sudden Realization... My Web Site Takes Forever To Load!

Well maybe not forever, but slower than Google's recommended 2 seconds or faster.

Automated Results has been adding more interactive and dynamic functionality to our customer's Sitefinity implementations and page load speed has suffered for it... sometimes with horrific results (ex. 12 seconds for the initial load... yikes!!!!). With Google evaluating our page speeds and clients on slower connections, we needed to understand and control the page load speed. Over a 2 month period, we kept coming back to page load speed and each time found one more piece to the puzzle, which resulted in incremental improvements. When we figured it out for one website, we implemented it on our other Sitefniity implementations.

I've been programming for 33 years and one philosophy that has done well for me is to program for ease of maintenance first and performance second. That sounds backwards to most programmers, but if you consider where your major costs are over the lifecycle of an application, ease of maintenance is the most important factor. Hell, that's why you got Sitefinity in the first place isn't it... to make it easier for you and your end-users to maintain their websites!

Page load speed can be jeopardized when 'easy to use' modules are employed

At Automated Results, we have developed a detailed Sitefinity implementation plan that describes what Sitefinity or custom functionality is utilized for each specific website feature (ex. Custom Rotating Lists for Testimonials, Generic Content for Articles, Custom Image Gallery using Sitefinity Image Libraries for photo presentation, Control Views with Generic Content and Search Indexing for reference library reading, etc, etc). All of the features utilize some form of a Sitefinity module for the sole purpose of 'ease of maintenance'.

However, on some of the features we went too far. We implemented a feature rich Sitefinity module that negatively impacted page performance when the added functionality was not needed. So we had to measure the impact on page load against the benefits of using a particular module and either change the configuration of the module or replace it with standard HTML. One example of this was the Image Gallery with the ability to view a larger image in a pop-up window. In retrospect, the web user would never think to have clicked on images to make them bigger, so it wasn't needed. The page load performance was significant enough for us to revert back to standard HTML.

In another case, we found a great image gallery that was powered by JQuery and its own set of javascript and style sheets. We loved the look and feel, but we got good and bad feedback on its use... Viewers loved the sliding of the images, animated transitions, and the general look of the gallery, but that complained about the page load time even though the rest of the page loaded first and the gallery loaded as they reviewed the page. We didn't abandon the nice gallery, we just moved it off the home page and provided a link to it so users could opt to look at it vs. being forced to view it.

So How Do You Resolve Feature vs. Performance?

It's a continuous learning process to understand performance and the cost of features. In general, you make the home page and landing pages load fast, even if it means using conventional HTML in a Generic Content block instead of a module, 3rd party offering, or custom control, then you provide the feature rich pages that are easy to maintain on the pages a visitor opts to view.

Below is a detailed example of what we tested and how we improved our page load speed with Sitefinity websites.

Before We Made Any Improvements

We performed lots of comparisons:

• Sitefinity .Net websites against non-Sitefinity .Net websites (our Sitefinity pages were 100% slower)
• Our home page against the Sitefinity home page: www.Sitefinity.com (The Sitefinity home page loaded in 3 secs)
• One web server against another (we added memory when we discovered the 'newer' server was slower because of the # of websites)
• .Net websites against PHP websites (PHP was generally faster by 30%)
• Pages with Sitefinity Lists vs. straight HTML (HTML was 5% faster)
• Pages with a Sitefinity Image Gallery with 4 hyperlinks to see a bigger 550px picture vs. straight HTML (HTML was 38% faster)
• Pages with a Sitefinity Image Gallery with 4 hyperlinks to see a bigger 250px picture vs. straight HTML (HTML was 17% faster)
• Pages with Sitefinity Image Library images vs. file directory images with a memory starved web server (Image Libraries were 30% slower)
• Pages with Sitefinity Image Library images vs. file directory images with sufficient memory(Image Libraries were 2% faster)
• Pages using JQuery aesthetic features vs. plain HTML (JQuery usage made the page load slower by 18% )

So What Did We Change?

• Added more memory to the web server to speed up database requests
• Enabled Static and Dynamic Compression in IIS7 to speed up text
• Enabled Script Resource Caching in web.config to speed up script loads
• Replaced Sitefinity Image Galleries with standard HTML hyperlinks to Sitefinity library images
• Replaced Sitefinity Lists with standard HTML hyperlinks to internal web pages

How Did We Make The Changes?

IIS7 Changes

We've read up on IIS settings and made sure the static and dynamic compression options for the website were enabled for a 50% improvement in page load speed.

The tool that we use for this is a free website: http://www.webpagetest.org that provides a high level of detail about a given page load and subsequent page loads.

Web.config Changes

We set the script and compression caching attributes to True; by default, they are false.

Page Level Changes

We looked at the 'More Options' section of the Sitefinity Page Properties tab for each page and experimented with Page Caching and View State. We found that it was significant to enable Page Caching, so we've enabled that on all web pages. At times, based on a review of the page source, we found a large viewstate block that we wish we could avoid, but disabling viewstate breaks the RADMenu control, so we have to leave the viewstate enabled on every page.

If you don't want to go through every page, you can do it in an SQL statement:

Additional Static Content Compression: More Javascript Extensions

The compression scheme in IIS7 is enabled by default, but it maps only a single javascript mime type to be compressed, application/x-javascript. Adding the line above tells IIS to give all your .js files that mime time, which in turn makes the compression work.

<system.webServer>
    <staticContent>
        <remove fileExtension=".js" />
        <mimeMap fileExtension=".js" mimeType="application/x-javascript" />
     </staticContent>
</system.webServer>

CDN: Take Advantage of global resource sharing in the Cloud

One further step towards additional compression and faster script load times can be attained by pointing to the Telerik CDN which is published on the Amazon CloudFront. These resources are distributed througout the world so the content is served up closer to your web user as well as providing multiple domains for parallel requests. The content utilizes GZIP compression and load balanced server and allows for parallel requets for faster load times. You implement it by adding the following lines in your AppSettings section of the web.config file:

Learn more at: The Power of Telerik CDN

Also learn more in general about designing a website for fast loads

So What's next? What haven't we thought of?

We have done a fair amount of work on page load performance, but I'm sure Telerik could teach us a thing or two and so can you.... please please comment on what you've found and share with us the settings and trade-offs you've made on your Sitefinity implementations. Let's give everyone a chance to beat their competition on the web!

We'll keep monitoring and comparing over time to figure out how to get the fastest web page that is still easy to maintain. Whatever we find, we'll post on this blog, so sign-up for the RSS feed, come back to visit us, drop us an email, or give us a call at 828-862-6667 x300!