O seu Portal ou Web Site é lento?

Artigo publicado por Gonçalo Caeiro em 25 de Julho de 2011

Um estudo da Amazon.com indica que por cada 100ms que uma página demora a carregar no Web browser a Amazon.com perde 1% de vendas . Posto de outra forma, cada segundo a mais no carregamento de uma página custa à Amazon.com 10% das suas vendas.

Os utilizadores percepcionam a qualidade de um portal (web site) tendo em consideração a sua velocidade, funcionalidade e aspecto gráfico. Uma das forças da Google foi sempre a velocidade de obtenção dos resultados das pesquisas e a velocidade com que a janela de procura aparece no Web browser.

Aproximação Integrada de Aceleração

A velocidade de carregamento das páginas nos Web browsers depende de um conjunto alargado de factores: da velocidade de ligação, da velocidade do Web browser, da velocidade do servidor, e da programação do portal. Destes quatro factores apenas os dois últimos estão sobre controlo total do provedor do portal. Os dois primeiros factores dependem de factores externos mais ou menos controláveis.

A tarefa é por isso tentar controlar o incontrolável,ou tornar a experiência do utilizador o mais rápida e harmoniosa possível, independemente das condições da rede e dos dispositivos clientes.

Qual o Impacto da Performance no Mundo Mobile?

A velocidade da internet através de cabo ou fibra óptica é cada vez mais rápida, com pontos de acesso residenciais a chegaram acima dos 100mbps. Contudo nos dispositivos móveis as ligações são muitas vezes de 1mbp efectivos. Isto quer dizer que as empresas têm de continuar a estar atentas à performance dos Web Sites. Existe por vezes a falsa sensação de rapidez de um Web Site, quando na verdade esse Web site se apresenta lento em dispositivos móveis smartphones e tablets.

Velocidade de Ligação

A velocidade de ligação é um dos componentes mais importantes. A sua importância vem do impacto óbvio da velocidade, mas principalmente por não controlarmos a largura de banda efectiva que o dispositivo cliente dispõe. O objectivo deverá ser por isso eliminar ou reduzir ao mínimo possível essa incerta.

Aqui Abaixo listamos uma lista de boas práticas por ordem de prioridade:

1 -  Cache-Control. Especificar a html tag “Cache-Control” possível, para que o Web browser guarde os conteúdos no dispositivo cliente;

2 -  Cache-Control public. Especificar a tag “Cache-Control” indicando public onde possível para permitir a utilização de cache nos internet proxies;

3 -  Usar JS e CSS externos. Ao usar estes recursos externos o Web browser pode fazer cache. Mas deve-se consolidar as CSS de forma a ter o menor número possível de CSS. Lembre-se que cada ligação estabelecida provoca latência.

4 -  GZIP. Comprimir e fazer minify dos ficheiros JavaScript e CSS.

5 -  Domínios Cookieless. Mover os conteúdos estáticos ou semi-estáticos para um domínio cookieless,( um Web site que não cria nem processa Cookies). Isto permite eliminar o envio de cookies na obtenção de imagens ou CSS.

6 -  Imagens. Optimizar as imagens usando formatos png e jpg com máximo de compressão (e sem perda de informação).

7 – Utilizar uma CDN. As CDN (content delivery networks) comercializadas em formato standard não têm larguras de banda execpcionais (entre 200KB/s a 500KB/s), mas permitem escalabildidade e previsibilidade. Os clientes deixam de “atacar” uma fonte única para poderem ser servidos por múltiplos servidores e mais próximo do seu acesso internet.

8 – Vários domínios. Servir os seus conteúdos estáticos através de vários domínios. Isto permitirá que o Web browser abra várias ligações simultâneas e que utilize o máximo de largura de banda disponível.

Velocidade do Web browser

Existe uma miríade de Web browsers (Chrome, IE, Firefox, Safari, Opera) nas sobretudo uma miríade de dispositivos, uns com processadores mais rápidos e com placas gráficas mais eficientes e outros mais “móveis” e com menos performance.

A seguinte lista de boas práticas ajuda no aumento da velocidade de carregamento e renderização das páginas:

1 -  Tamanho das imagens. Especificar o tamanho das imagens indica ao Web browser o tamanho ocupado pela imagem. O Web browser pode começar a fazer a “rendarização” (apresentação / visual) da página mesmo antes de ter recebido a imagem. Caso contrário terá de esperar pelo carregamento imagem antes de iniciar a sua apresentação. Num dispositivo móvel uma simples imagem de 10K pode demorar 1s a carregar devido à latência da rede, significando que o utilizador e vai esperar mais tempo e ver “flickers” (página a piscar).

2-  Eliminar redimensionamento das imagens. O redimensionamento das imagens é uma tarefa computacionalmente pesada que se deve evitar a todo o custo. As imagens devem por isso ser enviadas na sua resolução nativa.

3 -  Eliminar expressões no CSS. O cálculo de expressões nos ficheiros CSS (Cascade Style Sheets) é também pesado e deve ser evitado.

4 -  Reduzir ao mínimo os ficheiros JS. O parsing (análise sintática) do código aplicacional JavaScript demora muito tempo. Como regra normal temos 1ms por cada 1Kb de JS.

