Home / AJAX

Reducing the Download Size of the Microsoft Ajax Library

RSS
Modified on 2009/12/17 23:28 by Erik Reitan Categorized as Uncategorized
ASP.NET includes the ability to use only parts of the Microsoft Ajax framework for efficiency, as well as the ability to use the ScriptManager control without using the Microsoft Ajax framework at all. The ScriptManager control provides services such as centralized management of references, support for debug and release modes, support for localization, script combining and Content Delivery Network (CDN) support. These services can be useful to all client-script developers, even those who use JavaScript libraries other than Microsoft AJAX, such as jQuery.

Split Script Files

In Microsoft Ajax, the default behavior for the ScriptManager control is to include the complete Microsoft Ajax Library. However, the ScriptManager control supports a MicrosoftAjaxMode property that lets you choose a subset of the framework by using only portions of the client library on the client in the form of split script files.

The MicrosoftAjaxMode attribute can have one of the following values:
  • Enabled — All Microsoft AJAX scripts are included (legacy behavior). This is the default value of the property.
  • Explicit — Each split script file must be added explicitly; it is up to you to make sure that you include all scripts that have dependencies on one another.
  • Disabled — All Microsoft Ajax script features are disabled and the ScriptManager control does not reference any scripts automatically.

Enabled Mode

By using Enabled mode of the MicrosoftAjaxMode attribute, you specify all Microsoft AJAX scripts are included when the Web page is rendered. This is the legacy behavior of the ScriptManager control. You use Enabled mode by setting the MicrosoftAjaxMode attribute of the ScriptManager control to Enabled.

The following example shows how to use Enabled mode with the ScriptManager in a Web page.
	 
<asp:ScriptManager ID="ScriptManager1" 
    MicrosoftAjaxMode="Enabled"> 
</asp:ScriptManager>

This setting will load the MicrosoftAjax.js script file. The MicrosoftAjax.js script file loads the following specific script files:
  • MicrosoftAjaxCore.js
  • MicrosoftAjaxGlobalization.js
  • MicrosoftAjaxSerialization.js
  • MicrosoftAjaxComponentModel.js
  • MicrosoftAjaxHistory.js
  • MicrosoftAjaxNetwork.js
  • MicrosoftAjaxWebServices.js
  • MicrosoftAjaxApplicationServices.js
  • MicrosoftAjaxWebForms.js

The scripts contained in the MicrosoftAjaxApplicationServices.js file and the MicrosoftAjaxWebForms.js are loaded when the features contained in these script files are triggered. The Microsoft Ajax Library is available as a separate download and contains updates to the above script files.

Explicit Mode

You use Explicit mode by setting the MicrosoftAjaxMode attribute of the ScriptManager control to Explicit. When you use this value, you must add each split script file. Also, you must make sure to include all dependent script files.

Note:

When you use Explicit mode, any script file can be specified as part of the composite script.

When you use Explicit mode, you can specify individual script files to load that are normally loaded when the MicrosoftAjax.js script file is loaded. The following Microsoft Ajax script files are available to individually load:
  • MicrosoftAjaxCore.js
  • MicrosoftAjaxGlobalization.js
  • MicrosoftAjaxSerialization.js
  • MicrosoftAjaxComponentModel.js
  • MicrosoftAjaxHistory.js
  • MicrosoftAjaxNetwork.js
  • MicrosoftAjaxWebServices.js
  • MicrosoftAjaxApplicationServices.js
  • MicrosoftAjaxWebForms.js

In addition to the above scripts files, you can also include external script files that are also available in Microsoft Ajax Library:
  • MicrosoftAjaxTemplates.js
  • MicrosoftAjaxAdoNet.js
  • MicrosoftAjaxDataContext.js

As an example, to use the Microsoft Ajax browser history feature with no partial rendering and with MicrosoftAjaxMode set to Explicit, the ScriptManager control must be configured as it is in the following example:
 
<asp:ScriptManager ID="ScriptManager1" 
    EnablePartialRendering="false" 
    MicrosoftAjaxMode="Explicit" 
    EnableHistory="true" 
    runat="server">
  <CompositeScript>
    <Scripts>
      <asp:ScriptReference Name="MicrosoftAjaxCore.js" />
      <asp:ScriptReference Name="MicrosoftAjaxComponentModel.js" />
      <asp:ScriptReference Name="MicrosoftAjaxSerialization.js" />
      <asp:ScriptReference Name="MicrosoftAjaxHistory.js" />
    </Scripts>
  </CompositeScript>
