Client-side

Steve Souders, o criador do YSlow, ex-chefe de performance do Yahoo e que agora está trabalhando no Google, acaba de lançar ontem, durante sua palestra na Web Expo 2.0, uma ferramenta para testes de boas práticas de desenvolvimento front-end relacionadas à performance das páginas chamada Cuzzilion. Essa ferramenta permite que você teste diferentes técnicas para otimizar a performance das suas páginas nos browsers, e esses testes podem ser salvos e compartilhados com a comunidade. O nome é uma espécie de corruptela da frase “cuz there are zillion pages to check“, mas poderia ser também, existem zilhões de maneiras de se fazer desenvolvimento para a Web.

Na página do Cuzzilion exitem alguns descobertas bem interessantes e valiosas como por exemplo:

1. Scripts inline bloqueiam a renderização  -  Nada em uma página renderiza até que todos os scripts inline tenham terminado de executar. Isso é verdade no Firefox (1.5, 2.0) e no Internet Explorer (6, 7, 8). Para evitar esse problema certifique-se que seus scripts executam rapidamente ou mova seu JavaScript para arquivos externos. Se você precisar ter um script inline que demora para executar, dispare a execução da função via setTimeout.
2. Stylesheets bloqueiam os downloads no Firefox e a execução de JavaScript no IE - stylesheets bloqueiam todos os outros downloads. Isso é especialmente ruim para JavaScript em arquivos externos. No IE os stylesheets não bloqueiam os outros downloads, mas bloqueiam a execução do JavaScript.
3. Download paralelo de scripts no IE8 - IE8 é o primeiro browser a permitir o download paralelo de scripts. Duas coisas que merecem destaque: primeiro, os componentes não são carregados na mesma ordem em que aparecem no código. A razão para isso é que iframes e imagens bloqueiam o download paralelo de scripts. Por isso, se seu código tem script, stylesheet, script, iframe, script, image, script, o IE8 vai jogar o iframe e a imagem para o fim da fila e vai carregar os componentes na seguinte ordem: script, stylesheet, script, script, script, iframe, image.

Um dos problemas que pode acontecer com o uso dessa ferramenta nas próximas semanas é a lentidão do serviço, já que os servidores devem receber um número elevado de acessos.

Agora, ao projetar suas páginas, você pode testar algumas combinações para ver qual delas tem a melhor performance. No caso da Globo.com, pretendo fazer alguns testes com as nossas front pages usando scripts e stylesheets tanto inline como em arquivos externos e alterando a ordem de carregamento desses componentes. Na verdade, esse estudo já vinha sendo realizado e essa ferramenta pode ajudar a achar o número adequado de arquivos externos, chamadas inline e a melhor posição para eles no documento. O resutado desse trabalho vai ser apresentado aos times do Scrum junto a outras pequenas regras que devem ser seguidas ao desenvolver código client-side para as páginas do portal.