{"id":1931,"date":"2017-01-17T16:13:45","date_gmt":"2017-01-17T18:13:45","guid":{"rendered":"https:\/\/blog.umbler.com\/?p=1931"},"modified":"2018-12-05T16:02:39","modified_gmt":"2018-12-05T18:02:39","slug":"mitos-e-verdades-sobre-o-uso-de-cdn-parte-1-cache","status":"publish","type":"post","link":"https:\/\/blog.umbler.com\/br\/mitos-e-verdades-sobre-o-uso-de-cdn-parte-1-cache\/","title":{"rendered":"Mitos e Verdades Sobre o Uso de Cache em CDN"},"content":{"rendered":"<p>Se voc\u00ea \u00e9 desenvolvedor, analista, gestor de <a href=\"https:\/\/blog.umbler.com\/br\/o-que-e-marketing-criativo\/\">marketing digital<\/a>, ou tem algum contato com projetos digitais, voc\u00ea certamente j\u00e1 ouviu falar em CDN. Vamos iniciar hoje uma s\u00e9rie de posts sobre os mitos e verdades do uso das famigeradas Content Delivery Networks e seu impacto em desempenho, ranqueamento org\u00e2nico e o mais importante: a experi\u00eancia do usu\u00e1rio.<\/p>\n<p>Antes de come\u00e7ar, recomendo a leitura de um post que fizemos sobre como aumentar a performance do seu site utilizando o CDN da CloudFlare. Se voc\u00ea ainda n\u00e3o leu, pare agora o que est\u00e1 fazendo e d\u00ea uma conferida no post <a href=\"https:\/\/blog.umbler.com\/br\/acelerando-o-seu-site-com-o-novo-add-on-de-cdn-via-cloudflare\/\" target=\"_blank\" rel=\"noopener\">Acelerando o seu site com o novo add-on de CDN via CloudFlare<\/a>. Nele, voc\u00ea encontrar\u00e1 uma excelente explica\u00e7\u00e3o sobre o que \u00e9 CDN, como funciona e para que ele serve. Vai l\u00e1, eu espero.<\/p>\n<p>Feito? Ent\u00e3o vamos l\u00e1!<\/p>\n<p>Para abrir esta s\u00e9rie, vamos falar sobre cache, tempo de carregamento de sites que utilizam o recurso das CDN e como os rob\u00f4s dos buscadores interagem com esses sites. Eu sei que voc\u00ea est\u00e1 se co\u00e7ando para chegar ao que realmente importa, mas, \u00e9 necess\u00e1rio contextualizar um pouco.<\/p>\n<h2>Cache de CDN: Local ou Global?<\/h2>\n<p>Logo ap\u00f3s o Webinar Server Side SEO em parceria com a SEMRush (v\u00eddeo e transcri\u00e7\u00e3o <a href=\"https:\/\/blog.umbler.com\/br\/server-side-seo-o-que-voce-precisa-saber-sobre-servidores-e-hospedagem\/\" target=\"_blank\" rel=\"noopener\">aqui<\/a>), recebemos um e-mail do Felipe Massariol, desenvolvedor web focado em performance e diretor do site Perfow, fazendo um questionamento bastante pertinente sobre cache de CDN. Ele perguntou se, ao acessar o site a partir de determinada regi\u00e3o do mundo, o cache do CDN seria replicado para toda a rede ou se apenas o servidor mais pr\u00f3ximo da origem do acesso teria o cache armazenado.<\/p>\n<p>Confesso que nunca tinha lido ou ouvido falar sobre o funcionamento da replica\u00e7\u00e3o (ou n\u00e3o) de um cache em CDN em um n\u00edvel t\u00e3o detalhado como este, por isso minha resposta foi bem simplista. De pronto, sem pesquisa, respondi que haveria dois cen\u00e1rios poss\u00edveis:<\/p>\n<ul>\n<li>O servidor f\u00edsico recebe a requisi\u00e7\u00e3o, a processa e retorna \u00e0 origem do acesso.\u00a0No meio deste processo, as p\u00e1ginas s\u00e3o armazenadas no cache do servidor e replicadas para os demais servidores da rede.<\/li>\n<\/ul>\n<p>Ou<\/p>\n<ul>\n<li>O cache \u00e9 salvo apenas no servidor mais pr\u00f3ximo do acesso, ent\u00e3o, se algu\u00e9m de outro pa\u00eds acessar o site mesmo depois do primeiro acesso, vai receber uma vers\u00e3o &#8216;live&#8217; do site, sem cache.<\/li>\n<\/ul>\n<p>Sem d\u00favida, o primeiro cen\u00e1rio n\u00e3o parece nem um pouco coerente. Afinal, se todo o cache fosse replicado para cada um dos servidores da rede haveria um fluxo constante de informa\u00e7\u00e3o indo e voltando entre os servidores, aumentando consequentemente a lat\u00eancia (e o custo). Apesar dessa an\u00e1lise fria, se tem uma coisa que aprendi nesses anos trabalhando com projetos web, \u00e9 que n\u00e3o h\u00e1 certeza sem teste. Para nossa alegria, o Felipe aceitou o desafio e se prop\u00f4s a testar a teoria.<\/p>\n<h2>Testando disponibilidade de cache em CDN<\/h2>\n<p>O primeiro acesso foi atrav\u00e9s de um servidor web localizado no Brasil. Utilizando o comando curl -I (SSH) \u00e9 poss\u00edvel visualizar as informa\u00e7\u00f5es da requisi\u00e7\u00e3o HTTP e sua resposta. Na imagem abaixo, \u00e9 poss\u00edvel observar que a vers\u00e3o do site entregue para esta requisi\u00e7\u00e3o \u00e9 uma c\u00f3pia \u2018viva\u2019 do site, ou seja, n\u00e3o est\u00e1 em cache (CF-Cache-Status: MISS).<\/p>\n<figure id=\"attachment_1932\" aria-describedby=\"caption-attachment-1932\" style=\"width: 512px\" class=\"wp-caption aligncenter\"><img fetchpriority=\"high\" decoding=\"async\" class=\"size-full wp-image-1932\" src=\"https:\/\/blog.umbler.com\/wp-content\/uploads\/2017\/01\/Primeiro-Acesso-Brasil.png\" alt=\"Teste de Cache Primeiro Acesso Brasil\" width=\"512\" height=\"239\" \/><figcaption id=\"caption-attachment-1932\" class=\"wp-caption-text\">Primeiro Acesso Brasil<\/figcaption><\/figure>\n<p>Seguindo esta l\u00f3gica, a segunda requisi\u00e7\u00e3o dever\u00e1 retornar com a linha CF-Cache-Status: HIT, que indica que a vers\u00e3o apresentada est\u00e1 em cache. Vamos ver?<\/p>\n<figure id=\"attachment_1933\" aria-describedby=\"caption-attachment-1933\" style=\"width: 508px\" class=\"wp-caption aligncenter\"><img decoding=\"async\" class=\"size-full wp-image-1933\" src=\"https:\/\/blog.umbler.com\/wp-content\/uploads\/2017\/01\/Segundo-Acesso-Brasil.png\" alt=\"Teste de Cache Segundo Acesso Brasil\" width=\"508\" height=\"238\" \/><figcaption id=\"caption-attachment-1933\" class=\"wp-caption-text\">Segundo Acesso Brasil<\/figcaption><\/figure>\n<p>Agora, utilizando um servidor web localizado nos Estados Unidos, o usu\u00e1rio fez a requisi\u00e7\u00e3o da mesma URL. Este \u00e9 o momento em que vamos comprovar ou excluir a possibilidade do cache ser replicado para todos os servidores. Se o cache for replicado em outros servidores da rede, a linha CF-Cache-Status deve ter a informa\u00e7\u00e3o HIT, caso contr\u00e1rio, MISS.<\/p>\n<figure id=\"attachment_1934\" aria-describedby=\"caption-attachment-1934\" style=\"width: 512px\" class=\"wp-caption aligncenter\"><img decoding=\"async\" class=\"size-full wp-image-1934\" src=\"https:\/\/blog.umbler.com\/wp-content\/uploads\/2017\/01\/Primeiro-Acesso-EUA.png\" alt=\"Teste de Cache Primeiro Acesso EUA\" width=\"512\" height=\"240\" \/><figcaption id=\"caption-attachment-1934\" class=\"wp-caption-text\">Primeiro Acesso EUA<\/figcaption><\/figure>\n<p>Pronto! Temos a nossa resposta definitiva: O cache n\u00e3o \u00e9 replicado. S\u00f3 para finalizar o teste de cache, fizemos uma segunda requisi\u00e7\u00e3o a partir do mesmo servidor:<\/p>\n<figure id=\"attachment_1935\" aria-describedby=\"caption-attachment-1935\" style=\"width: 511px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-1935\" src=\"https:\/\/blog.umbler.com\/wp-content\/uploads\/2017\/01\/Segundo-Acesso-EUA.png\" alt=\"Teste de Cache Segundo Acesso EUA\" width=\"511\" height=\"237\" \/><figcaption id=\"caption-attachment-1935\" class=\"wp-caption-text\">Segundo Acesso EUA<\/figcaption><\/figure>\n<h2>Conclus\u00e3o<\/h2>\n<p>A c\u00f3pia em cache s\u00f3 \u00e9 fornecida se houver conte\u00fado armazenado em algum servidor pr\u00f3ximo do usu\u00e1rio que est\u00e1 acessando a p\u00e1gina. Se ningu\u00e9m na localidade do usu\u00e1rio acessou aquela p\u00e1gina antes, os servidores CDN pr\u00f3ximo do usu\u00e1rio n\u00e3o ter\u00e3o uma c\u00f3pia da p\u00e1gina e ent\u00e3o o acesso a ela ser\u00e1 diretamente no servidor original do site, afetando a performance da entrega do conte\u00fado.<\/p>\n<h4>Algumas informa\u00e7\u00f5es importantes sobre este teste:<\/h4>\n<ul>\n<li>O teste foi realizado utilizando dois IPs distintos: Brasil (Divinol\u00e2ndia, SP) e EUA (Houston, Texas);<\/li>\n<li>O acesso a partir do Brasil foi realizado utilizando um IP fornecido pelo pr\u00f3prio provedor de acesso;<\/li>\n<li>O acesso internacional foi realizado utilizando atrav\u00e9s do console SSH de um host localizado nos EUA (mas, \u00e9 poss\u00edvel utilizar um proxy que tenha op\u00e7\u00e3o de IP dos EUA, como o TunnelBear);<\/li>\n<li>O servi\u00e7o usado para descobrir a localidade do IP\u00a0foi o https:\/\/check-host.net\/;<\/li>\n<li>O CDN utilizado para o teste foi CloudFlare em Conta\u00a0Gratuita*;<\/li>\n<li>O Comando utilizado para recuperar o cabe\u00e7alho HTTP e a resposta foi<br \/>\nCURL -I https:\/\/www.dominio.com.br .<\/li>\n<\/ul>\n<blockquote><p>* Aten\u00e7\u00e3o: Os testes foram realizados utilizando uma conta free do CoudFlare. Iremos realizar estes mesmos testes com uma conta paga para os pr\u00f3ximos posts.<\/p><\/blockquote>\n<h2>CDN Cache: Interfere na performance do site?<\/h2>\n<p>Para identificar o real impacto que a utiliza\u00e7\u00e3o de um CDN com cache tem na performance de um site, nosso amigo Felipe fez ao todo quatro testes atrav\u00e9s de duas ferramentas diferentes. Em cada uma das ferramentas o primeiro teste foi realizado sem o recurso de cache ativado e o segundo com o recurso. Al\u00e9m disso, para garantir que a segunda ferramenta acesse uma p\u00e1gina sem cache, foi criada uma nova p\u00e1gina acess\u00edvel a partir de uma URL diferente da primeira, por\u00e9m com o mesmo conte\u00fado. Vamos aos resultados:<\/p>\n<h3>P\u00e1gina 1 &#8211; Acesso SEM Cache<\/h3>\n<figure id=\"attachment_1936\" aria-describedby=\"caption-attachment-1936\" style=\"width: 681px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-1936\" src=\"https:\/\/blog.umbler.com\/wp-content\/uploads\/2017\/01\/performance-p1t1.jpg\" alt=\"Teste de Performance - Acesso SEM Cache\" width=\"681\" height=\"191\" \/><figcaption id=\"caption-attachment-1936\" class=\"wp-caption-text\">Teste de Performance &#8211; Acesso SEM Cache<\/figcaption><\/figure>\n<p>Esta ferramenta realizou o teste acessando a URL a partir de um IP localizado na cidade de Melbourne, Victoria, na Austr\u00e1lia. O destaque deste resultado \u00e9 o tempo de carregamento da p\u00e1gina (Load time), que, no primeiro acesso, atingiu 7.05 segundos, tempo bem acima do ideal informado pelo Google, que deve ser menor que dois segundos.<\/p>\n<p>Aproveitando que estamos aqui, d\u00ea uma olhada nas m\u00e9tricas \u201cFaster than&#8230;\u201d. Esta m\u00e9trica \u00e9 uma compara\u00e7\u00e3o entre o site deste resultado e todos os outros j\u00e1 testados nesta ferramenta.<\/p>\n<h3>P\u00e1gina 1 &#8211; Acesso COM Cache<\/h3>\n<figure id=\"attachment_1937\" aria-describedby=\"caption-attachment-1937\" style=\"width: 675px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-1937 size-full\" src=\"https:\/\/blog.umbler.com\/wp-content\/uploads\/2017\/01\/performance-p1t2.jpg\" alt=\"Teste de Performance - Acesso COM Cache\" width=\"675\" height=\"191\" \/><figcaption id=\"caption-attachment-1937\" class=\"wp-caption-text\">Teste de Performance &#8211; Acesso COM Cache<\/figcaption><\/figure>\n<p>O segundo acesso a partir da mesma ferramenta trouxe resultados consideravelmente melhores. Agora que o servidor j\u00e1 tem uma vers\u00e3o guardada em cache, veja o tempo de carregamento total da p\u00e1gina. Ficou em apenas 1.61 segundos. Observe, tamb\u00e9m, que o simples fato da p\u00e1gina ter uma vers\u00e3o em cache fez com que a mesma URL do primeiro teste tenha resultados melhores que 79% dos sites j\u00e1 testados nesta ferramenta.<\/p>\n<h3>P\u00e1gina 2 &#8211; Acesso SEM Cache<\/h3>\n<figure id=\"attachment_1938\" aria-describedby=\"caption-attachment-1938\" style=\"width: 665px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-1938\" src=\"https:\/\/blog.umbler.com\/wp-content\/uploads\/2017\/01\/performance-p2t1.jpg\" alt=\"Teste de Performance - Acesso SEM Cache\" width=\"665\" height=\"327\" \/><figcaption id=\"caption-attachment-1938\" class=\"wp-caption-text\">Teste de Performance &#8211; Acesso SEM Cache<\/figcaption><\/figure>\n<p>A segunda p\u00e1gina foi testada em outra ferramenta, desta vez com acesso a partir da cidade de San Francisco, CA (EUA). Esta informa\u00e7\u00e3o \u00e9 importante para justificar (em partes) a diferen\u00e7a do tempo de carregamento apresentado entre as ferramentas. Outra justificativa poss\u00edvel \u00e9 o fato da segunda ferramenta contar apenas 68 requisi\u00e7\u00f5es HTTP, tr\u00eas a menos que na primeira ferramenta.<\/p>\n<h3>P\u00e1gina 2 &#8211; Acesso COM Cache<\/h3>\n<figure id=\"attachment_1939\" aria-describedby=\"caption-attachment-1939\" style=\"width: 662px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-1939\" src=\"https:\/\/blog.umbler.com\/wp-content\/uploads\/2017\/01\/performance-p2t2.jpg\" alt=\"Teste de Performance - Acesso COM Cache\" width=\"662\" height=\"325\" \/><figcaption id=\"caption-attachment-1939\" class=\"wp-caption-text\">Teste de Performance &#8211; Acesso COM Cache<\/figcaption><\/figure>\n<p>Os resultados do segundo acesso com esta ferramenta foram, como esperado, consideravelmente melhores que no primeiro acesso. O tempo de carregamento ficou quase dois segundos abaixo do primeiro acesso.<\/p>\n<h4>Conclus\u00e3o<\/h4>\n<p>\u00d3timas not\u00edcias! A fun\u00e7\u00e3o Cache de um CDN realmente afeta positivamente o desempenho de um site. N\u00e3o apenas o tempo de carregamento \u00e9 consideravelmente reduzido, mas a lat\u00eancia (tempo de \u2018espera\u2019 entre a requisi\u00e7\u00e3o e a resposta) tamb\u00e9m \u00e9 reduzida.<\/p>\n<p>Se voc\u00ea for observador(a), deve ter reparado que o tamanho da p\u00e1gina ao longo dos testes foi minimamente alterado. Pela diferen\u00e7a t\u00e3o insignificante, acredito que n\u00e3o se trate de compress\u00e3o ou minifica\u00e7\u00e3o de arquivo, mas possivelmente algum pacote perdido durante a requisi\u00e7\u00e3o.<\/p>\n<p>Sendo assim, como \u00e9 poss\u00edvel o site ser carregado t\u00e3o r\u00e1pido sem mudan\u00e7a em arquivos ou demais otimiza\u00e7\u00f5es?<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1940\" src=\"https:\/\/blog.umbler.com\/wp-content\/uploads\/2017\/01\/cdn-cache-meme.jpg\" alt=\"CDN Cache Meme\" width=\"500\" height=\"437\" \/><\/p>\n<h2>Cache em CDN n\u00e3o soluciona tudo!<\/h2>\n<p>Agora vem a parte triste desse post: a utiliza\u00e7\u00e3o de CDN com recurso de cache ativo n\u00e3o vai solucionar todos os seus problemas, principalmente se seu objetivo for melhorar o seu posicionamento nos resultados de busca. Sabe por qu\u00ea?<\/p>\n<p>Os bots respons\u00e1veis por fazer o rastreamento e a indexa\u00e7\u00e3o das p\u00e1ginas est\u00e3o, em sua maioria, alocados em servidores americanos. Isso significa que dificilmente um bot vai encontrar uma vers\u00e3o em cache quando visitar o site se voc\u00ea n\u00e3o teve nenhum acesso proveniente dos EUA nas \u00faltimas 24 horas. Se voc\u00ea possui um neg\u00f3cio local, \u00e9 muito improv\u00e1vel que voc\u00ea tenha acessos (reais) de outros pa\u00edses que n\u00e3o o Brasil. Sendo assim, a simples utiliza\u00e7\u00e3o de um CDN com recurso de cache n\u00e3o vai impactar em nada o seu posicionamento.<\/p>\n<p>Por outro lado, sabemos que os buscadores (Google principalmente) levam outros fatores em conta para determinar a qualidade e relev\u00e2ncia de um site, como CTR, bounce rate, engajamento, etc. Sendo assim, se seu site carrega r\u00e1pido para o usu\u00e1rio, \u00e9 prov\u00e1vel que a taxa de rejei\u00e7\u00e3o seja reduzida. Um site com baixa taxa de rejei\u00e7\u00e3o tem mais chance de conseguir algumas posi\u00e7\u00f5es nos resultados. Al\u00e9m disso, se o seu conte\u00fado for bem elaborado, autoral, sem\u00e2ntico e altamente relacionado \u00e0 palavra-chave foco da p\u00e1gina, \u00e9 prov\u00e1vel que voc\u00ea tenha um engajamento maior, o que tamb\u00e9m pode garantir um bom posicionamento nas buscas.<\/p>\n<h2>Conclus\u00e3o sobre o uso do CDN<\/h2>\n<p>Do ponto de vista da experi\u00eancia do usu\u00e1rio, a utiliza\u00e7\u00e3o de CDN Cache n\u00e3o \u00e9 apenas v\u00e1lida, mas extremamente necess\u00e1ria. Infelizmente, aqui no Brasil, ainda temos poucos servidores CDN comparado \u00e0 outras localidades. Isso limita o potencial de melhoria de desempenho dos nossos sites apenas com o uso da rede, pois usu\u00e1rios do extremo sul e do extremos norte do pa\u00eds receber\u00e3o os arquivos de um mesmo servidor (normalmente localizado em algum lugar entre RJ e SP).<br \/>\nConsiderando apenas os buscadores, a utiliza\u00e7\u00e3o de CDN Cache n\u00e3o tem impacto direto, dada a localiza\u00e7\u00e3o dos bots de rastreamento e indexa\u00e7\u00e3o dos buscadores. A recomenda\u00e7\u00e3o aqui \u00e9 que voc\u00ea se empenhe em outras otimiza\u00e7\u00f5es, como ativa\u00e7\u00e3o do cache local (servidor f\u00edsico), minifica\u00e7\u00e3o concatena\u00e7\u00e3o de arquivos .css e .js (separadamente, por favor) e compacta\u00e7\u00e3o de imagens.<\/p>\n<p>Ent\u00e3o, o que voc\u00ea achou deste primeiro post da s\u00e9rie? Tem algum mito que voc\u00ea queira desvendar? Deixe sua d\u00favida nos coment\u00e1rios. Vai ser legal ter a sua participa\u00e7\u00e3o nos pr\u00f3ximos posts.<\/p>\n<p><strong>Contribuiu para este\u00a0post:<\/strong> <a href=\"https:\/\/www.linkedin.com\/in\/felipemassariol\/\" target=\"_blank\" rel=\"noopener\">Felipe Massariol<\/a>, desenvolvedor web focado em performance.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Se voc\u00ea \u00e9 desenvolvedor, analista, gestor de marketing digital, ou tem algum contato com projetos digitais, voc\u00ea certamente j\u00e1 ouviu falar em CDN. Vamos iniciar hoje uma s\u00e9rie de posts sobre os mitos e verdades do uso das famigeradas Content Delivery Networks e seu impacto em desempenho, ranqueamento org\u00e2nico e o mais importante: a experi\u00eancia [&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":5427,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[23],"tags":[229,45,207,230,231],"class_list":["post-1931","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dev","tag-cache","tag-cdn","tag-dev","tag-rede","tag-servidores"],"_links":{"self":[{"href":"https:\/\/blog.umbler.com\/br\/wp-json\/wp\/v2\/posts\/1931"}],"collection":[{"href":"https:\/\/blog.umbler.com\/br\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.umbler.com\/br\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.umbler.com\/br\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.umbler.com\/br\/wp-json\/wp\/v2\/comments?post=1931"}],"version-history":[{"count":0,"href":"https:\/\/blog.umbler.com\/br\/wp-json\/wp\/v2\/posts\/1931\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.umbler.com\/br\/wp-json\/wp\/v2\/media\/5427"}],"wp:attachment":[{"href":"https:\/\/blog.umbler.com\/br\/wp-json\/wp\/v2\/media?parent=1931"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.umbler.com\/br\/wp-json\/wp\/v2\/categories?post=1931"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.umbler.com\/br\/wp-json\/wp\/v2\/tags?post=1931"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}