1.
Técnicas de frontend para
aplicações django
por Rael Max

2.
Quem sou eu.
@raelmax
http://raelmax.com

3.
Porque é importante?

4.
Performance

5.
Manutenção

6.
Escalabilidade

7.
Organização

8.
Dicas gerais

9.
menos requisições
css sprites, combine os arquivos(css/js),
data uris

10.
arquivos menores
minifique o css, javascript e o html também.
habilite o gzip no servidor.

11.
cada coisa no seu lugar
css no topo e javascript no fim. nunca,
nunca misture tags do django com
javascript.

12.
NÃAAAAAAAAAAAAAAO!

13.
Melhor assim. data-attributes ftw!

14.
Dicas de template

15.
elementos fake

16.
contrib.webdesign
● gere textos “lorem ipsum” para testes no
template
● o projeto cresce e fica perdido por lá, não
recomendo.

17.
templatetag with
contatenar strings, útil quando se precisa de
uma string específica como parâmetro de algo:

18.
templatetag with
diminuir acesso ao banco quando se usa o
mesmo objeto várias vezes no mesmo
template:

19.
includes parametrizáveis
reuso e organização de código.

20.
for in + if
útil quando se precisa de separação de
conteúdo por blocos html

21.
Ferramentas

22.
prototipagem
●
●
●
●
twitter bootstrap;
foundation;
flat ui;
html5-boilerplate.

23.
performance
●
●
●
●
●
django-compressor (compressão css/js)
gruntjs (várias tarefas de front)
smush.it (otimização de imagens)
csslint
jslint

24.
links
● 26 técnicas de otimização: http://goo.
gl/hV1b2r
● Dicas do Yahoo!:
http://goo.gl/nN2pT6

25.
Perguntas? Palavrões?