" /> " /> Learn Dash AJAX Dot Com -
Welcome to Learn Dash Ajax Dot Com

AjaxControlToolkit CascadingDropDown Issue with FireBug

Friday, March 27, 2009
Well I found a debugging issue today trying to implement something with the AjaxControlToolkit's CascadingDropDown control.

A page I was working on had four CascadingDropDown controls on it and even though on the server side, they were disabled, i.e. .Enabled = false, when rendered on the client, they would be disabled for one second than become readable. It had to do with populating the picklist with the web service call.

So I was trying to use the picklist.CascadingDropDownBehavior.add_populated method to add a function that disabled things after the dynamic data was populated. In Internet Explorer, no issues. In FireFox, FireBug was launching the debugger sometimes but then my add_populated method was never firing. I was going nuts.

In a last ditch effort I said, maybe I'll just disable FireBug as the clients will most likely not have it installed. I restarted FireFox with FireBug disabled and all was good. I must say that wasn't obvious. The issue I describe occurs with FireBug 1.3.3. Maybe it's only this version, I don't know. Just thought I'd mention it in case someone else ends up pulling their hair out because of this.

And for code's sake, here's what I did to disable the CascadingDropDown on the client-side:



function pageLoad(sender, args) {
DisablePickLists();
}

// Note: If you need to debug this in FireFox, FireBug doesn't really work. I tried and I was able to debug below intermittently
function DisablePickLists() {
// picklistClientIDs is populated in FormAppointmentBase.cs
if ("undefined" !== typeof(picklistClientIDs)) {
var populated = function(sender, args) {
var picklist = sender._element;

// I don't check for the existence of the picklist because it has to exist. The element IDs being returned are from server-side
// code that got the clientIDs of server controls.
var myInterval;

myInterval = setInterval(function() {
if (sender._isupdating) {
return;
}

clearInterval(myInterval);
picklist.disabled = true;
}, 20);
};

for (var index=0;index < picklistClientIDs.length;index++) {
var currentID = picklistClientIDs[index];
var picklist = $get(currentID);
picklist.CascadingDropDownBehavior.add_populated(populated);
}
}
}

Labels: , , , , ,

Web Site Performance Tips

Tuesday, December 23, 2008

Making web site pages load quickly is paramount. Here's some tips I recommend from past experiences as well as some stuff that I'm sure has already been mentioned by others on the Net. Some of this is ASP.NET specific but there is still some non general stuff in here too.

  • Minimize the size of image files. Adobe Photoshop and Adobe Fireworks can do this, as well as Gimp plus I'm sure there's tonnes of other graphics editors out there like Google's Picasa. Yahoo! released a tool called Smush It that can do this automatically from a web site, see http://smushit.com/ .

  • Instead of returning DataSets, use DataReaders. When editing something load up the individual record(s). Doing so will eliminate a big chunk of ViewState which will speed up page rendering.

  • Remove all inline CSS, put them as classes and store the classes in CSS files. This improves management of style and allows for you to use the “Cascade” in CSS and the CSS file(s). AS well CSS files are cached by the browser.

  • Remove all JavaScript that is contained in server-side source code, if possible. If ClientIDs of server controls are required, register them through server side code, but pass them as arguments to JavaScript methods stored in *.js files or define them as global variables. Doing so will also allow JavaScript to be cached by the browser.

  • Compress CSS and JavaScript using YuiCompressor, to minify these files. Another alternative is to obfuscate your JavaScript, but I found this to be problematic and difficult to debug. Having said that I successfully used Semantic Designs JavaScript Obfuscator . You have a file which you define your public API so it doesn't get obfuscated. If done right, you can reduce your JS footprint big time.

  • Disable ViewState wherever possible.

  • Cache pages if possible or controls in pages if possible. E.g. For a specific role cache the menu control. You can use ASP.NET’s OutputCache page/control directive.

  • Reduce our markup. Anywhere where tables are used for layout, consider using DIVs or HTML lists and CSS.

  • Set the AutoEventWireUp page directive to false to improve performance. Here's some links explaining why:
  • Use HTTP compression if possible. Here's some links explaining why:
  • Here's also some guidelines from Yahoo, http://developer.yahoo.com/performance/rules.html

  • For ASP.NET, avoid using Server.MapPath as much as possible as it slows down performance. If you need it to resolve a folder, try and load these folders into Application variables when the application starts and then use these base folders to build the folder you need
    protected void Application_Start(object sender, EventArgs e)
    {
    // code ...
    Application[DownloadsFolderApplicationKey] = Server.MapPath("~/downloads/");
    // more code ...
    }

    protected void Session_Start(object sender, EventArgs e)
    {
    // code ...
    if (Application[DownloadsFolderSessionKey] == null)
    throw new NullReferenceException("Downloads folder cannot be null.");

    string downloadPath = Path.Combine(

    Application[DownloadsFolderApplicationKey] as string
    , Session.SessionID);
    // Don't do this
    // string downloadPath = Path.Combine(Server.MapPath("~/downloads/"), Session.SessionID);
    // more code ...
    }

Some other great articles on web site optimization:

Take a peek at FireFox's YSlow Add-On (courtesy of Yahoo!) for optimizing web site performance.

That's all for now. If you have other suggestions for improving page performance, please let me know.

Labels: , , , , ,


AddThis Feed Button   Bookmark and Share