ASP.NET Ajax: Scripte zusammenfassen

Ich bin etwas spät, aber bevor ich es niemals mehr blogge kommt heute der Artikel zu JS. Ich habe mir endlich mal wieder Zeit für das Bloggen genommen und bin auch froh. Meine Arbeitslage hat sich sehr plötzlich etwas entspannt.

Der ScriptManager aus dem .NET Framework 3.5 kann JavaScripte auf dem Server zusammenfassen. Das bedeutet, dass eine Anzahl von Scripten in ein größeres Script zusammengefasst wird. Es gibt mehrere Vorteile, die durch das zusammenfassen entstehen:

- weniger Server-Roundtrips für den Download der Script

- optimierte Script-Files (entfernte Kommentare, entfernte Zeilenumbrüche)

Das schwierige für das Zusammenfassen von Scripten ist allerdings herauszubekommen, was alles geladen werden muss. Hierfür existiert allerdings auch ein passendes Tools, mittels dem der Konfigurationsblock sehr einfach erzeugt werden kann. Der ScriptReferenceProfiler ist ein Server-Control, dass einfach auf der Webseite eingebunden wird. Beim Aufruf der Webseite erhählt man einen Script-Block als Ausgabe. Der Script-Block wird 1:1 in die ASP.NET-Seite eingefügt und zwar beim eingebundenen Script-Manager. Eine sehr gute Anleitung kann unter video-296.aspx angeschaut werden.

Ursprünglich eingebundener ScriptManager:

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>

Eingefügte Scripte, die zusammengefasst werden:

<asp:ScriptManager ID="ScriptManager1" runat="server">
    <CompositeScript>
        <Scripts>
            <asp:ScriptReference Name="MicrosoftAjax.js" />
            <asp:ScriptReference Name="MicrosoftAjaxWebForms.js" />
            <asp:ScriptReference Name="”AjaxControlToolkit.Common.Common.js”" Assembly="”AjaxControlToolkit,"
                Version="3.0.20229.17016," Culture="neutral," PublicKeyToken="28f01b0e84b6d53e”" />
            <asp:ScriptReference Name="”AjaxControlToolkit.ExtenderBase.BaseScripts.js”" Assembly="”AjaxControlToolkit,"
                Version="3.0.20229.17016," Culture="neutral," PublicKeyToken="28f01b0e84b6d53e”" />
        </Scripts>
    </CompositeScript>
</asp:ScriptManager>

Eigentlich ist das alles super einfach, allerdings kann es passieren, dass durch sehr viele Scripte die URL zu lang wird. Als Fehler kommt die Meldung "The resource URL cannot be longer than 1024 characters. If using a CompositeScriptReference, reduce the number of ScriptReferences it contains, or combine them into a single static file and set the Path property to the location of it." Das ganze hört sich wesentlich dramatischer an, als es ist. Um das Problem zu lösen, muss man die Scripte aufteilen. Dazu werden ScriptManagerProxy-Controls verwendet. Die Proxy-Instanzen sind ursprünglich für die Verwendung auf Unterseiten gedacht, um weitere Scripte oder Services einzufügen.

<asp:ScriptManager ID="ScriptManager1" runat="server">
    <CompositeScript>
        <Scripts>
            <asp:ScriptReference Name="MicrosoftAjax.js" />
            <asp:ScriptReference Name="MicrosoftAjaxWebForms.js" />
        </Scripts>
    </CompositeScript>
</asp:ScriptManager>
<asp:ScriptManagerProxy ID="proxy1" runat="server">
    <CompositeScript>
        <Scripts>
            <asp:ScriptReference Name="”AjaxControlToolkit.Common.Common.js”" Assembly="”AjaxControlToolkit,"
                Version="3.0.20229.17016," Culture="neutral," PublicKeyToken="28f01b0e84b6d53e”" />
            <asp:ScriptReference Name="”AjaxControlToolkit.ExtenderBase.BaseScripts.js”" Assembly="”AjaxControlToolkit,"
                Version="3.0.20229.17016," Culture="neutral," PublicKeyToken="28f01b0e84b6d53e”" />
        </Scripts>
    </CompositeScript>
</asp:ScriptManagerProxy>

Ein sehr guter Artikel zu dem Thema wurde von Samir Bellouti geschrieben.

Technorati-Tags: ASP.NET,JavaScript