Como programador ASP, você não duvidará da importância de melhorar o desempenho de seus aplicativos Web. Para fazer seu programa rodar mais rápido, você pode estar ocupado otimizando o banco de dados ou componente COM. Se você já fez tudo isso, já pensou em melhorar o desempenho acelerando a velocidade de exibição do código HTML final gerado no navegador? Para o usuário final, se a página puder ser exibida mais rapidamente, você ganhará mais elogios.
Melhorar a velocidade com que o HTML é exibido no seu navegador pode ser conseguido através de algumas técnicas pouco conhecidas.
1. Usar aninhamento de mesa?
O estabelecimento de estruturas complexas na página geralmente é conseguido colocando tabelas HTML na página. Se você deseja criar uma página como esta: Esta página possui uma barra de navegação superior, uma barra de navegação esquerda e uma área de conteúdo direita. Você pode criar isso usando uma tabela grande com duas linhas e duas colunas. Na primeira linha, mescle as duas colunas e insira uma barra de navegação superior. Na coluna esquerda da segunda linha, insira uma tabela para exibir os botões de navegação. Na coluna da direita, coloque uma tabela para exibir o conteúdo real. (Veja a Figura 1) O código gerado por essa tabela aninhada é o seguinte:
<TABLE BORDER="0">
<TR>
<TD COLSPAN="2"><!-- conteúdo da barra de navegação superior --></TD>
</TR>
<TR>
<TD ALIGN="LEFT" VALIGN="TOP"><!-- conteúdo da barra de navegação esquerda --></TD>
<TD ALIGN="LEFT" VALIGN="TOP"><!-- conteúdo do corpo da página --></TD>
</TR>
</TABLE>
Porém, na verdade, quando o navegador encontra a tag <TABLE>, ele não exibe imediatamente a página na tela, a menos que encontre a tag de fechamento correspondente </TABLE>. Portanto, se toda a sua página estiver em uma tabela, nada será exibido até que o último </TABLE> seja recebido. Dessa forma, a página não ficará visível para o usuário até que todo o arquivo seja baixado. Quando a quantidade de dados da página é relativamente grande (como resultados de pesquisa de mecanismos de pesquisa), esse recurso causará pausas temporárias. Para evitar esta situação, a página pode ser dividida em várias pequenas tabelas durante a produção. Quando o código HTML de cada <TABLE> para o </TABLE> correspondente for baixado, o navegador irá exibi-lo. Na perspectiva do visitante, a página aparece gradativamente, parte por parte, aparecendo cada vez mais na tela. Parece que a velocidade de exibição dessa página é mais rápida do que baixar o arquivo inteiro e exibi-lo novamente.
Seguindo este princípio para estudar o exemplo anterior, toda a tabela grande da página deve ser dividida em três tabelas separadas. Use a primeira tabela para exibir a barra de navegação superior, ajuste sua largura para que seja grande o suficiente para conter todo o conteúdo e complete-a em um bloco <TABLE></TABLE>. Na metade inferior da página, a segunda tabela da esquerda está alinhada. Use uma terceira tabela para armazenar o conteúdo real. (Veja a Figura 2) Como cada parte é uma tabela completa, cada parte do código será exibida imediatamente após o download. Dessa forma, as barras de navegação superior e esquerda se destacarão mais do resto da página. O usuário imaginará que o download da página começará neste momento e será exibido na tela em breve. Isso é muito melhor do que deixar o usuário diante de uma tela em branco por um longo período de tempo.
O código modificado é o seguinte:
<TABLE BORDER="0" WIDTH="100%">
<TR>
<TD ALIGN="CENTER" VALIGN="TOP"><!-- conteúdo da barra de navegação superior --></TD>
</TR>
</TABELA>
<TABLE BORDER="0" ALIGN="ESQUERDA">
<TR>
<TD ALIGN="LEFT" VALIGN="TOP"><!-- conteúdo da barra de navegação esquerda --></TD>
</TR>
</TABELA>
<TABLE BORDER="0">
<TR>
<TD ALIGN="LEFT" VALIGN="TOP"><!-- conteúdo do corpo da página --></TD>
</TR>
</TABLE>
2. Lembre-se também de fechar outras tags
No exemplo acima, podemos tornar a exibição da página mais rápida no navegador apenas fechando a tag <TABLE> anteriormente. Por analogia, existem algumas tags semelhantes que possuem as mesmas características.
Por exemplo, gere tags <OPTION> para caixas de listagem e caixas de combinação e tags <LI> para itens de lista. Normalmente, os programadores ASP acessam o banco de dados e enviam dados para a caixa de listagem ou caixa de combinação criada por meio de <OPTION>. Nesse momento, uma tag de fechamento <OPTION> é escrita no código. no navegador.
Não use código como este:
Do while not objRS.EOF
strOptionList = strOptionList & "<OPTION VALUE=""" & objRS("ID") &_""">"& _objRS("ProductName")
objRS.MoveNext
Loop
Response.Write "<SELECT SIZE=""1"">" & strOptionList & "</SELECT>"
Para usar código como este:
Do while not objRS.EOF
strOptionList = strOptionList & "<OPTION VALUE=""" & objRS("ID") & _ """>" & objRS("ProductName") & "</OPTION>"
objRS.MoveNext
Loop
Response.Write "<SELECT SIZE=""1"">" & strOptionList & "</SELECT>"
Não use código como este:
<UL>
<LI>Maçãs
<LI>Laranjas
<LI>Bananas
</UL>
Use um código como este:
<UL>
<LI>Maçãs</LI>
<LI>Laranjas</LI>
<LI>Bananas</LI>
</UL>
Agora observe: sua página é exibida mais rapidamente no navegador?
Por favor, não subestime a importância dessas mudanças na melhoria do desempenho dos aplicativos ASP. Talvez, nos livros ou materiais on-line do tipo "Dicas e Sugestões" que você possa encontrar, raramente haja qualquer menção à otimização do código HTML para fazer seu programa rodar mais rápido. Contudo, a aplicação destas tecnologias na prática pode, de facto, melhorar significativamente o desempenho do programa.