Better Practices on Building High performance Web

This article details out the better practices on how to get the most out of your web pages in terms of delivering, parsing and rendering the content on a web browser.   Your web page consists of a whole bunch of HTML and DHTML tags to represent the content you intend to display statically or dynamically. All you got to worry upon developing the content is how it is going to be rendered on a browser making the user/viewer experience delightful.
Many developers do focus only on performance issues related to ASP.NET and feel that their job is over. It is important to note that your ASP.Net pages are rendered ultimately as HTML and DHTML. A bad and clumsy markup would often costs more and causes the real trouble.   This article narrates a few practices on boosting the performance of the webpages focusing only on the HTML and DHTML markup. These tips would help you to get more out of the Internet Explorer and other commonly used browsers.   For HTML pages, here are the points you need to consider:   Reuse HTML Components and External Scripts   Reuse your script by placing common code in a behavior or a separate file. IE browsers download the .js files when they are first used and for subsequent inclusions, they simply retrieve from the local cache.   Setting the lightweight attribute to true on an HTML Component's Component element improves the performance for an HTML Component that does not contain markup.   DEFER Your Scripts   Never forget to use the “DEFER” attribute of the Useful Books For Developers Similar Articles Posted on 4/2/2009 @ 8:09 AM By Posted on 4/1/2009 @ 7:54 AM By Posted on 3/30/2009 @ 5:47 AM By Posted on 3/22/2009 @ 10:20 AM By Posted on 3/18/2009 @ 8:27 AM By
Use the DOM to Update Tables   It is more efficient to insert table rows and cells using DOM methods than to use the insertRow and insertCell methods that are part of the DHTML table object model.   Write Once, Use Many Times   Place your common script operations in a DHTML attached or element behavior.  Behaviors provide a great way to reuse script and build components that can be accessed from HTML, enabling you to extend the DHTML object model with your own objects, methods, properties and events.   Element Behavioral issues   Using the textOverflow property to render ellipses is an efficient alternative to building ellipses in DHTML. Use the literalContent attribute to make parsing of Element Behaviors more performant. Include an ID for the saveFavorite, saveHistory, and userdata Element behaviors to improve their performance.   Don't Be Too Dynamic with Your Properties   Dynamic properties allow you to use an expression as a property value. This expression is evaluated at run time, and the resulting value is applied to the property. It can be used to reduce the amount of script on the page, but it can also have an adverse effect on performance because the expressions must be recalculated regularly and often have dependencies on other property values.   Data Binding is Good for You   Use data binding to provide rich client-side data views. A Web page may present a company data as a line, bar or pie chart with buttons to sort the data by office, product or sales period. All this can be provided with only one visit to the server with Data Binding improving the performance.   Keep Your Expando Properties Off the Document   Expando properties are arbitrary properties that can be added to any object. They are useful for storing information within the current Web page and are another way to extend the DHTML object model. For example, you could assign a clicked property on your HTML elements and use this to indicate to the user which elements have been clicked.   Be sure to set the Expando properties on the window object. If you set them on the document object, it must perform additional recalculations when you access the property.   Avoid switching classes and style rules   Directly modify the style object when changing your content presentation. If your Web site uses style sheets to provide alternative views of your content, consider modifying the style object directly for the elements you wish to change, rather than modifying an element’s className property or the styleSheet object associated with a class.   Switching classes and style rules can be an expensive operation, requiring recalculation and layout of the entire document.   High Performant ActiveX Controls   ActiveX controls that are not apartment-model aware will suffer from degraded performance.  A windowless ActiveX control often performs better than a windowed control.   Collapse a Text Range before Finding the Parent A TextRange object represents an area of text that has been selected by the user or retrieved from an HTML element such as the body. The parent of the text range can be identified by calling the parentElement method. For complex text ranges, it is more efficient to call the collapse method before calling the parentElement method.