O documento discute como a Amazon CloudFront e a Amazon Route 53 podem ser usadas para acelerar conteúdo dinâmico e estático de aplicações web, melhorando a performance e disponibilidade. A CloudFront pode cachear conteúdo estático e dinâmico de forma flexível, enquanto a Route 53 fornece roteamento baseado em latência para melhorar o tempo de resposta. Juntos, esses serviços podem remover carga dos servidores originais e melhorar significativamente a experiência do usuário.

1. © 2014 Amazon.com, Inc. and its affiliates. All rights reserved. May not be copied, modified, or distributed in whole or in part without the express consent of Amazon.com, Inc.
Aceleração de Conteúdo Dinâmico:
Suas Aplicações Web mais Rápidas com
Amazon CloudFront e Amazon Route 53
Eduardo Horai, Manager Solutions Architecture
27 Maio, 2014

2. Fatores fundamentais
Qualquer aplicação WEB tem que possuir:
• Segurança forte
• Alta disponibilidade
• Alta performance

3. Por que disponibilidade importa?
• Aplicação indisponível à perda de 100% da receita
• Impacto na lealdade dos clientes e imagem da empresa

4. Como AWS ajuda?
ü Amazon Route 53: verificação de saúde dos
servidores web de origem com failover automático
ü Amazon CloudFront: reduzir a carga na origem
ü Amazon CloudFront: páginas de erros customizadas
ü Amazon CloudFront: serve conteúdo cacheado se a
origem estiver indisponível

5. Por que performance importa?
• Performance se transforma em…
• Mais Page Views
• Melhor experiência do usuário
• Maior taxa de conversão

6. Por que performance importa?

7. Por que performance importa?
Muito tempo e dinheiro é gasto melhorando a
infraestrutura de backend

8. Por que performance importa?
80% da latência percebida pelo usuário é originária do
front-end

9. Como melhorar a performance?
Aplicação Web tem …
• Conteúdo estático ou reusável
• TTLs altos
• TTLs baixos (conteúdo customizado)
• Conteúdo dinâmico ou único
• TTL zero

10. Conteúdo estático ou reusável
Pode ser cacheado (TTLs altos ou baixos)

11. Arquitetura típica

12. Conteúdo dinâmico ou único
Não pode ser cacheado – MAS afeta 100% dos visitantes!

13. Por que não…?

14. Como Amazon CloudFront ajuda?
ü Otimizações TCP/IP no caminho da rede
ü Keep-Alive para reduzir RTT
ü Terminação SSL próxima dos visitantes
ü POST/PUT otimizado
ü Roteamento baseado em latência
ü Preço igual ao conteúdo estático!

16. Estático ou Reusável
Conteúdo que não se altera em um determinado
período de tempo
t0 t1

17. Dinâmico OU Único
Conteúdo que se altera rapidamente, assim que
é criado
t0 t1

18. Exemplo

19. Exemplo
Index.jsp (dinâmico)
Imagens (estático)

20. Exemplo
. sec

21. Tempo para carregar a página?
. Sec

22. Melhorando a performance Web
Acelerando conteúdo estático
Acelerando conteúdo dinâmico

23. Endereço: www…. Navegador renderiza

24. Gráficos em cascata (Waterfall)
DNS Lookup
TCP Connection
Time to First Byte
Content Download

25. Gráficos em cascata
Index.jsp

26. Otimizando
conteúdo estático

27. Otimizando conteúdo estático
Index.jsp
Images, JS e
CSS

28. Otimizando conteúdo estático
Index.jsp
Otimizado com
cache do Amazon
CloudFront

29. Cacheando
Origin
Edge
Location
User Request A

30. Cacheando
Origin
Edge
Location
Get Image
User Request A

31. Cacheando
Origin
Edge
Location
Get Image
Get Image
User Request A

32. Cacheando
Origin
Edge
Location
Get Image
Get Image
Image
User Request A

33. Cacheando
Origin
Edge
Location
Get Image
Get Image
Image
Image
User Request A

34. Cacheando
Origin
Edge
Location
User Request B
Get Image

35. Cacheando
Origin
Edge
Location
Get ImageImage
User Request B

36. Otimizando conteúdo estático com Cache
Traz conteúdo próximo aos usuários

37. Otimizando conteúdo estático com Cache
Melhora a experiência do usuário e performance

38. Otimizando conteúdo estático com Cache
Reduz a carga na sua infraestrutura

40. Antes de cachear = 1.46sec

41. Depois de cachear = 770ms

42. Conteúdo estático &

