O documento discute a otimização da entrega de imagens na internet através da implementação de uma solução baseada no Varnish e na ferramenta Imagine. A solução permitiu reduzir o número de servidores de imagens de 43 para 8 máquinas, diminuir o tempo de carregamento das páginas e melhorar a experiência do usuário através de um cache mais eficiente e menor tráfego de rede. Desafios como falhas de timeout foram superados através de melhorias no kernel e configuração do Varnish.

1. Entregando imagens na
Internet
Caio Tedim

2. Agenda
• Problemas
• Objetivo
• Escopo
• Arquitetura
• Desafios em Produção
• Solução
• Próximos Passos
• Resultados
• Um pouco mais sobre o Varnish
• Perguntas
• Referências

3. Problemas
• Muitos servidores (16+27)
• Percepção na demora no carregamento das
imagens
• Muita leitura em disco
• Muita dependência de NFS

4. Objetivo
• Aumentar a disponibilidade e otimizar a
entrega das imagens do Portal
• Diminuir acessos de leitura ao disco
• Simplificar a infraestrutura de imagens
• Desafio -> diminuir de 27 máquinas para 8 ($$$)

5. Escopo
• Mostrar a solução adotada comparando os
dois cenários (antes e depois)
• Resultados obtidos
• Breve workshop sobre o Varnish

6. Do que falamos?
• Quantidade de imagens servidas por dia
• ~ 4.512.904.784
• Imagens únicas: ~ 784.215
• Tráfego estimado por dia
• ~ 59.2GB
• Requisições por segundo
• ~ 80k

7. Arquitetura Inicial

8. Arquitetura Adotada

9. Arquitetura

10. Comparativo: Varnish x Nginx
• Por que o varnish?
• Por que não continuar com o nginx?
Varnish Nginx
Hits per second (k) 16 15
Longest Transaction (sec) 0,05 3,12
CPU (%) 1,3 0,6
Load Avg 0,01 0,22
0
2
4
6
8
10
12
14
16
18
Carga Máxima

11. Comparativo: Varnish x Nginx
Varnish Nginx
Hits per second (k) 3 3
Longest Transaction (sec) 0,01 0,12
CPU (%) 0,9 0,4
Load Avg 0,01 0,13
0
0,5
1
1,5
2
2,5
3
3,5
Cenário de Produção

12. Desafios Superados em Produção
Sim, tivemos problemas!!

13. Desafios Superados em Produção
• Varnish: Não interpreta os url code
Ex.
– Hífen(“-”) → (%20)
– Interrogação(“?”) → (%3F)
– Solução foi aplicar o vmod URLCode
diponibilizado pelo varnish-cache.org

14. Desafios Superados em Produção
• Varnish: Reiniciava o processo filho
– All worker threads can block on the vcl_pipe
under high load
– Solução foi aplicar o patch 0010-varnishd-
optimize-epoll-thread.patch

15. Desafios Superados em Produção
• Imagens invertidas
– Com o Keep-Alive ativado, é ativo o
pipelining que causava a inversão de algumas
imagens no Safari do iPad e iPhone
– Solução foi fazer um tratamento para o
User-Agent do iPad e iPhone

16. Desafios Superados em Produção
• Falha excessiva de timeout (408) e load
da máquina alto
– Tempo de entrega superior a 30 segundos
– Solução foi realizar espalhamento das
imagens limitando seu número dentro de um
único diretório e aplicar o vmod digest para a
tradução da url.

17. Desafios Superados em Produção
• Exemplo
http://n.i.uol.com.br/ultnot/album/111007afeganistao_f_040.jpg
http://n.i.uol.com.br/_md5/a/c0/ce64ea3f9353730f5b100b74f0261.jpg

18. Desafios Superados em Produção
Total ~ 8.203.459
~ 72 hrs
+250GB
Quantidade Domínio
1.825.441 w3.i.uol.com.br
1.652.733 n.i.uol.com.br
1.251.104 e.i.uol.com.br
1.243.172 j.i.uol.com.br
841.429 tv.i.uol.com.br
613.705 es.i.uol.com.br
294.164 d.i.uol.com.br
226.604 ci.i.uol.com.br
187.547 ce.imguol.com

19. Desafios Superados em Produção
E agora, foi sucesso???

20. Desafios Superados em Produção
NÃO

21. Desafios Superados em Produção
• Falha excessiva de timeout (408) e load da
máquina alto
– Tempo de entrega superior a 30 segundos
– Solução foi realizar um upgrade no kernel
– de 2.6.32-71 para 2.6.32-358.2.1

