David Hayden [MVP C#]

I have been writing a series of blog posts, which I have coined High Performance ASP.NET Websites Made Easy!  There is no rhyme or reason to the order of these posts and certainly can be read in any order:

• Developing High Performance and Scalable ASP.NET Websites
• Avoid Chatty Interfaces Between the Tiers in Your ASP.NET Web Application
• ASP.NET Page Profiling - Page Tracing - High Performance and Scalable ASP.NET Websites Made Easy
• Web Applications: N-Tier vs. N-Layer - Benefits and Trade-Offs
• Query Analyzer - Sql Server Database Indexes and Execution Plans

The premise behind the ideas presented in these posts are that they must be 1) Dang Near Effortless, 2) Require Very Little Expertise, 3) Leverage Built-In .NET Features or Tools, 4) Easy to Maintain, and 5) Offer Decent Bang For Your Buck

Speeding Up ASP.NET Pages

Speeding up ASP.NET Pages can be done in several ways.  Below are 3 categories that come to mind and are not complete by any means:

• Reduce Page Processing:  Eliminating PostBacks, Caching Output, Avoiding Chatty Interfaces, Avoiding Web Controls
• Reduce Page Sizes: Limit sizes of ViewState, HTML, JavaScript, and Images
• Improve (Faster) Page Rendering: CSS instead of Tables

Reduce Page Processing

We talked about reducing page processing by short-circuiting the HTTP Pipeline by using ASP.NET Caching.

By caching entire pages or usercontrols, you can eliminate quite a bit of processing done on the page and its controls.  In fact, if you do entire page caching, HTTP Headers are sent in the HTTP Response that tells the proxy server and browser it is okay to cache the page, which may keep your web server from being hit by future requests of the same page.

An additional tip to reduce page processing is to avoid web controls all together.  Don't use ASP.NET web controls for static information.  Stick to the generic HTML controls that we all knew and love before ASP.NET was ever invented.

An old solution packaged with a new name, AJAX, eliminates entire page postbacks, which also reduces page processing.  I recommend being careful with this as too much AJAX can be a maintenance headache and is certainly not effortless.

Reducing Page Sizes

A very simple and effective way of increasing the performance of your ASP.NET application is to reduce the page size.

ASP.NET aside for a moment, the less HTML being streamed back to the browser the faster the page.  You want to reduce the amount of HTML, the size of images, the size of javascript files, etc.

A note about image sizes.  At the Tampa Code Camp, someone thought that changing the width and height attributes of an image caused ASP.NET to reduce the size of the image being streamed to the browser.  This isn't the case.  The height and width settings on an image are for display purposes only.  If you have a 640 x 480 image, the entire image will be streamed to the browser even if you are only displaying 100 x 100.  Better to open up your favorite image editor and reduce the image to 100 x 100 for faster performance if it makes sense.

Although I wouldn't recommend it unless absolutely necessary, you can download free tools that will compress / eliminate the white space in HTML and javascript files.  This could be a maintenance nightmare.  You may want to checkout IIS plugins that will do it for you without physically changing your source files.

Specific to ASP.NET, you want to be careful about the size of your ViewState.  Turn-off ViewState on controls if you can, especially on DataGrids, Repeaters, DataLists, and GridViews that tend to be huge if not kept in check.  The most effortless idea here is that ASP.NET pages that don't postback to themselves don't require a ViewState.  Turn off ViewState altogether on those pages.

Improve (Faster) Page Rendering

Using CSS instead of tables will cause the browser to render your pages faster.  Boy I love tables, but I have been slowly trying to get better and better at using CSS to layout my pages.

I am not an expert on this subject, so I point you to an interesting tutorial on CSS and the benefits of using it over tables:

• http://www.hotdesign.com/seybold/index.html

Conclusion

To speed up you ASP.NET Pages, you want to look at a minimum of 3 things:  1) Reducing Page Processing, 2) Reducing Page Sizes, and 3) Faster Page Rendering.  Much of the page processing time can be reduced using tricks we mentioned before, such as caching, eliminating chatty interfaces, and preferring HTML tags over ASP.NET web controls.  Page sizes can be reduced by reducing the file sizes of HTML, images, javascript, and the ASP.NET ViewState.  For faster page rendering, use CSS to eliminate tables to improve performance.

Resources

Various articles of interest:

• Ten ways to speed up the download time of your web pages on CodeProject:
• Lay out your pages with CSS, not tables
• Don't use images to display text
• Call up decorative images through CSS
• Use contextual selectors
• Use shorthand CSS properties
• Minimise white space, line returns and comment tags
• Use relative call-ups
• Remove unnecessary META tags and META content
• Put CSS and JavaScript into external documents
• Use / at the end of directory links
• Improving ASP.NET Performance on Patterns and Practices
• 10 Tips for Writing High-Performance Web Applications

Drinking:  Gyokuro Green Tea

Listening To:  Sandstorm by Darude