43. • Empresa brasileira de segurança digital;
• Feita por brasileiros, para brasileiros;
• Possui escritórios no Rio de Janeiro, São
Paulo e Florianópolis;
• Toda sua infra-estrutura no Brasil;
• Mais de 6 milhões de usuários ativos;
• 10 MM usuários ativos mensais;
• 9 MM Android memory cleanups por dia;
• 2 MM Android scans por dia;
• Utiliza diversos serviços AWS;
Amazon CloudFront CDN
- Apresentação
“A
flexibilidade
do
CloudFront
permite
com
que
os
desenvolvedores
sigam
o
caminho
mais
natural
e
óbvio
no
que
diz
respeito
a
distribuição
de
conteúdo.”
-­‐
Rafael
Lopes

44. • Atender milhares de requests simultâneos
simplificando a solução ao máximo;
• Ter total autonomia sobre a origem a CDN;
• Ter estatísticas estratégicas para nosso BI;
• Liberdade de poder criar distribuições sem tickets
de suporte;
• Prover conteúdo de maneira dinâmica usando
uma CDN;
• Conseguir isso tudo com um preço competitivo;
Amazon CloudFront CDN
- Desafio

45. Amazon CloudFront CDN
- Solução e benefícios alcançados
• Conseguir isso tudo com um preço competitivo;
• Custom Origin;
• Analytics – antes com logs no s3 bucket e
MapR, agora com interface web nativa;
• AWS Console e IAM management com
usuários internos e ACL pra cada time;
• Prover conteúdo de maneira dinâmica usando
uma CDN;

46. • Entrada no DNS Route 53
• CloudFront;
• Download distribution, escrevendo todos os
logs dos edge servers em um S3 bucket;
• ELB como origem, escrevendo logs do
loadbalancer em um S3 bucket e com
CloudWatch com alarme;
• Servidores servindo conteúdo estático
customizado;
Diagrama
de arquitetura

47. Terminamos?

48. Ainda não
. secObjetivo:

49. Cache As Much As You Can

50. Como? Já estou
cacheando minhas
imagens, CSS e JSS

51. Passos para encontrar conteúdos
cacheáveis
1. Coletar logs web (W3C) da camada web
2. Rodar uma análise nos seus logs (EMR, RDS
ou Redshift)
3. Identificar os top N URLs acessados

52. 220 /index.jsp
200 /images/book1.gif
120 /css/style.css
119 /js/script1.js
110 /factory/create_image?
name=book1&size=10x10
100 /api/GetBooks?category=math
90 /api/GetBooks?category=math&lang=spanish
80 /api/GetBooks?top=10

53. Estático ou Reusável
Conteúdo que não se altera em um determinado
período de tempo
t0 t1

54. Cache por um tempo menor
• Encontrar conteúdo que pode ser cacheado por qualquer
período:
• Horas
• Minutos
• Segundos
• CloudFront pode cachear por qualquer período de tempo

55. Conteúdo com Query Strings
Reutilizável!
110 /factor/create_image?name=book1&size=10x10

56. Chamadas de API
Reutilizável!
100 /api/GetBooks?category=math

57. Chamadas de API
Reutilizável!
80 /api/GetBooks?top=10

58. Cache por um tempo menor
• API GETS atinge 100 ou 1000 RPS
• Retira da sua camada web a carga de 1000 RPS
• Retira carga do seu load balancer: ELB ou outro LB
• Provisiona menos capacidade e reduz custo
1000 /api/GetBooks?top=10

59. Página base (primeira página HTML)
E agora?
220 /index.jsp

60. Otimizando
conteúdo dinâmico

61. Conteúdo dinâmico
Index.jsp

62. Otimizando conteúdo dinâmico
Index.jsp

63. O Conteúdo dinâmico pode ser otimizado?
Dinâmico não é cacheável
Conteúdo é enviado como se
fosse um proxy pela CDN

64. O Conteúdo dinâmico pode ser otimizado?
User
Request
Origin
Edge
Location
Poke
Poke
Ok
Ok
PokePoke
User
Request

65. O Conteúdo dinâmico pode ser otimizado?
Adiciona latência?
Como otimizar conteúdo dinâmico?

66. Como otimizar o conteúdo dinâmico?
DNS Lookup
TCP Connection
Time to First Byte
Content Download

67. Como otimizar entrega dinâmica?
Route 53
Keep-Alive Connections
& SSL Termination
Reduzir DNS Time
+
Reduzir Connection Time
+
Reduzir First Byte Time
+
Reduzir Content Download Time
Keep-Alive Connections
TCP/IP Optimization
Rute53
Route 53

68. Depois cachear/antes de CloudFront para
conteúdo dinâmico = 770ms

69. Como melhorar o DNS Lookup?
DNS Lookup
Index.jsp

70. Com Amazon Route 53
Route 53

71. Otimizando tempo do DNS
• Route 53: DNS gerenciado
• Desenhado para ser rápido
• Latência baixa de resolução DNS
• Rede global de servidores de DNS
• Queries roteadas para o servidor DNS mais próximo

