As developers we know that loading scripts makes our page render slowly. The problem with scripts is that they can call document.write(), which will potentially modify the DOM. That is why browsers must fetch the script and execute it right away, while the rest waits. One technique to cope with that is to move all your scripts to the end of your <body>. By doing this you let the browser render the entire HTML page along with the CSS styles first and then execute the scripts. This is only possible, of course, if your scripts do not make any changes to the DOM by calling document.write().
Tag Archives: html
Bundling AngularJS HTML pages with ASP.NET
Bundling and minification are two well-known techniques used to improve the load time of your website. These are especially important for sites that use extensively JavaScript to offer better user experience. There are plenty of tools to help you do bundling and minification of JavaScript and CSS files. If you are a .NET developer you are probably very used to live inside Visual Studio and expect it to offer you everything you might think of. In ASP.NET 4.5 you can use a bundling API to define how your files will be grouped and sent to the client. The following example demonstrates the usage of this API.
|
1 2 3 4 5 6 7 |
public static void Register(BundleCollection bundles) { bundles.Add(new ScriptBundle("~/bundles/jquery") .Include("~/Scripts/jquery-{version}.js")); bundles.Add(new StyleBundle("~/bundles/css") .Include("~/css/*.css")); } |
Then in your page (either an ASP.NET page or a MVC view) you would invoke the rendering of these bundles by calling Scripts.Render(“~/bundles/jquery”) and Styles.Render(“~/bundles/css”). Continue Reading…