Talán kevesen tudják, hogy az AJAXos JavaSriptek összefűzésésére nem csak az ASP.NET 4.0 lesz képes, hanem már jelenleg is, van beépített támogatás rá. Egészen pontosan az ASP.NET 3.5 SP1 óta létezik ez a megoldás.

A megoldás kulcseleme a ScriptManager CompositeScript tagje. Ennek a lényege az, hogy az oldalon lévő AJAX-os JavaScript fájlokat dinamikusan össze tudja fűzni, így azok lekérése csak 1 kérés lesz. Ezen felül megadható, hogy ezeket a JavaScripteket tömörítse és cache-elje is. Ehhez annyi dolgunk van, hogy a CompisiteScript Script tagjében felsoroljuk az oldalon használt javascript hivatkozásokat az alábbi formátumban:

<CompositeScript ScriptMode="Release" >
 <Scripts>
    <asp:ScriptReference name="…" assembly="…"/>
    <asp:ScriptReference name="…" assembly="…"/>
  </Scripts>
</CompositeScript>

Viszont rögtön felmerül a kérdés, hogy  hogyan tudjuk azonosítani, az oldalon használt JavaScripteket?

A megoldást a CodePlex-ről letölthető ScriptReferenceProfiler jelenti, amit ha egyszerűen beágyazunk az oldalba, akkor az futás közben kiírja, hogy pontosan milyen javascriptekre kell referenciát adnunk. A beágyazáshoz referenciát kell adni a letöltött forrásra vagy dll-re, majd az oldalon regisztrálni kell az alábbi módon:

<%@ Register Assembly="ScriptReferenceProfiler" Namespace="ScriptReferenceProfiler" 
    TagPrefix="microsoft" %>

Ezt követően az oldalon belül valahogy el kell helyezni magát a vezérlőt.

<microsoft:scriptreferenceprofiler runat="server" />

Ezt követően, ha elindítjuk az alkalmazást, az oldal tetején meg fog jelenni egy lista, ami az adott oldalon használt JavaScript hivatkozásokat adja meg. Ezt a listát egyszerűen be kell másolni a CompositeSrtipt Script tagjébe. Ekkor az alábbi kódot fogjuk kapni:

<CompositeScript ScriptMode="Release" >
 <Scripts>
  <asp:ScriptReference name="MicrosoftAjax.js" />
  <asp:ScriptReference name="MicrosoftAjaxWebForms.js" />
  <asp:ScriptReference name="AjaxControlToolkit.Common.Common.js" assembly=
"AjaxControlToolkit, Version=3.0.30512.20315,Culture=neutral, PublicKeyToken=28f01b0e84b6d53e"/>
  <asp:ScriptReference name="AjaxControlToolkit.ExtenderBase.BaseScripts.js" assembly=
"AjaxControlToolkit, Version=3.0.30512.20315,Culture=neutral, PublicKeyToken=28f01b0e84b6d53e"/>
  <asp:ScriptReference name="AjaxControlToolkit.TextboxWatermark.TextboxWatermark.js" assembly=
"AjaxControlToolkit, Version=3.0.30512.20315,Culture=neutral, PublicKeyToken=28f01b0e84b6d53e"/>
  <asp:ScriptReference name="AjaxControlToolkit.Compat.Timer.Timer.js" assembly=
"AjaxControlToolkit, Version=3.0.30512.20315,Culture=neutral, PublicKeyToken=28f01b0e84b6d53e"/>
  <asp:ScriptReference name="AjaxControlToolkit.Animation.Animations.js" assembly=
"AjaxControlToolkit, Version=3.0.30512.20315,Culture=neutral, PublicKeyToken=28f01b0e84b6d53e"/>
  <asp:ScriptReference name="AjaxControlToolkit.Animation.AnimationBehavior.js" assembly=
"AjaxControlToolkit, Version=3.0.30512.20315,Culture=neutral, PublicKeyToken=28f01b0e84b6d53e"/>
  <asp:ScriptReference name="AjaxControlToolkit.PopupExtender.PopupBehavior.js" assembly=
"AjaxControlToolkit, Version=3.0.30512.20315,Culture=neutral, PublicKeyToken=28f01b0e84b6d53e"/>
  <asp:ScriptReference name="AjaxControlToolkit.AutoComplete.AutoCompleteBehavior.js" assembly=
"AjaxControlToolkit, Version=3.0.30512.20315,Culture=neutral, PublicKeyToken=28f01b0e84b6d53e"/>
  </Scripts>
</CompositeScript>

Fontos, hogy a CompositeScript tagben adjuk meg a  ScriptMode="Release"-t hiszen ekkor a JavaScriptek release verziója fog letöltődni a kliensre, ami sokkal tömörebb, viszont nehezebben debuggolható.

Ezen felült amit még beállíthatunk, annak érdekében, hogy az AJAXos oldalak gyorsabban töltődjenek le, az a szkriptek cache-elése, amit a web configban lehetünk meg az alábbi módon:

<system.web.extensions>
  <scripting>
     <scriptResourceHandler enableCaching="true" enableCompression="true" />
  </scripting>
</system.web.extensions>

Ezen felül még mindig tudunk gyorsítani az oldalon, azonban ennek időnként vannak mellékhatásai úgyhogy ennek használata alapos tesztelést igényel. Ez a megoldás pedig nem más, mint hogy a JavaScriptek, csak a GUI letöltése után töltődjenek le. Ezzel azt érjük el, hogy az oldal már működik, amikor még a JavaScriptek a háttérben töltődnek. Így fokozható a felhasználói élmény. Ennek beállításához a LoadScriptsBeforeUI="false"-t kell megadni a ScriptManagerben, az alábbi módon:

<asp:ScriptManager runat="server" ScriptMode="Release" LoadScriptsBeforeUI="false" >

Az elért teljesítménynövekedést a FireBuggal vagy a Balássy Gyuri SEO szerszámosláda postjában található eszközökkel kiválóan le lehet mérni.