While we do a lot to help you optimize RadControls in your applications, the Telerik community also does a great job of sharing optimization tips and tricks. One of the best list of optimization tricks ever produced by the community has
recently surfaced on the Telerik forums. Some of these ideas are specific to optimizing the RadControls, but many of them are great optimization techniques for ASP.NET in general. So without further ado, here are the "Top 15 Telerik Community Optimization Tips & Tricks" (in no particular order):
- Make sure browser caching is enabled
Many RadControls must load a fair amount of JavaScript to enable all of the client-side goodness that we love in our modern web apps. To make sure this JavaScript is only downloaded once (instead of on every page request), make sure your users enable caching in their browsers.
- Move ViewState off of the page
If you've got a lot of controls on your page and ViewState is enabled, chances are it is adding a lot of weight to the page. If turning ViewState off is not an option, you can greatly reduce the HTML sent to the client by moving ViewState off of the page and into Session (or some other server-side storage mechanism). For a good tutorial on this process, check out the following article: http://www.codeproject.com/aspnet/PersistentStatePage.asp.
- Disable control ViewState
Similar to the previous trick, you can also set "EnableViewState" on each control to False and then manually manage the state on each page postback. Those of us that developed with classic ASP may recall some of the numerous ways this was accomplished before ASP.NET gave us ViewState. Manually managing control state can be time consuming, but it can help you keep your page HTML trim.
- Use HTML Compression Tools
One of the easiest ways to reduce the HTML that you send to the client is to use an HTML compression tool. Compression tools can reduce the size of the HTML sent over the "tubes" for RadControls by up to 75%. Check out this forum thread for more details: http://www.telerik.com/community/forums/thread/b311D-tdkga.aspx.
- Background Image Caching in IE
By default, IE will not cache background images. If you use any CSS in your application (which you do if you use RadControls with skins), this can lead to a lot of wasted downloads in IE. Fortunately, there is a way to "trick" IE into caching background images. Check out the details here: http://www.telerik.com/community/forums/thread/b311D-teckk.aspx.
- Read the Documentation
This may sound like a worthless trick, but don't discount it until you've given it a try. Almost all RadControls have a dedicated "Speed Optimization" topic in their documentation that contains tips specific to each RadControl. Visit the RadControls documentation to find these tips. (Here is a link to RadGrid's optimization documentation to get you started.)
- Use Http Analysis Tools
How can you solve a problem without seeing it first? Free tools like Fiddler (for IE) and FireBug (for FireFox) help you peel back the curtain on your page's performance and quickly find bottlenecks in your page HTML that need to be optimized.
- Use 3rd Party Optimization Tools
Still looking for optimization techniques that don't require much work? There are several tools, like port80 and cacheright, that help automate the process of optimizing your page. These tools can help eliminate many of the caching problems that you'd otherwise have to deal with manually.
- Use External Resources instead of EmbeddedResources
Embedded resources are generally very good and very helpful. They allow you do just deploy a control assembly and not deal with any additional files. When a page uses EmbeddedResources, though, resources are pulled from an assembly using a handler and querystring value (like WebResource.axd?d=HTLSHE...). Unfortunately, these long querystrings are adding bulk to the HTML you are sending to the client. One Telerik community member found that setting "UseEmbeddedResources" to False (and using external resources in the RadControls folder instead) reduced page size from 80 kB to about 50 kB simply due to the shorter resource paths. Your mileage may vary depending on the RadControls you're using.
- Keep Control IDs Short
Whenever you have deeply nested controls, the ID of the parent control is always appended to child control IDs (if the parents implement INamingContainer). If you have long control IDs, you can cause a fair amount of extra HTML to be rendered to the page. For example, if we have a RadTreeView with ID "RadTreeView1" in ContentPlaceHolder with ID "ContentPlaceHolder1" (in a MasterPage), the resulting client ID of the TreeView is "ctl00_ContentPlaceHolder1_RadTreeView1". If we had used shorter server IDs, we could have trimmed this output to "ctl00_cph1_rtv1" and reduced the overall HTML sent to our page. This trick should always be weighed against making your code difficult to maintain due to cryptic control IDs.
- Test Sites in IIS (not Cassini)
The web server built-in to Visual Studio is very convenient for development, but it is not a good place to test your site's performance. Cassini does not do any caching of web resources and it is generally slower than IIS. You should always test your site in IIS before deploying it to a PROD environment to make sure you know how it will really perform.
- Use RamDisks in your Infrastructure
If you have control over your servers and are willing to make some hardware changes to improve performance, RamDisks may be worth checking out. By using RamDisks instead of traditional HDD for things like tempdb storage in SQL Server or HTTP decompression scratch storage, you can (supposedly) deliver performance 50x's normal hard drives. Check out this resource for more details: http://www.superspeed.com/ramdisk.php.
- Use Incremental Page Fetch
It sounds more exciting than it is, but by using RadAjax and some crafty coding you can help your pages load faster. In essence, you delay loading all of the user controls needed by your page so that the page will initially load faster and then load the controls with RadAjax. For details on this process, check out this link: http://www.telerik.com/community/forums/thread/b311D-tkkce.aspx.
- Remove Whitespace Characters
You may not realize it, but all of the whitespace characters our page contains to make it easy to read add HTML bulk. We definitely don't want to get rid of all of our page formatting at design time, though, so there are modules
like this
that remove the whitespace at runtime. By tapping-in to the page's render method, you can easily search for whitespace characters in your page and remove them to keep your pages trim. Warning: this method may cause problems if you use it with the new RadControls "Prometheus".
- Don't use Label when Literal works
Perhaps one of the most overlooked ASP controls is the "asp:literal" control. There are many times when ASP.NET developers use Label or HyperLink when Literal would do the job and save HTML bulk. For example, if you use a Label like this:
<asp:label runat="server" Text="Some test text" ID="Label1" />
will render:
<span id="ctl00_Label1">Some test text<span>
If you use a Literal like this:
<asp:literal runat="server" Text="Some test text" />
will render:
Some test text
The literal will not render any unnecessary span tags and help you reduce HTML sent to the client.
So there you go. The top 15 optimization tips and tricks as suggested by the Telerik community. Special credit goes to Johan, andyk, Martin Bischoff, and Mike for collecting most of these ideas in the forums. Feel free to add other optimization tricks in the comments if you think I've missed something important in this list.