</asp:ScriptManager>


In the above example, EnablePartialRendering has been set to false so that MicrosoftAjaxWebForms.js is not included automatically, and EnableHistory has been set to true so that the ScriptManager control can use the Microsoft Ajax browser history feature. Order is important when you include split scripts — if a script has dependencies, the ScriptReference elements for those dependencies must be listed before the ScriptReference element for the script itself.

Note that split script files should be used only by developers who are concerned about optimizing for very high performance. When split script files are used, they should be used together with script combining to minimize the numbers of requests that are required in order to download the scripts.

Microsoft Ajax Script Files

The following table provides script file dependencies and available functionality for each Microsoft Ajax script file.
Script FileDependent Script FilesIncluded Types
MicrosoftAjaxCore.js(None)Function
Object
String
Boolean
Date
Number
RegExp
Type
Array
IDisposable
StringBuilder
Browser
EventArgs
ClancelEventArgs
Debug
Enum
CollectionChange
NotifyCollectionChangedAction
NotifyCollectionChangedEventArgs
INotifyPropertyChange
PropertyChangedEventArgs
Observer
MicrosoftAjaxGlobalization.jsMicrosoftAjaxCore.jsDate.Globalization
String.Globalization
Number.Globalization
CultureInfo
MicrosoftAjaxSerialization.jsMicrosoftAjaxCore.jsJavaScriptSerializer
MicrosoftAjaxComponentModel.jsMicrosoftAjaxCore.jsEventHandlerList
CommandEventArgs
INotifyDisposing
Component
MouseButton
Key
Point
Bounds
DomEvent
DomElement
IContainer
ApplicationLoadEventArgs
Application
Behavior
VisibilityMode
Control
MicrosoftAjaxHistory.jsMicrosoftAjaxComponentModel.js
MicrosoftAjaxSerialization.js
HistoryEventArgs
Application.History
MicrosoftAjaxNetwork.jsMicrosoftAjaxSerialization.jsXMLHttpRequest
WebRequestExecutor
XMLHttpExecutor
WebRequestManager
NetworkRequestEventArgs
WebRequest
ScriptLoaderTask
MicrosoftAjaxWebServices.jsMicrosoftAjaxNetwork.jsWebServiceProxy
WebServiceError
MicrosoftAjaxApplicationServices.jsMicrosoftAjaxWebServices.jsProfileService
AuthenticationService
RoleService
MicrosoftAjaxWebForms.js MicrosoftAjaxCore.js
MicrosoftAjaxSerialization.js
MicrosoftAjaxNetwork.js
MicrosoftAjaxComponentModel.js
BeginRequestEventArgs
EndRequestEventArgs
InitializeRequestEventArgs
PageLoadedEventArgs
PageLoadingEventArgs
ScriptLoader
PageRequestManager
UpdateProgress
MicrosoftAjaxTemplates.js MicrosoftAjaxComponentModel.js
MicrosoftAjaxSerialization.js
WebRequestEventArgs
DataEventArgs
IDataProvider
MergeOption
DomElement
Application_MarkupExtensions
DOMProcessor
Template
TemplateContext
ITemplateContextConsumer
CollectionChange
BindingMode
Binding
DataView
DataViewItemEventArgs
MicrosoftAjaxAdoNet.jsMicrosoftAjaxWebServices.jsIDataProvider
MergeOption
AdoNetQueryBuilder
AdoNetActionResult
AdoNetActionSequence
AdoNetInvokeParametersBuilder
AdoNetServiceError
AdoNetServiceProxy
AdoNetBatchReader
AdoNetBatchWriter
MicrosoftAjaxDataContext.jsMicrosoftAjaxCore.jsAdoNetDataContext
ChangeOperation
ChangeOperationType
DataContext
IDataProvider
MergeOption
WebServiceOperation

The following illustration shows the dependencies between the Microsoft Ajax script files.

Microsoft Ajax script file dependencies

Microsoft Ajax script file dependencies

Microsoft Ajax script file dependencies


Disabled Mode

By using Disabled mode, you specify that all Microsoft Ajax script features are disabled and that the ScriptManager control does not reference any scripts automatically. You use Disabled mode by setting the MicrosoftAjaxMode attribute of the ScriptManager control to Disabled.

The following example shows how to use Disabled mode with the ScriptManager in a Web page.
 
<asp:ScriptManager ID="ScriptManager1" 
    MicrosoftAjaxMode="Disabled"> 
</asp:ScriptManager>
  Name Size
- AjaxDependencies.png 12.32 KB