Seu site voando

Seu site voando
Maurício Linhares - @mauriciojr
sábado, 13 de novembro de 2010

Quem?
Java, Ruby, Objective-C, whatever
Developer da OfﬁceDrop.com
Agile Coach que escreve código
Finge que é músico jogando Rock band

Onde?

Aprenda a respeitar o
protocolo HTTP
Ler o RFC ajuda

GET é PEGAR uma
CÓPIA, macho
Dicionário: não cause alteraçoes no seu BANCO,
mané

Quando usar GET?
Visualizar informaçoes
Buscar informaçoes (usuários devem ser
capazes de fazer bookmarking)
Análise de tráfego (Analytics? Alguém?)

POST é MANDAR um
mói de coisa, abestado
E isso pode causar mudanças no seu BANCO

Princípio da
idempotência
Vários GETs == mesmo resultado
Vários POSTs == várias linhas no banco

Google Web Accelerator
Uma história épica e dramática em um único
capítulo, no seu Netscape mais próximo

Otimizações de front-
end
Mais fácil do que achar um cearense que não
sabe contar piada

Use um proxy-server pra
servir o seu conteúdo
Nginx, por favor
!"#$%&
!"#$%&'
('
!"#$%&''
)'
!"#$%&''
*'

Deﬁna cabeçalhos de
expires pra todo o
conteúdo estático em um
futuro muito distante

Problemas?
Se você atualizar o arquivo, o browser não
vai ver
É necessário renomear os arquivos ou mudar
a chamada pra eles
/javascripts/jquery.js?12398766

Nginx conﬁg
location ~ ^/(images|javascripts|stylesheets)/ {
root /home/deployer/shop/current/public;
expires max;
break;
}

Ligue a compressão
GZIP do seu proxy

Nginx conﬁg
gzip on;
gzip_http_version 1.0;
gzip_proxied any;
gzip_min_length 500;
gzip_disable "MSIE [1-6].";
gzip_types text/html text/xml text/
javascript;

Coloque o seu CSS no
início da página
Assim o IEca não ﬁca fazendo pantim na hora de
mostrar o HTML

Use CSS sprites

No CSS
<div
style="background-‐image:
url
('a_lot_of_sprites.gif');

background-‐position:
-‐260px
-‐90px;

width:
26px;
height:
24px;">
</div>

Contrate uma CDN pra
servir conteúdo estático
e de usuários
CDN == Content Delivery Network
S3 pra todos nós que somos pobres

Junte todos os CSS e
JavaScripts em um único
arquivo
:cache => “todos_os_estilos”
faz isso pra você no Rails

Faça crushing dos seus
PNGs
pngcrush for the win

Use hosts separados pra
servir conteúdo estático
assets1.meusite.com.br

Remova os metadados de
JPEGs
convert -strip source.jpeg destination.jpeg
ImageMagick

Otimizações de
JavaScript

Coloque Scripts no FIM
da página

Faça o download de
scripts de forma
assíncrona
document.write(“<script src=‘something.js’>”)
XHR fazendo eval no script
dom.createElement( “script” )

Faça a miniﬁcação dos
seus scripts
YUI Compressor
JSMIN
JS Miniﬁer

Quebre os scripts da
primeira página em 2
beforeOnload.js
afterOnload.js

Use requisições Ajax
para navegar no seu site
Twitter.com? Alguém?

Dúvidas?
É nóis que vôa, bruxão!

Seu site voando

Mais conteúdo relacionado

Mais procurados

Destaque

Semelhante a Seu site voando

Mais de Maurício Linhares

Seu site voando