Home » Speed Up Rendering

Speed Up Rendering

s an ASP programmer, you are no doubt focused on improving the performance of your Web application. You are probably busy improving your database access performance as well as the performance in your COM components, if you are using any. Did you know that you could improve the performance of your Web application by improving the speed at which your browser renders your resultant HTML? To your end user, the Web page loads and renders faster, and wins you the accolades.

This apparent improvement in performance can be achieved by using little-known techniques that can assist a browser as it renders your HTML page on screen. Let’s see how.

Nesting Tables?
One common technique to lay out a Web page is to use HTML Tables to enforce a structure on a page. So if you are building a Web site with a top navigation (nav) bar and two columns?a left nav bar and a right content area?you would build it with one large table with two rows and two columns. In the first row, the columns are merged and a smaller top nav table is inserted. In the second row’s left column, you would include a second table that displays the navigation buttons. In the bottom right column, you would include the actual content of the page within a second table. This nesting of tables within tables produces great results.

To create a Web page that looks like this, you would use the following code:

A browser will not start rendering a page on screen when it finds a TABLE tag unless it receives its corresponding ending tag. So if your entire Web page is within a table that, in turn, is within an outer table, the entire page will not be drawn till the final tag of the outer table has been downloaded. This can cause those momentary pauses in rendering that you see when you visit sites that are bringing down a large amount of data (for example, a search result or a product catalog in an e-commerce site). To prevent this, break your page down into smaller TABLE chunks. As each table’s HTML code is downloaded, the browser will start to render it on screen. To your visitor, the page will appear on screen in gradually increasing spurts and more importantly, the page will “appear” to begin displaying on screen much faster than having to wait for the entire page’s code to be downloaded.

To take the example I outlined above, instead of having a single outer table, break up the page into three separate tables. Use the first table to display the top nav elements, making it sufficiently wide enough to fit your page content and complete the

code for it. Underneath that, arrange a second table that is ALIGNED left. Use a third table to hold the contents of your page’s body. Since each section is a complete TABLE, each section will get rendered as soon as the code for the section is downloaded. So your top nav bar and the left nav bar will be rendered far earlier than the rest of the page. This gives the illusion that the page has started to download and will be on the screen any moment, rather than have the user stare at a blank white screen and get disillusioned.

Use the following code:

Remember to Close Other Tags Too!
Just as closing your TABLE tags early helps your browser to render the table data quickly, there are a couple of other often-used tags that also benefit from this same technique. These are the

tags to generate Bullet list items.

Often, the ASP programmer will access a database and construct the

So, instead of using this code:

Do while not objRS.EOF  strOptionList = strOptionList & “

Simply change one line of code:

Do while not objRS.EOF  strOptionList = strOptionList & “”  objRS.MoveNextLoopResponse.Write ““

Instead of using this code:

  Apples  
Oranges  
Bananas

Use this:

  Apples
  Oranges
  Bananas

And viola, your page will appear faster in your user’s browser.

I am not belittling the importance of improving your ASP performance; I will be devoting future columns to this concept. However, among the slew of “tips and techniques” that you can find in books and online, one tends to forget that by making these simple changes to your HTML code, you stand to gain a lot in terms of page rendering time and apparent speed of your Web application.

About Our Editorial Process

At DevX, we’re dedicated to tech entrepreneurship. Our team closely follows industry shifts, new products, AI breakthroughs, technology trends, and funding announcements. Articles undergo thorough editing to ensure accuracy and clarity, reflecting DevX’s style and supporting entrepreneurs in the tech sphere.

See our full editorial policy.