© 2014 Amazon.com, Inc. and its affiliates. All rights reserved. May not be copied, modified, or distributed in whole or i...
Fatores fundamentais
Qualquer aplicação WEB tem que possuir:
•  Segurança forte
•  Alta disponibilidade
•  Alta performance
Por que disponibilidade importa?
•  Aplicação indisponível à perda de 100% da receita
•  Impacto na lealdade dos clientes...
Como AWS ajuda?
ü Amazon Route 53: verificação de saúde dos
servidores web de origem com failover automático
ü Amazon Cl...
Por que performance importa?
•  Performance se transforma em…
•  Mais Page Views
•  Melhor experiência do usuário
•  Maior...
Por que performance importa?
Por que performance importa?
Muito tempo e dinheiro é gasto melhorando a
infraestrutura de backend
Por que performance importa?
80% da latência percebida pelo usuário é originária do
front-end
Como melhorar a performance?
Aplicação Web tem …
•  Conteúdo estático ou reusável
•  TTLs altos
•  TTLs baixos (conteúdo c...
Conteúdo estático ou reusável
Pode ser cacheado (TTLs altos ou baixos)
Arquitetura típica
Conteúdo dinâmico ou único
Não pode ser cacheado – MAS afeta 100% dos visitantes!
Por que não…?
Como Amazon CloudFront ajuda?
ü Otimizações TCP/IP no caminho da rede
ü Keep-Alive para reduzir RTT
ü Terminação SSL pr...
Estático ou Reusável
Conteúdo que não se altera em um determinado
período de tempo
t0 t1
Dinâmico OU Único
Conteúdo que se altera rapidamente, assim que
é criado
t0 t1
Exemplo
Exemplo
Index.jsp (dinâmico)
Imagens (estático)
Exemplo
. sec
Tempo para carregar a página?
. Sec
Melhorando a performance Web
Acelerando conteúdo estático
Acelerando conteúdo dinâmico
Endereço: www…. Navegador renderiza
Gráficos em cascata (Waterfall)
DNS Lookup
TCP Connection
Time to First Byte
Content Download
Gráficos em cascata
Index.jsp
Otimizando
conteúdo estático
Otimizando conteúdo estático
Index.jsp
Images, JS e
CSS
Otimizando conteúdo estático
Index.jsp
Otimizado com
cache do Amazon
CloudFront
Cacheando
Origin
Edge
Location
User Request A
Cacheando
Origin
Edge
Location
Get Image
User Request A
Cacheando
Origin
Edge
Location
Get Image
Get Image
User Request A
Cacheando
Origin
Edge
Location
Get Image
Get Image
Image
User Request A
Cacheando
Origin
Edge
Location
Get Image
Get Image
Image
Image
User Request A
Cacheando
Origin
Edge
Location
User Request B
Get Image
Cacheando
Origin
Edge
Location
Get ImageImage
User Request B
Otimizando conteúdo estático com Cache
Traz conteúdo próximo aos usuários
Otimizando conteúdo estático com Cache
Melhora a experiência do usuário e performance
Otimizando conteúdo estático com Cache
Reduz a carga na sua infraestrutura
Antes de cachear = 1.46sec
Depois de cachear = 770ms
Conteúdo estático &
•  Empresa brasileira de segurança digital;
•  Feita por brasileiros, para brasileiros;
•  Possui escritórios no Rio de Ja...
•  Atender milhares de requests simultâneos
simplificando a solução ao máximo;
•  Ter total autonomia sobre a origem a CDN...
Amazon CloudFront CDN
- Solução e benefícios alcançados
•  Conseguir isso tudo com um preço competitivo;
•  Custom Origin;...
•  Entrada no DNS Route 53
•  CloudFront;
•  Download distribution, escrevendo todos os
logs dos edge servers em um S3 buc...
Terminamos?
Ainda não
. secObjetivo:
Cache As Much As You Can
Como? Já estou
cacheando minhas
imagens, CSS e JSS
Passos para encontrar conteúdos
cacheáveis
1.  Coletar logs web (W3C) da camada web
2.  Rodar uma análise nos seus logs (E...
220 /index.jsp
200 /images/book1.gif
120 /css/style.css
119 /js/script1.js
110 /factory/create_image?
name=book1&size=10x1...
Estático ou Reusável
Conteúdo que não se altera em um determinado
período de tempo
t0 t1
Cache por um tempo menor
•  Encontrar conteúdo que pode ser cacheado por qualquer
período:
•  Horas
•  Minutos
•  Segundos...
Conteúdo com Query Strings
Reutilizável!
110 /factor/create_image?name=book1&size=10x10
Chamadas de API
Reutilizável!
100 /api/GetBooks?category=math
Chamadas de API
Reutilizável!
80 /api/GetBooks?top=10
Cache por um tempo menor
•  API GETS atinge 100 ou 1000 RPS
•  Retira da sua camada web a carga de 1000 RPS
•  Retira carg...
Página base (primeira página HTML)
E agora?
220 /index.jsp
Otimizando
conteúdo dinâmico
Conteúdo dinâmico
Index.jsp
Otimizando conteúdo dinâmico
Index.jsp
O Conteúdo dinâmico pode ser otimizado?
Dinâmico não é cacheável
Conteúdo é enviado como se
fosse um proxy pela CDN
O Conteúdo dinâmico pode ser otimizado?
User
Request
Origin
Edge
Location
Poke
Poke
Ok
Ok
PokePoke
User
Request
O Conteúdo dinâmico pode ser otimizado?
Adiciona latência?
Como otimizar conteúdo dinâmico?
Como otimizar o conteúdo dinâmico?
DNS Lookup
TCP Connection
Time to First Byte
Content Download
Como otimizar entrega dinâmica?
Route 53
Keep-Alive Connections
& SSL Termination
Reduzir DNS Time
+
Reduzir Connection Ti...
Depois cachear/antes de CloudFront para
conteúdo dinâmico = 770ms
Como melhorar o DNS Lookup?
DNS Lookup
Index.jsp
Com Amazon Route 53
Route 53
Otimizando tempo do DNS
•  Route 53: DNS gerenciado
•  Desenhado para ser rápido
•  Latência baixa de resolução DNS
•  Red...
Sem Route 53
Com Route 53
Como melhorar
TCP Connection e First Byte Time?
TCP Connection
Index.jsp
Com Keep-Alive das
conexões do Cloudfront
Sem CloudFront
Region
•  Todo usuário é uma
nova conexão
•  Mais usuários = mais
conexões TCP
Sem conexões Keep-Alive
•  Mais carga no seu servidor: Memory/CPU
Sem conexões Keep-Alive
•  Carga no servidor aumenta o time to first
byte
Time to First Byte
•  Mais usuários Mais conexões TCP
•  Retira carga na camada web: CPU/memory
•  Melhora tempo de resposta:
2 conexõesSem C...
Test CPU Util. %
Sem CloudFront 20%
Com CloudFront 6%
Como otimizar as conexões SSL?
TCP Connection
Index.jsp
Com terminação
de SSL do CloudFront
Otimização SSL com CloudFront
•  Suporta tráfego SSL
•  Pode trazer o seu próprio certificado
•  Tráfego SSL é terminado n...
Depois da otimização do CloudFront para
conteúdo dinâmico = 555 ms
Exemplo: somecompany.com
. sec
Cloudfront &
•  O Esporte Interativo é o maior grupo de mídia
esportiva do Brasil. Na TV, com conteúdos como Liga
dos Campeões, Europa ...
O Desafio
•  O desafio do Esporte Interativo era
encontrar uma estrutura que além de
suportar milhões de acessos ao web si...
Sobre a o Papel da AWS e Benefícios
alcançados
PARAGRAFO	
  RESUMO	
  
CASO	
  _	
  KEY	
  WORDS	
  
de	
  BENEFICIO,	
  
...
Resumo
•  CloudFront para acelerar todo seu conteúdo
•  Utilize CloudFront (e também Route 53 com
roteamento baseado em la...
Perguntas?
© 2014 Amazon.com, Inc. and its affiliates. All rights reserved. May not be copied, modified, or distributed in whole or i...
Aceleracao+conteudo+dinamico
Aceleracao+conteudo+dinamico
Upcoming SlideShare
Loading in …5
×

Aceleracao+conteudo+dinamico

970 views
862 views

Published on

Apresentações do AWS Summit Sao Paulo 2014. Baixe o conteúdo preparado por nossos especialistas para auxiliá-lo na jornada para a nuvem.

Published in: Business
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
970
On SlideShare
0
From Embeds
0
Number of Embeds
8
Actions
Shares
0
Downloads
85
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Aceleracao+conteudo+dinamico

  1. 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. 2. Fatores fundamentais Qualquer aplicação WEB tem que possuir: •  Segurança forte •  Alta disponibilidade •  Alta performance
  3. 3. Por que disponibilidade importa? •  Aplicação indisponível à perda de 100% da receita •  Impacto na lealdade dos clientes e imagem da empresa
  4. 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. 5. Por que performance importa? •  Performance se transforma em… •  Mais Page Views •  Melhor experiência do usuário •  Maior taxa de conversão
  6. 6. Por que performance importa?
  7. 7. Por que performance importa? Muito tempo e dinheiro é gasto melhorando a infraestrutura de backend
  8. 8. Por que performance importa? 80% da latência percebida pelo usuário é originária do front-end
  9. 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. 10. Conteúdo estático ou reusável Pode ser cacheado (TTLs altos ou baixos)
  11. 11. Arquitetura típica
  12. 12. Conteúdo dinâmico ou único Não pode ser cacheado – MAS afeta 100% dos visitantes!
  13. 13. Por que não…?
  14. 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!
  15. 15. Estático ou Reusável Conteúdo que não se altera em um determinado período de tempo t0 t1
  16. 16. Dinâmico OU Único Conteúdo que se altera rapidamente, assim que é criado t0 t1
  17. 17. Exemplo
  18. 18. Exemplo Index.jsp (dinâmico) Imagens (estático)
  19. 19. Exemplo . sec
  20. 20. Tempo para carregar a página? . Sec
  21. 21. Melhorando a performance Web Acelerando conteúdo estático Acelerando conteúdo dinâmico
  22. 22. Endereço: www…. Navegador renderiza
  23. 23. Gráficos em cascata (Waterfall) DNS Lookup TCP Connection Time to First Byte Content Download
  24. 24. Gráficos em cascata Index.jsp
  25. 25. Otimizando conteúdo estático
  26. 26. Otimizando conteúdo estático Index.jsp Images, JS e CSS
  27. 27. Otimizando conteúdo estático Index.jsp Otimizado com cache do Amazon CloudFront
  28. 28. Cacheando Origin Edge Location User Request A
  29. 29. Cacheando Origin Edge Location Get Image User Request A
  30. 30. Cacheando Origin Edge Location Get Image Get Image User Request A
  31. 31. Cacheando Origin Edge Location Get Image Get Image Image User Request A
  32. 32. Cacheando Origin Edge Location Get Image Get Image Image Image User Request A
  33. 33. Cacheando Origin Edge Location User Request B Get Image
  34. 34. Cacheando Origin Edge Location Get ImageImage User Request B
  35. 35. Otimizando conteúdo estático com Cache Traz conteúdo próximo aos usuários
  36. 36. Otimizando conteúdo estático com Cache Melhora a experiência do usuário e performance
  37. 37. Otimizando conteúdo estático com Cache Reduz a carga na sua infraestrutura
  38. 38. Antes de cachear = 1.46sec
  39. 39. Depois de cachear = 770ms
  40. 40. Conteúdo estático &
  41. 41. •  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  
  42. 42. •  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
  43. 43. 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;
  44. 44. •  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
  45. 45. Terminamos?
  46. 46. Ainda não . secObjetivo:
  47. 47. Cache As Much As You Can
  48. 48. Como? Já estou cacheando minhas imagens, CSS e JSS
  49. 49. 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
  50. 50. 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
  51. 51. Estático ou Reusável Conteúdo que não se altera em um determinado período de tempo t0 t1
  52. 52. 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
  53. 53. Conteúdo com Query Strings Reutilizável! 110 /factor/create_image?name=book1&size=10x10
  54. 54. Chamadas de API Reutilizável! 100 /api/GetBooks?category=math
  55. 55. Chamadas de API Reutilizável! 80 /api/GetBooks?top=10
  56. 56. 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
  57. 57. Página base (primeira página HTML) E agora? 220 /index.jsp
  58. 58. Otimizando conteúdo dinâmico
  59. 59. Conteúdo dinâmico Index.jsp
  60. 60. Otimizando conteúdo dinâmico Index.jsp
  61. 61. O Conteúdo dinâmico pode ser otimizado? Dinâmico não é cacheável Conteúdo é enviado como se fosse um proxy pela CDN
  62. 62. O Conteúdo dinâmico pode ser otimizado? User Request Origin Edge Location Poke Poke Ok Ok PokePoke User Request
  63. 63. O Conteúdo dinâmico pode ser otimizado? Adiciona latência? Como otimizar conteúdo dinâmico?
  64. 64. Como otimizar o conteúdo dinâmico? DNS Lookup TCP Connection Time to First Byte Content Download
  65. 65. 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
  66. 66. Depois cachear/antes de CloudFront para conteúdo dinâmico = 770ms
  67. 67. Como melhorar o DNS Lookup? DNS Lookup Index.jsp
  68. 68. Com Amazon Route 53 Route 53
  69. 69. 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
  70. 70. Sem Route 53
  71. 71. Com Route 53
  72. 72. Como melhorar TCP Connection e First Byte Time? TCP Connection Index.jsp
  73. 73. Com Keep-Alive das conexões do Cloudfront
  74. 74. Sem CloudFront Region •  Todo usuário é uma nova conexão •  Mais usuários = mais conexões TCP
  75. 75. Sem conexões Keep-Alive •  Mais carga no seu servidor: Memory/CPU
  76. 76. Sem conexões Keep-Alive •  Carga no servidor aumenta o time to first byte Time to First Byte
  77. 77. •  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
  78. 78. Test CPU Util. % Sem CloudFront 20% Com CloudFront 6%
  79. 79. Como otimizar as conexões SSL? TCP Connection Index.jsp
  80. 80. Com terminação de SSL do CloudFront
  81. 81. 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
  82. 82. Depois da otimização do CloudFront para conteúdo dinâmico = 555 ms
  83. 83. Exemplo: somecompany.com . sec
  84. 84. Cloudfront &
  85. 85. •  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  
  86. 86. 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.
  87. 87. 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  
  88. 88. 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
  89. 89. Perguntas?
  90. 90. © 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

×