72. Sem Route 53

73. Com Route 53

74. Como melhorar
TCP Connection e First Byte Time?
TCP Connection
Index.jsp

75. Com Keep-Alive das
conexões do Cloudfront

76. Sem CloudFront
Region
• Todo usuário é uma
nova conexão
• Mais usuários = mais
conexões TCP

77. Sem conexões Keep-Alive
• Mais carga no seu servidor: Memory/CPU

78. Sem conexões Keep-Alive
• Carga no servidor aumenta o time to first
byte
Time to First Byte

79. • Mais usuários Mais conexões TCP
• Retira carga na camada web: CPU/memory
• Melhora tempo de resposta:
2 conexõesSem CloudFront
1 conexãoCom CloudFront
720 msSem CloudFront
540 msCom CloudFront
CloudFront Keep Alive

80. Test CPU Util. %
Sem CloudFront 20%
Com CloudFront 6%

81. Como otimizar as conexões SSL?
TCP Connection
Index.jsp

82. Com terminação
de SSL do CloudFront

83. Otimização SSL com CloudFront
• Suporta tráfego SSL
• Pode trazer o seu próprio certificado
• Tráfego SSL é terminado no ponto mais próximo
do CloudFront

84. Depois da otimização do CloudFront para
conteúdo dinâmico = 555 ms

85. Exemplo: somecompany.com
. sec

86. Cloudfront &

87. • O Esporte Interativo é o maior grupo de mídia
esportiva do Brasil. Na TV, com conteúdos como Liga
dos Campeões, Europa League, Copa do Rei, Copa
do Nordeste, Copa Verde etc., é o maior canal de
esportes do país, cobrindo mais de 32 milhões de
lares. No meio digital, também é líder: são quase 9
milhões de fãs no Facebook, que fazem do Esporte
Interativo o 2º maior grupo de mídia esportiva do
mundo. Em 2012, criou o Esporte Interativo Plus,
uma nova plataforma de conteúdo online, que
possibilita ao usuário assistir a programação da
emissora 24 horas por dia ao vivo ou on
demand através do computador, celular ou tablet.
Com o sucesso do aplicativo, torna-se imprescindível
possuir um serviço de TI confiável, capaz de fornecer
todo o conteúdo com a máxima qualidade e também
de gerenciar os mais de 80 mil assinantes.
“O escalonamento de instâncias e o uso do cloudfront nos faz
crescer de acordo com a demanda dos nossos assinantes.”
“A
AWS
nos
permite
crescer
de
acordo
com
a
demanda.
Podemos
escalar
várias
instâncias
para
um
jogo
importante
e
depois
pará-­‐las,
o9mizando
assim
nossos
recursos.”
-­‐
Mauricio
Portela

88. O Desafio
• O desafio do Esporte Interativo era
encontrar uma estrutura que além de
suportar milhões de acessos ao web site e
todas as suas plataformas móveis, ainda
possibilitasse que, ao assistir o video ao
vivo ou on demand, o usuário tivesse a
melhor experiência possível tanto em
fluidez quanto nas diversas qualidades e
velocidades oferecidas. O nosso assinante
deveria conseguir ver um conteúdo em HD
ou no 3G sem travamentos.

89. Sobre a o Papel da AWS e Benefícios
alcançados
PARAGRAFO
RESUMO
CASO
_
KEY
WORDS
de
BENEFICIO,
DESAFIO
VENCIDO
–
RESUMO
DO
CASO
EM
UM
PARAGRAFO
• Escalabilidade de recursos rápida e
automática utilizando cloudfront e elb.
• Podemos crescer e diminuir de acordo com
a nossa audiência, que é crescente e muito
alta em jogos e eventos importantes.
• Cloudfront permitiu uma distribuição
inteligente e efetiva do conteúdo ao vivo e
on demand.
Cloudfront
Encoder
Instâncias
de
Midia
AWS
Estrutura
Streaming
Estrutura
Site
Cloudfront
RDS
Instâncias
EC2
em
um
ELB
Elas9c
Cache
Assinantes
/
Usuários

90. Resumo
• CloudFront para acelerar todo seu conteúdo
• Utilize CloudFront (e também Route 53 com
roteamento baseado em latência) para melhorar
sua performance
• Melhor disponibilidade com CloudFront e Amazon
Route 53

91. Perguntas?

92. © 2014 Amazon.com, Inc. and its affiliates. All rights reserved. May not be copied, modified, or distributed in whole or in part without the express consent of Amazon.com, Inc.
Eduardo Horai, Manager Solutions Architecture
27 Maio 2014
Obrigado!
Aceleração de Conteúdo Dinâmico:
Suas Aplicações Web mais Rápidas com
Amazon CloudFront e Amazon Route 53