frontend (rails for kids)

22

Upload: daniel-lopes

Post on 18-May-2015

1.340 views

Category:

Technology


1 download

DESCRIPTION

Entenda porque 90% das aplicações os ajustes de performance deveriam primeiro serem feitos no front-end. Entenda que ajustes simples como requisições compactadas com GZip e expiração futura para cache podem ajudar sua App Rails. E descubra como os recursos do Rails ajudam estes mecanismos a funcionar.

TRANSCRIPT

Page 1: Frontend (Rails For Kids)
Page 2: Frontend (Rails For Kids)
Page 3: Frontend (Rails For Kids)

e-Genial•Cursos de Rails•Cursos de Flex•130 alunos

Comunidade•RailsGuides•github.com/danielvlopes•blog.areacriacoes.com.br

Page 4: Frontend (Rails For Kids)

PERFORMANCE?!

Page 5: Frontend (Rails For Kids)
Page 6: Frontend (Rails For Kids)

80% a 90% do tempo é gasto no front-end.

Page 7: Frontend (Rails For Kids)

STEVE SOUDERSSTEVE SOUDERS

Page 8: Frontend (Rails For Kids)

1. FAÇA MENOS REQUISIÇÕES

2. REDE DE DISTRIBUIÇÃO DE CONTEÚDO (CDN)

3. CACHE OTIMIZADO

4. COMPACTAÇÃO

5. CSS NO TOPO

6. SCRIPTS NO FINAL

7. EVITE EXPRESSÕES CSS

8. CSS E JS EXTERNOS

9. REDUZA PESQUISAS DNS

10.MINIZE JAVASCRIPT

11.EVITE REDIRECIONAMENTOS

12.REMOVA SCRIPTS DUPLICADOS

13.CONFIGURE E-TAGS

14.AJAX CACHE

Page 9: Frontend (Rails For Kids)

FERRAMENTAS ESSÊNCIAIS

YSLOW PAGESPEED

Page 10: Frontend (Rails For Kids)

RUBY ON RAILS

Full-Stack Web Framework

=

Page 11: Frontend (Rails For Kids)

RAILS – OTIMIZAÇÃO BUILTIN

• Page Cache• Action Cache• Fragment Cache• Global Cache• Cache de consultas Active Record• Memoize

BACKEND !!!!

Page 12: Frontend (Rails For Kids)

VAMOS ATACAR O FRONTEND

Page 13: Frontend (Rails For Kids)

1. FAÇA MENOS REQUISIÇÕES• Css sprites http://blog.areacriacoes.com.br/2008/5/21/menu-em-xhtml-com-css-sprite

• Unificar JS e CSS

8. CSS e JS EXTERNOS

10.MINIMIZE JS E CSS

12.REMOVA SCRIPTS DUPLICADOS

Resolvendo

Page 14: Frontend (Rails For Kids)

Default nem sempre é a melhor opção

Resolvendo

ASSET PACKAGERASSET PACKAGER

Page 15: Frontend (Rails For Kids)

5. CSS NO TOPO

6. SCRIPTS NO FINAL

Resolvendo

Page 16: Frontend (Rails For Kids)

3. CACHE OTIMIZADO

4. COMPACTAÇÃO

Resolvendo

Page 17: Frontend (Rails For Kids)

2. CDN • Amazon CloudFront• Akamai, LimeLight, Mirror Image, etc• SubDomínios ou outros Hosts

Resolvendo

Page 18: Frontend (Rails For Kids)

13.E-TAGS

Resolvendo

Page 19: Frontend (Rails For Kids)

1. FAÇA MENOS REQUISIÇÕES

2. REDE DE DISTRIBUIÇÃO DE CONTEÚDO (CDN)

3. CACHE OTIMIZADO

4. COMPACTAÇÃO

5. CSS NO TOPO

6. SCRIPTS NO FINAL

7. EVITE EXPRESSÕES CSS

8. CSS E JS EXTERNOS

9. REDUZA PESQUISAS DNS

10.MINIZE JAVASCRIPT

11.EVITE REDIRECIONAMENTOS

12.REMOVA SCRIPTS DUPLICADOS

13.CONFIGURE E-TAGS

14.AJAX CACHE

Page 20: Frontend (Rails For Kids)

• REDUZA PESQUISAS DNS

• Menos hosts e KeepAlive (default)

• EVITE REDIRECIONAMENTOS

• AJAX CACHE

• Max-age e cache-control

• URL GET com ID ou identifcador único

Page 21: Frontend (Rails For Kids)

GRADE A

Page 22: Frontend (Rails For Kids)

MUITO OBRIGADO