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
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