22. Desafios Superados em Produção
INFO: task httpd:30126 blocked for more than 120 seconds.
"echo 0 > /proc/sys/kernel/hung_task_timeout_secs" disables this message.
httpd D ffffffffffffffff 0 30126 26948 0x00000080
ffff8803bf9b7bb8 0000000000000082 ffff8803bf9b7b28 ffffffff81184b6a
ffff8801aade6780 ffff8801adf36ec0 ffff8803bf9b7b98 ffffffffa0240f97
ffff8803c6fffb18 ffff8803bf9b7fd8 0000000000010518 ffff8803c6fffb18
Call Trace:
[<ffffffff81184b6a>] ? dput+0x9a/0x150
[<ffffffffa0240f97>] ? nfs_lookup_revalidate+0x207/0x5e0 [nfs]
[<ffffffff814c97ae>] __mutex_lock_slowpath+0x13e/0x180
[<ffffffffa023f011>] ? nfs_do_access+0x141/0x420 [nfs]
[<ffffffff814c964b>] mutex_lock+0x2b/0x50
[<ffffffff8117a4d3>] do_lookup+0xd3/0x220
[<ffffffff8117b145>] __link_path_walk+0x6f5/0x1040
[<ffffffff8117bd1a>] path_walk+0x6a/0xe0
[<ffffffff8117beeb>] do_path_lookup+0x5b/0xa0
[<ffffffff8117cb57>] user_path_at+0x57/0xa0
[<ffffffff81091ca0>] ? autoremove_wake_function+0x0/0x40
[<ffffffff81171d3c>] vfs_fstatat+0x3c/0x80
[<ffffffff81171eab>] vfs_stat+0x1b/0x20
[<ffffffff81171ed4>] sys_newstat+0x24/0x50
[<ffffffff810d40a2>] ? audit_syscall_entry+0x272/0x2a0
[<ffffffff81013172>] system_call_fastpath+0x16/0x1b
INFO: task httpd:30126 blocked for more than 120 seconds.

23. Explicando a solução
A solução

24. A solução
Opção pelo uso do Varnish e desenvolvimento
de ferramenta para otimização de imagens
- imagine

25. A solução
O Varnish

26. Varnish
• Open Source
• Acelerador HTTP
• Servidor de proxy reverso
• Balanceador de carga
• 64bit, muito rápido
• Comportamento programável
• Não aceita ssl!!!

27. Por que não SSL?
0
50.000
100.000
150.000
200.000
250.000
300.000
350.000
400.000
OpenSSL Varnish
Nº linhas
• Quantidade de linhas
• Código complexo, com comentários duvidosos

28. O que fazer com ssl ?
Varnish

29. Varnish
• Quantidade requisições http 4.512.904.784/dia
• Quantidade requisições https 24.565.952/dia
99,09%
0,91%
0,00%
20,00%
40,00%
60,00%
80,00%
100,00%
120,00%
http https
Requisições por dia

30. A solução
O Imagine

31. Imagine
• O que é?
- Servlet (Java 7) desenvolvida por ROd e
Leonardo Nickel (Time de CMS)
- Libs utilizadas
- optipng
- GraphicsMagic
- WebP
- jpegtran

32. Imagine
• Como funciona o Imagine?
- Remove exif (metainformações)
- Otimiza a paleta de cores
• WebP
- PNG: 26% menor
- JPEG/JPG: 25-34% menor

33. Imagine

34. Imagine
32K jpg/webp
60K jpg

35. Próximos Passos
 Aumentar o cache do Varnish
o Aumentar o tempo do objeto em cache
o Fazer o Varnish ir buscar o objeto requisitado
no Varnish vizinho, caso não tenha no cache
o Migrar os domínios de.i.uol.com.br,
simguol.com e ads.imguol.com
 Aplicar o patch de correção de load para as
demais máquinas

36. Resultados
• Carregamento das páginas mais rápidas
• Melhora na experiência do usuário
• Cache mais eficiente, minimizando o
acesso ao backend
• Menor tráfego de banda

37. Um pouco mais sobre Varnish

38. Varnish
• Varnishd
• Varnishlog
• Varnishncsa

39. Varnish
• Varnishd
– VCL (Varnish Configuration Language)
– Cache do varnish pode utilizar até o dobro
da memória mencionada

40. Varnish
• Varnishlog
– Log em memória

41. Varnish
• Varnishncsa
– NCSA combined log format
Client_IP_address -User_Name [Date:Time -TimeZone] "Method Object
HTTP_version" HTTP_StatusCode BytesSent

42. Varnish

43. Perguntas

44. Referências
• http://www.varnish-cache.org
• https://www.varnish-cache.org/docs/trunk/phk/ssl.html
• http://www.youtube.com/watch?feature=player_embedded&v=eAbamezUOjs
• https://www.varnish-cache.org/docs/3.0/reference/varnishd.html
• https://www.varnish-cache.org/trac/ticket/1285
• https://developers.google.com/speed/webp/
• https://developers.google.com/speed/docs/best-practices/payload
• https://www.varnish-cache.org/docs/3.0/tutorial/sizing_your_cache.html

45. Fim
Obrigado
Caio Tedim Francisco – cfrancisco@uoldiveo.com