Seu site voando

Post on 19-Jun-2015

2.317 views 1 download

description

Melhorando a performance da sua aplicação web sem dor nem sofrimento com dicas simples e fáceis de serem implementadas em qualquer aplicação web.Material apresentado originalmente no Maré de Agilidade Fortaleza, 2010.

Transcript of Seu site voando

Seu site voandoMaurício Linhares - @mauriciojr

sábado, 13 de novembro de 2010

Quem?

Java, Ruby, Objective-C, whatever

Developer da OfficeDrop.com

Agile Coach que escreve código

Finge que é músico jogando Rock band

sábado, 13 de novembro de 2010

Onde?

sábado, 13 de novembro de 2010

Aprenda a respeitar o protocolo HTTP

Ler o RFC ajuda

sábado, 13 de novembro de 2010

GET é PEGAR uma CÓPIA, macho

Dicionário: não cause alteraçoes no seu BANCO, mané

sábado, 13 de novembro de 2010

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?)

sábado, 13 de novembro de 2010

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

sábado, 13 de novembro de 2010

Princípio da idempotência

Vários GETs == mesmo resultadoVários POSTs == várias linhas no banco

sábado, 13 de novembro de 2010

Google Web AcceleratorUma história épica e dramática em um único

capítulo, no seu Netscape mais próximo

sábado, 13 de novembro de 2010

Otimizações de front-end

Mais fácil do que achar um cearense que não sabe contar piada

sábado, 13 de novembro de 2010

Use um proxy-server pra servir o seu conteúdo

Nginx, por favor

!"#$%&

!"#$%&'('

!"#$%&'')'

!"#$%&''*'

sábado, 13 de novembro de 2010

Defina cabeçalhos de expires pra todo o

conteúdo estático em um futuro muito distante

sábado, 13 de novembro de 2010

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

sábado, 13 de novembro de 2010

Nginx config

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

sábado, 13 de novembro de 2010

Ligue a compressão GZIP do seu proxy

sábado, 13 de novembro de 2010

Nginx config

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;

sábado, 13 de novembro de 2010

Coloque o seu CSS no início da página

Assim o IEca não fica fazendo pantim na hora de mostrar o HTML

sábado, 13 de novembro de 2010

Use CSS sprites

sábado, 13 de novembro de 2010

No CSS

<div  style="background-­‐image:  url('a_lot_of_sprites.gif');        background-­‐position:  -­‐260px  -­‐90px;        width:  26px;  height:  24px;"></div>

sábado, 13 de novembro de 2010

Contrate uma CDN pra servir conteúdo estático

e de usuáriosCDN == Content Delivery NetworkS3 pra todos nós que somos pobres

sábado, 13 de novembro de 2010

Junte todos os CSS e JavaScripts em um único

arquivo:cache => “todos_os_estilos”faz isso pra você no Rails

sábado, 13 de novembro de 2010

Faça crushing dos seus PNGs

pngcrush for the win

sábado, 13 de novembro de 2010

Use hosts separados pra servir conteúdo estático

assets1.meusite.com.brassets2.meusite.com.brassets3.meusite.com.brassets4.meusite.com.br

sábado, 13 de novembro de 2010

Remova os metadados de JPEGs

convert -strip source.jpeg destination.jpegImageMagick

sábado, 13 de novembro de 2010

Otimizações de JavaScript

sábado, 13 de novembro de 2010

Coloque Scripts no FIM da página

sábado, 13 de novembro de 2010

Faça o download de scripts de forma

assíncrona

document.write(“<script src=‘something.js’>”)

XHR fazendo eval no script

dom.createElement( “script” )

sábado, 13 de novembro de 2010

Faça a minificação dos seus scripts

YUI Compressor

JSMIN

JS Minifier

sábado, 13 de novembro de 2010

Quebre os scripts da primeira página em 2

beforeOnload.jsafterOnload.js

sábado, 13 de novembro de 2010

Use requisições Ajax para navegar no seu site

Twitter.com? Alguém?

sábado, 13 de novembro de 2010

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

sábado, 13 de novembro de 2010