O Google acaba de abrir o código do Page Speed, uma ferramenta utilizada internamente para otimizar os sites do Google, especialmente no que diz respeito a velocidade com que as páginas são carregadas.
Page Speed é um plugin para o Firefox que roda através do Firebug e funciona em Linux, Mac e Windows XP/Vista. Ao ser executado, o Page Speed analisa parte da configuração do servidor web bem como o código que é enviado pelo servidor para criar uma lista de resultados que inclui sugestões sobre como melhorar as páginas. A análise é baseada numa lista de melhores práticas organizadas em cinco categorias:
- Otimização de cache — manter os dados e lógica da aplicação completamente fora da rede
- Minimização de requisições — reduzir o número de ciclos de "request-response"
- Minimização do tamanho da requisição — reduzir o tamanho do upload
- Minimização da resposta do servidor — reduzir o tamanho das respostas, downloads e páginas em cache
- Otimização da renderização do browser — melhorar o layout de uma página
Essas práticas consideram o page load time, como sendo o tempo entre a requisição de uma página e o momento em que ela é vista pelo cliente. O page load time inclui a criação de conexões TCP, resolução de nomes DNS, envio de requisições, busca de recursos incluindo os que estão em cache, execução de scripts e renderização.
As sugestões oferecidas pela ferramenta são:
- Evitar expressões CSS
- Combinar arquivos CSS em um único arquivo
- Combinar arquivos JavaScript em um único arquivo
- Adiar o carregamento de JavaScript
- Habilitar compressão gzip
- Promover o cache de browsers
- Promover o cache de proxy
- "Minificar" código JavaScript
- Reduzir o tamanho de cookies
- Reduzir as consultas de DNS
- Reduzir redirecionamentos
- Otimizar imagens
- Otimizar a ordem de folhas de estilo e scripts
- Colocar o CSS no cabeçalho do documento
- Remover CSS não utilizado
- Disponibilizar recursos através de URLs consistentes
- Disponibilizar conteúdo estático através de um domínio sem cookies
- Especificar as dimensões de imagens
- Utilizar seletores CSS de maneira eficiente
As sugestões são pontuadas e ordenadas por prioridade. Por exemplo, ao acessar a página inicial do Facebook, a sugestão com prioridade mais alta é: “Os arquivos CSS a seguir foram incluídos após uma referência a um arquivo JavaScript no cabeçalho do documento. Para garantir que os arquivos CSS sejam carregados paralelamente, sempre inclua arquivos CSS antes de arquivos JavaScript.”
O Painel de Atividades do Page Speed disponibiliza todas as atividades realizadas pelo browser incluindo eventos relacionados a rede e tempo de execução de código JavaScript medidos em milis segundos. Isso é útil para verificar o trecho onde o browser gasta a maior parte do tempo quando carrega uma determinada página. De maneira geral, o Page Speed parece ser uma ferramenta indispensável para desenvolvedores web.