Velocidade do Servidor

Os portais hoje em dia servem-se normalmente de bases de dados e de um conjunto de outros recursos. A seguinte lista pode ajudar a tornar o seu portal Web mais rápido:

1 – Usar RAM. A memória RAM é hoje em dia muito barata. Garanta que o seu sistema operativo não está a fazer swap de memória.

2 -  Usar discos SSD. Muitas vezes as bases de dados que servem o portal têm menos de algumas dezenas de GB. Os discos SSD são uma opção mais barata do que comprar mais servidores e colocá-los em cluster. Um disco SSD é tipicamente mais rápido entre 10X a 100X do que os discos rígidos equivalentes.

3 -  Configurar bem as VMs. Devem ler-se atentamente os artigos relativos a melhores práticas na configuração das máquinas virtuais. Existem questões importantes em VMWare sobre os impactos das configurações do TCP Offload, Segmentation Offload, Server Side Scaling. Existem aspectos igualmente importantes sobre a questão da memória (dedups, swap parcial). (Este tema é especialmente complexo porque depende da configuração exacta das versões de VMWare / HyperV, sistemas operativos dos clientes, suporte das placas de rede físicas)

Programação Orientada a Velocidade

Grande parte dos portais Web é suportada em bases de dados. São cada vez mais os portais que utilizam componentes técnicas Ajax, o que permite dinamismo nas páginas. Mas esse dinamismo tem um custo: provoca pedidos frequentes ao servidor Web e consequentemente imensos pedidos ao servidor de base de dados.

Indicamos a seguinte lista de sugestões:

1 -  Cache de lookups. Carregar para memória as tabelas de lookup. Cada vez que precisar consultar países, distritos ou códigos postais já não é necessária uma consulta à base de dados.

2 -  Cache de Dados. Os servidores actuais comportam a esmagadora maioria dos objectos transacionados semi-estáticos em memória. Isto é produtos, categorias, preços, podem de facto ser carregados em memória. Se cada objecto ocupar 1KB, o que já é imenso, 1GB são 1,000,000 de objectos. Devem programar-se os objectos para que sejam manipulados em memória. Os motores de base de dados são menos eficientes a manipular objectos que pode ser mapeados em dicionários simples. Isto porque se elimina as conecções às bases de dados, sql parsers, planos de execução, obtenção de addos e empactoramento, serialização de dados e envio dos dos dados.

3 -  Paralelizar e desbloquear. Libertar as páginas o mais cedo possível através da execução assíncrona do maior número de tarefas possívels. Usar mecanismos de lançamento de threads adicionais ou de sistemas de mensagens (queue) para delegar processamentos de dados adicionais para outros sistemas ou tempo posterior.

FALE CONNOSCO!

A Infosistema tem experiência nas áreas acima referidas e disponibilizamos os seguintes serviços aos nossos clientes:

Auditoria (duração típica: 1 semana)

Auditoria e análise de performance de Web sites

a -  Auditoria global ao Web site, dos tempos de carregamento e visualização;

b -  Detecção de problemas críticos;

c -  Sugestão prioritizada e justificada das medidas a tomar;

d -  Benchmark do seu portal Web com portais da concorrência na sua área geográfica e com os melhores portais a nível mundial. O Bencharmark consiste na comparação da velocidade de apresentação páginas no estado “empty-cache experience” e em utilizações recorrentes. Esta análise permite analisar a qualidade da experiência do utiizador na primeira vez que visita o seu site e nas vezes posteriores.

Formação (duração típica: 2 dias)

Curso de formação sobre os aspectos de aceleração listados neste artigo com enfoque em testes práticos, nomeadamente:

a -  Como realizar uma auditoria a um Web site;

b -  Que ferramentas existem no mercado e como analisar os dados. Diferenças e problemas de algumas ferramentas;

c -  Ckeck list de aproximação e resolução dos problemas identificados;

d -  Exemplificação e teste de aplicação das soluções propostas.

Consultoria (duração dependente do projecto)

Serviços profissionais no apoio de implementação de soluções, nas seguintes vertentes:

a -  Configuração e optimização de servidores aplicacionais;

b -  Optimização de aplicações Web e das páginas (html, CSS, JS);

c -  Introdução da biblioteca de software Infosistema para controlo e geração automática das tags “Cache” dos recursos Web utilizados.

A Infosistema desenvolveu uma biblioteca de software que permite aos programadores abstraírem-se de muitas questões mencionadas neste artigo, continuando a programar sem a necessidade de se preocuparem com as questões de performance. A nossa biblioteca de software assegura toda essa gestão optimizada garantido dois aspectos essenciais:

a -  Cada recurso Web é usado pela cache do browser indefinidamente pelo Web browser até ser modificado no servidor (sem estabelecer qualquer ligação com o servidor. Caso contrário estaríamos a usar Etags).
b -  Quando for modificado, o recurso Web é imediatamente recarregado no Web browser (sem necessidade de recorrer a Etags).

Pode falar connosco e ganhar performance no carregamento das páginas do seu portal ou aplicação Web. Pode assim ganhar clientes ou poupar nos custos da largura de banda após implementação das medidas de optimização.