Os desenvolvedores de Web Sites necessitam ter consciência da importância do tema performance. De nada adianta culpar o usuário, a conexão com a Internet ou o servidor de hospedagem. Os desenvolvedores de Web sites devem projetar e codificar aplicações de alto desempenho.
Muitas vezes temos a impressão de que a performance de um Web site é algo supérfluo, pois a maioria dos usuários acessa a Internet por meio de conexões de banda larga.
Se você desenvolve uma aplicação que não utiliza corretamente os recursos do sistema, a aplicação pode, por exemplo, consumir muita memória ou bloquear uma determinada operação por um longo período de tempo, então de nada adianta a conexão de alta velocidade do usuário, pois o tempo de resposta será alto e o consumo de recursos idem.
O tamanho das páginas aumenta a cada ano. No ano 2000 eram comuns páginas com menos de 100 KB, mas hoje em dia alguns sites têm páginas com vários MBs. Além disso, o número de requisições tem aumentado.
Uma requisição é a solicitação de um recurso (imagem, arquivo .css, .js, etc) pelo navegador. Atualmente, a página inicial da maioria dos sites executa de setenta a cem requisições. O site do Google tem quinze.
O que temos que ter mente é que alguns milissegundos no desempenho já afetam as receitas do site negativamente.
Veremos neste artigo que o desempenho de uma aplicação é obtido com técnicas de programação adequadas que serão descritas nas próximas seções.
1- Minimize o vaivém de solicitações e respostas pela rede
A quantidade de requisições aumenta a cada ano e a maioria dos Web sites tem atualmente mais de setenta requisições por página.
Os navegadores mais modernos processam no máximo oito requisições de cada vez, sendo que a maioria processa no máximo seis requisições. Se um Web site contém mais de setenta requisições para serem processadas, não é difícil deduzir que haverá atraso na exibição do conteúdo do site.
Para minimizar o vaivém de solicitações e respostas pela rede implemente as técnicas descritas a seguir:
Implemente o modo de programação Ajax
O modo de programação Ajax é uma das melhores opções que temos para reduzir o vaivém de solicitações e respostas pela rede, pois você reduz a quantidade de informações enviadas pela rede.
Atualmente, existem centenas de frameworks usados para implementar o modo de programação Ajax. Cada um inventa o seu. Mas os mais empregados são o Microsoft Ajax e o Ajax do jQuery.
Ao implementar o modo de programação Microsoft Ajax, dê atenção especial aos atributos EnableCdn, EnablePartialRendering, LoadScriptsBeforeUI e ScriptMode do controle ScriptManager. Para reduzir o número de requisições, reduzir o bloqueio de páginas e o carregamento desnecessário de arquivos .js.
Por exemplo, defina o atributo ScriptMode como Release para fazer com que o consumo de memória seja reduzido e as imagens baixadas pelo arquivo WebResources.axd sejam armazenadas em cache. Observe a Listagem 1.
Listagem
1.
Controle ScriptManager declarado para execução em modo Release
<asp:ScriptManager ID="ScriptManager1" ScriptMode="Release" runat="server"></asp:ScriptManager>
Para evitar que os arquivos .js do Microsoft Ajax impeçam o carregamento do conteúdo da página, defina LoadScriptsBeforeUI como false, conforme Listagem 2.
Listagem
2.
LoadScriptsBeforeUI igual a false carrega os scripts no final da página
<asp:ScriptManager ID="ScriptManager1" LoadScriptsBeforeUI="false" ScriptMode="Release" runat="server"></asp:ScriptManager>
Em vez de armazenar uma versão local dos arquivos .js do Microsoft Ajax, você tem a opção de usar a rede CDN da Microsoft, basta definir o atributo EnableCdn como true (Listagem 3).
Listagem
3.
Controle ScriptManager com CDN ativado
<asp:ScriptManager ID="ScriptManager1" EnableCdn="true" LoadScriptsBeforeUI="false" ScriptMode="Release" runat="server"></asp:ScriptManager>
Em alguns casos, ao usar os controles do Ajax Control Toolkit, você pode desativar o atributo EnablePartialRendering e evitar que um arquivo .js extra seja carregado desnecessariamente.Veja a Listagem 4.
Listagem
4.
Rendenização parcial desativada no controle ScriptManager
<asp:ScriptManager ID="ScriptManager1" EnableCdn="true" EnablePartialRendering="false" LoadScriptsBeforeUI="false" ScriptMode="Release" runat="server"></asp:ScriptManager>
Nota: o controle UpdatePanel é o único que requer o atributo EnablePartialRendering como true.
Combine vários arquivos .js em um único arquivo definindo os elementos <CompositeScript> e <Scripts>, conforme a Listagem 5.
Listagem
5.
Combinando arquivos com os elementos <CompositeScript> e <Scripts>
01 <asp:ScriptManager runat="server">
02 <CompositeScript>
03 <Scripts>
04 <asp:ScriptReference Name="jquery" />
05 <asp:ScriptReference Name="jquery.ui.combined" />
06 <asp:ScriptReference Name="WebForms.js"
Assembly="System.Web"
Path="~/Scripts/WebForms/WebForms.js" />
07 <asp:ScriptReference Name="WebUIValidation.js"
Assembly="System.Web"
Path="~/Scripts/WebForms/WebUIValidation.js" />
08 <asp:ScriptReference Name="MenuStandards.js"
Assembly="System.Web"
Path="~/Scripts/WebForms/MenuStandards.js" />
09 <asp:ScriptReference Name="GridView.js"
Assembly="System.Web"
Path="~/Scripts/WebForms/GridView.js" />
10 <asp:ScriptReference Name="DetailsView.js"
Assembly="System.Web"
Path="~/Scripts/WebForms/DetailsView.js" />
11 <asp:ScriptReference Name="TreeView.js"
Assembly="System.Web"
Path="~/Scripts/WebForms/TreeView.js" />
12 <asp:ScriptReference Name="WebParts.js"
Assembly="System.Web"
Path="~/Scripts/WebForms/WebParts.js" />
13 <asp:ScriptReference Name="Focus.js"
Assembly="System.Web"
Path="~/Scripts/WebForms/Focus.js" />
14 </Scripts>
15 </CompositeScript>
16 </asp:ScriptManager>" [...] continue lendo...
