Por que sites grandes hospedam suas imagens / css em domínios externos?

Por que sites como Facebook, Twitter e Google hospedam suas imagens e css em domínios externos, como:

• Facebook: static.ak.fbcdn.net
• Twitter: a0.twimg.com
• Google: ssl.gstatic.com

Questões):

• É desempenho? ou segurança?

@toomanyairmiles está parcialmente correto - o objetivo dessa técnica é permitir conexões paralelas do navegador da web ao servidor. Os navegadores da Web devem permitir no mínimo duas conexões simultâneas com um único host, mas muitos novos navegadores podem gerenciar até 60. Independentemente, as conexões simultâneas simultâneas entre o navegador e os servidores da Web são um grande gargalo na velocidade.

Do recurso do Google :

A especificação HTTP 1.1 (seção 8.1.4) afirma que os navegadores devem permitir no máximo duas conexões simultâneas por nome de host (embora os navegadores mais novos permitam mais do que isso: consulte Browserscope para obter uma lista). Se um documento HTML contiver referências a mais recursos (por exemplo, CSS, JavaScript, imagens etc.) que o máximo permitido em um host, o navegador emitirá solicitações para esse número de recursos e enfileirará o restante. Assim que algumas solicitações terminam, o navegador emite solicitações para o próximo número de recursos na fila. Ele repete o processo até baixar todos os recursos. Em outras palavras, se uma página referenciar mais de X recursos externos de um único host, em que X é o número máximo de conexões permitidas por host, o navegador deverá baixá-los sequencialmente, X por vez, incorrendo em 1 RTT para todos os recursos X. O tempo total de ida e volta é N / X, onde N é o número de recursos a serem buscados de um host. Por exemplo, se um navegador permitir 4 conexões simultâneas por nome de host e uma página referenciar 100 recursos no mesmo domínio, ocorrerá 1 RTT para cada 4 recursos e um tempo total de download de 25 RTTs.

Portanto, a maneira de contornar isso é "fragmentar" as solicitações para domínios ou hosts diferentes:

Novamente, do mesmo recurso do Google:

Equilibre recursos paralelizáveis ​​entre nomes de host. As solicitações da maioria dos recursos estáticos, incluindo imagens, CSS e outros objetos binários, podem ser paralelizadas. Equilibre solicitações para todos esses objetos, tanto quanto possível entre os nomes de host. Se isso não for possível, como regra geral, tente garantir que nenhum host atenda mais de 50% a mais do que a média em todos os hosts. Portanto, por exemplo, se você tiver 40 recursos e 4 hosts, cada host deverá servir idealmente 10 recursos; na pior das hipóteses, nenhum host deve atender a mais de 15. Se você possui 100 recursos e 4 hosts, cada host deve atender 25 recursos; nenhum host deve servir mais de 38.

Mas, há mais uma peça no quebra-cabeça. Cada solicitação normalmente vem com suas próprias despesas gerais, normalmente na forma de cookies. Elementos estáticos como imagens, CSS e JavaScript não precisam transmitir dados de cookies, portanto, fornecê-los a partir de (sub) domínios sem cookies pode resultar em viagens de ida e volta mais rápidas:

O conteúdo estático, como imagens, arquivos JS e CSS, não precisa ser acompanhado por cookies, pois não há interação do usuário com esses recursos. Você pode diminuir a latência da solicitação, fornecendo recursos estáticos de um domínio que não serve cookies. Essa técnica é especialmente útil para páginas que fazem referência a grandes volumes de conteúdo estático raramente armazenado em cache, como alterações frequentes de miniaturas de imagens ou arquivos de imagens acessados ​​com pouca frequência. Recomendamos esta técnica para qualquer página que atenda a mais de 5 recursos estáticos. (Para páginas que oferecem menos recursos que isso, não vale o custo de configurar um domínio extra.)

Para reservar um domínio sem culinária para veicular conteúdo estático, registre um novo nome de domínio e configure seu banco de dados DNS com um registro CNAME que aponte o novo domínio para o registro A do domínio existente. Configure seu servidor da web para servir recursos estáticos do novo domínio e não permita que nenhum cookie seja definido em nenhum lugar desse domínio. Nas suas páginas da web, faça referência ao nome de domínio nos URLs para os recursos estáticos.

No passado, os navegadores da Web eram capazes de baixar apenas dois itens de uma vez (agora com 6 ou mais), portanto, o download de recursos de vários domínios é mais rápido que um único domínio. Isso se aplica a tudo, desde imagens a javascripts.

Muitas empresas também usam uma CDN , uma ferramenta que garante que o usuário final obtenha seus dados de um servidor geograficamente próximo a eles, o que também aumenta o desempenho do site, reduzindo o tempo de ida e volta para solicitações de recursos.

Sites grandes movem seu conteúdo estático (imagens, arquivos JS e CSS) para uma rede de entrega de conteúdo ou CDN, pois a implantação de seu conteúdo em vários servidores geograficamente dispersos fará com que suas páginas sejam carregadas mais rapidamente da perspectiva do usuário.

Como a CDN possui um nome de domínio diferente, também oferece benefícios de fragmentação de domínio .

A restrição de dois itens não é mais um problema. Embora seja uma recomendação da especificação HTTP, todos os navegadores modernos permitem pelo menos 6 conexões simultâneas .

Isso ainda é necessário para cookies indesejáveis ​​enviados ao cabeçalho enquanto o nome de domínio externo não tiver cookies definidos, portanto, é muito mais rápido carregar o conteúdo.

Então, sim, ainda é necessário para fins de velocidade.