As soon as browser gets some HTML,it parses it and starts down loading external resources like images, stylesheets, and Java Script immediately. Sometimes this results in un wanted resources down loading. For example, you might have a pop-up dialog box hidden inside the Default.aspx that you show only on certain actions. However,the browser will get the HTML for the pop-up dialog and down load the graphics files associated with the content, which wastes a precious HTTP connection during site load. Of course, you can defer loading such UI elements by using the on-demand UI loading approach, but sometimes you need to deliver some essential UI elements instantly when the user performs some action and cannot wait for an XML HTTP call to complete, e.g., confirmation dialog boxes.
When the user deletes a wid get, she sees a warning dialog box(see Figure). The HTML for the warning dialog box is embedded inside Default.aspx
When a widget is deleted, a confirmation window pops up. The HTML of the popup is in side Default.aspx.
When you put the HTML for the pop-up dialog box inside Default.aspx,the image used in the stylesheet is downloaded even though the popup is not visible on the screen.If the popup has multiple decorative images, such as a background picture, icons, and button shades, they will be downloaded during page load, wasting several HTTP calls and band width (see Example).
Pop-up HTML embedded inside Default.aspx makes the browser down load associated images during page load
The HTML snippet is at the end of the document to force the images to download as late as possible.But it still does not eliminate CSS images (Example),even though the popup is not visible on screen until the user clicks on a widget’s close button.
CSS defined for the popup
By using an HTTP analyzer like Nikhil’s web development helper ,you can see the image is down loaded during page load,as shown in Figure
The browser downloads images for all the HTML, regardless of whether it is visible on the UI
Popups occupy a significant amount of bandwidth during page load, but the solution is to deliver the HTML without letting the browser parse it.You pass a large amount of HTML inside a <textarea> tag.The browser will get encoded HTML inside a <textarea> tag and not parse the content. Because it will not see the HTML,it will not download the associated images.When you need to get the HTML,extract the value of the <textarea>, decode the content to get the HTML, and inject the HTML inside DOM.
In Example,the HTML is encoded inside a <textarea> tag, so the browser cannot parse the HTML and apply it to the DOM.An easy way to convert a block of HTML to its encoded form is to copy the HTML inside Visual Studio HTML editor and then select Edit ➝ Paste Alternative.
Delivering HTML for the popup inside <textarea>tags
You can create checks to make sure you do this only once because if you repeatedly add the same elements to the DOM, you’ll duplicate the ID and won’t be able to access the elements via the $get call.
One draw back of this approach is that resources referenced by the HTML block will get down loaded only after they are added in the DOM.So,the HTML will appear with out graphics for a moment until the browser down loads the resources.
ASP.NET Related Interview Questions
|VB.NET Interview Questions||C#. NET Interview Questions|
|ASP.NET Interview Questions||ADO.Net Interview Questions|
|Windows Presentation Foundation(WPF) Interview Questions||Windows CE .NET Interview Questions|
|Dot Net Framework Interview Questions||Asp Dot Net Mvc 4 Interview Questions|
|Asp Dot Net Mvc Interview Questions|
Introducing Web Portals And Dropthings.com
Architecting The Web Portal And Widgets
Building The Web Layer Using Asp.net Ajax
Building The Data And Business Layers Using .net 3.5
Building Client-side Widgets
Optimizing Asp.net Ajax
Creating Asynchronous, Transactional, Cache-friendly Web Services
Improving Server-side Performance And Scalability
Improving Client-side Performance
Solving Common Deployment, Hosting, And Production Challenges
All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd
Wisdomjobs.com is one of the best job search sites in India.