Nitpicking Javascript: CDN, double loading, combining and de - Sitefinity - Bugs & Issues

All Replies

Posted by Community Admin on 29-Jan-2012 00:00

I'm way overdue on my quarterly Javascript rant, so here's the 4th installment and feel free to move on to more important issues :)

CDN Update
Under Admin >> Settings >> Advanced >> Pages >> Scriptmanager >> Script references currently the most commonly used libraries are listed. However, the CDN's for jQueryUI and jQuery Validate are always omitted:
ajax.aspnetcdn.com/.../jquery.validate.min.js
ajax.aspnetcdn.com/.../jquery-ui.min.js

For the microsoft scripts, they're still pointing to ajax.microsoft.com which has been replaced with ajax.aspnetcdn.com for over a year ago. Also I was wonder if if there is a timeframe when the Microsft Ajax beta 0910 will be replaced with the up to date release ones?

Script combining
When I'm loading the backend page overview, there are over 71 JS requests with a total of 552 Kb. 4 of them are bigger than 15Kb, leaving an average filesize of 4.4Kb for the remaing request with the smallest being 249 bytes.

With a modern browser being capable of 6 simultaneous downloads and older legacy browser maxing 2, I'd say we could get a huge performance boost if some of these scripts got combined...

Double loading
When setting the "combine script resources" is set to "true" in the settings, some JS gets double loaded or added on the backend. This varies from 20Kb up till 80Kb on the backend.

Script grouping
As an extention on the previous issue, if you log in with an empty cache, you arrive at the dashboard.
Click 'Pages' and 609 Kb of JS gets loaded (87.2 Kb cached) with one chunk 311.7 Kb.
Click on 'Content>News' and 591 Kb gets loaded (103 Kb cached) with one chunk 335.3 Kb.
Click on 'Content>Blog' and 470 Kb gets loaded (162 Kb cached) with one chunk 307.3 Kb.
Click on 'Content>Content blocks' and the one big chunk is now 309 Kb.

Over these 4 pages I've downloaded more of 1Mb consisting of mostly the same js files. And that double loading group of JS files isn't just with content but also with Ecommerce, Design and Administration. And not only is some standard js files like jQuery, Ajax, Webforms etc but also about 40 Telerik/Sitefinity scripts.

---
Another example with cold cache starting at the page overview:
With script combining on, we're download over 1097Kb (for Page Overview + Content>News).
With script combining off I'm downloading 610.7 Kb for those two pages (609Kb cold on the first and 1.7Kb cold on the second).

---

Surely some form of 'grouping' like the example below could be enforced?

<telerik:RadScriptManager ID="ScriptManager1" runat="server">

<Groups>

<telerik:ScriptReferenceGroup>

<Scripts>

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />

<asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryPlugins.js" />

</Scripts>

</telerik:ScriptReferenceGroup>

</Groups>

</telerik:RadScriptManager>

Even if we can't get grouping/combining working a seperate checkbox to split 'combine script resources' between front and backend would be appreciated.

Defer loading of JavaScript
Even if we can't get grouping/combining working can't we 'preload' some javascript for the backend? We (sorry I mean you) know exactly what Javascript gets loaded for the backend.

To get a smoother backend usage, why not 'preload' some Javascript on the Backend login page? This is a small page, but generally one where we stay on for more than several seconds because it takes time to realize it popped up, type in the user/password and click login.

With a simple javascript 'defer' statement, we could preload the heavy js. The longer the user stays on the page, the more js gets cached - the smoother the rest of theSitefinity experience will be.

Jochem.

Posted by Community Admin on 29-Jan-2012 00:00

Nice analysis

But with the huge usage of x JS frameworks to get something fine in HTML this is normal.

Thanks

Posted by Community Admin on 29-Jan-2012 00:00

@TMatt,

I respectfully disagree...

73 requests with an average of 4.4 Kb file size with smallest being 249 bytes (not kilobytes) is not building an optimized set of JavaScript libraries.

1079Kb over 2 pages instead of 610Kb over the same two pages is just not optimizing your code/files.

The CDN issues is just me being lazy and seeing normal Ajax/AjaxWebform and the beta Ajax/AjaxWebforms loaded (I know Telerik has a dependency on the beta but still).

It's silly for me to spend 10% of my projects time and budget at optimizing and minimizing code, images and css to give the user the fastest experience and then seeing hundreds of Kb's negate all that work - especially since most of it is unnecessary.

J.

Posted by Community Admin on 30-Jan-2012 00:00

Dear Jochem
Reminds me a lot of this thread http://www.sitefinity.com/devnet/forums/sitefinity-4-x/bugs-issues/script-combining-a-bad-idea.aspx

I am sure with you on this one. I started to build my own rad menu css files instead of using stylebuilder because you can save there a lot as well.

Any idea to make SF faster is welcome an appreciated. Thank's for taking the time for this testing.
Markus

This thread is closed