Visão geral de CDN, segurança e desempenho

Last updated:

O CMS da HubSpot é um dos sistemas de gerenciamento de conteúdo mais avançados e otimizados disponíveis no mercado. Como o HubSpot CMS é uma solução SaaS (software como serviço), lidamos com as questões relacionadas à segurança, à confiabilidade, à manutenção e muito mais, para que sua equipe possa se concentrar em escrever código e criar experiências de usuário encantadoras. 

A HubSpot trouxe várias melhorias de desempenho para você, mas ainda pode fazer muito mais. Como otimizar o desempenho no HubSpot CMS.

Rede de entrega de conteúdo (CDN)

A rede de distribuição de conteúdo distribuída globalmente do HubSpot CMS garantirá tempos de carregamento de páginas extremamente rápidos, independentemente de onde seus visitantes estejam. Não é necessária nenhuma configuração, instalação ou conta adicional para utilizar a CDN para hospedar mídias ou páginas. O sistema gerencia a distribuição e a invalidação do cache para que você possa se concentrar na construção de um ótimo site, enquanto um firewall de aplicativos web e medidas de segurança integradas fornecem tranquilidade contra ataques online.

Secure Socket Layer (SSL)

O SSL é incluído e provisionado automaticamente de forma gratuita em todos os domínios conectados nas contas do HubSpot CMS ou do Marketing Hub. Um certificado SAN próprio é provisionado em cada domínio, com opções configuráveis, como desativar o suporte para versões selecionadas do TLS, redirecionar solicitações feitas por HTTP para HTTPS e atender o cabeçalho HSTS para que solicitações futuras sejam feitas por https. Mediante solicitação, certificados SSL personalizados podem ser hospedados por uma taxa mensal adicional.

HTTP/2

Todo o tráfego SSL dos sites hospedados pela HubSpot é atendido usando HTTP/2. O HTTP/2 substitui a forma como o HTTP é expresso durante a transferência. O protocolo não é reescrito do zero; os métodos HTTP, os códigos de status e a semântica são os mesmos, e deve ser possível usar as mesmas APIs que o HTTP/1.x (possivelmente com algumas pequenas adições) para representar o protocolo.

O foco do protocolo é o desempenho, especificamente a latência percebida pelo usuário final e o uso de recursos de servidor e rede. Um dos principais objetivos é permitir o uso de uma única conexão entre os navegadores e um site.

IPv6

Todos os sites hospedados pela HubSpot incluem endereços IPv6 para que possam ser acessados nativamente por IPv6. IPv6 é a versão mais recente do Protocolo de Internet e expande o número de endereços disponíveis para uma quantidade praticamente ilimitada – 340 trilhões de trilhões de endereços. Os endereços IPv4 estão acabando na Internet. A transição para o IPv6 permite que a Internet continue a crescer e que novos serviços inovadores sejam desenvolvidos, uma vez que mais dispositivos podem se conectar à Internet.

Minificação de Javascript e CSS

Ao escrever JavaScript e CSS para páginas da HubSpot, você pode esperar o seguinte comportamento de minificação:

  • O HubSpot minifica automaticamente o JavaScript e o CSS incluídos no gerenciador de design para remover espaços, quebras de linha e comentários desnecessários. Isso também se aplica ao JavaScript e ao CSS carregados no gerenciador de design por meio da CLI

Observação: como a HubSpot reduz automaticamente o JavaScript e o CSS no gerenciador de design, você não deve adicionar código minificado diretamente ao gerenciador de design.

Para incluir código minificado, você deve fazer upload do arquivo no gerenciador de arquivos e anexá-lo ao gerenciador de design. Para vincular localmente um arquivo minificado a um módulo, você pode atualizar o meta.json do módulo para incluir css_assets ou js_assets.

  • A HubSpot não minifica arquivos JavaScript ou CSS que são carregados no gerenciador de arquivos ou referenciados por meio de links externos. Você deve garantir que esses arquivos sejam minificados antes de fazer upload.
  • Sempre que você atualizar um arquivo JavaScript ou CSS no gerenciador de design ou por meio de upload local, a HubSpot o minificará novamente de forma automática. Isso pode resultar em um pequeno atraso antes de a versão .min.js do arquivo ser distribuída às páginas ativas. Durante esse período, a HubSpot distribuirá a versão não minificada para garantir que os visitantes do site ainda obtenham a versão mais recente dos arquivos. 
  • Erros de sintaxe podem impedir a HubSpot de minificar um arquivo.
Além da minificação, você pode usar inclusões do HubL para combinar vários arquivos CSS em um único arquivo de modo a aumentar ainda mais o desempenho.

Cache de navegador e servidor

A HubSpot armazena automaticamente em cache as páginas e os arquivos tanto no servidor quanto no navegador para garantir alta velocidade de entrega de todos os artigos da página para todos os visitantes. Quando a sua página ou qualquer dependência dela (como um modelo ou módulo) muda, expiramos automaticamente os caches do servidor para essa página.

Reescrita de domínio

Cada domínio adicional usado em seu site incorre em uma pesquisa e conexão DNS adicionais. Quanto menos domínios você usar, mais rápido o site será carregado. O HTTP/2 oferece suporte ao carregamento de vários arquivos de forma simultânea pela mesma conexão; portanto, as antigas diretrizes para "fragmentar" seus ativos entre vários domínios não se aplicam mais.

As URLs de ativos referenciados em páginas do CMS, como arquivos do sistema de arquivos do desenvolvedor, CSS, JS e imagens, são regravadas automaticamente para corresponder ao domínio da página atual, quando possível. Portanto, se você acessar uma imagem em http://cdn2.hubspot.net/hubfs/53/HubSpot_Logos/HSLogo_gray.svg em uma página exibida em www.hubspot.com, a URL será atualizada automaticamente para https://www.hubspot.com/hubfs/HubSpot_Logos/HSLogo_gray.svg.

Compressão de texto

Arquivos baseados em texto, como HTML, CSS e JS, são todos compactados usando brotli antes de serem distribuídos aos navegadores. A compactação Brotli é ainda mais significativa do que GZIP. Se o cliente não indicar suporte à compactação Brotli, a compactação gzip será aplicada.

Enquanto a minificação acelera o tempo de análise de arquivos CSS e JS no navegador, a compressão permite distribuir esses arquivos para o navegador de forma mais rápida.

Compactação/otimização e redimensionamento automático de imagens

Quando você carrega uma imagem no gerenciador de arquivos, ela é otimizada automaticamente. Especificamente, JPEGs e PNGs têm seus metadados eliminados (EXIF e outros itens que tornam as imagens maiores). Todas as imagens (exceto arquivos GIF) também são recompactadas para não exibirem perdas. Além disso, podemos atender imagens em uma codificação diferente se puderem ser representadas como um PNG menor do que um JPEG.

As imagens são salvas novamente em 72 dpi, independentemente da resolução original. Se você carregar um arquivo em 300 dpi, originalmente criado para impressão, ele será convertido para 72 dpi, que é o padrão para a web.

Aprimoramos progressivamente as imagens para usar o formato WebP em navegadores compatíveis. As imagens serão exibidas em formato WebP se o tamanho de arquivo dessa versão da imagem for menor. Essa conversão acontece no lado do servidor e não altera a extensão do arquivo na URL. Uma imagem carregada como .jpg ainda será exibida como .jpg na URL, mas será distribuída como WebP. Assim, os links dessa imagem funcionarão para todos, independentemente do suporte a WebP.

As imagens hospedadas pela HubSpot e inseridas no conteúdo do CMS serão redimensionadas automaticamente pela HubSpot, evitando que o navegador gaste recursos para fazer isso. Para isso, a HubSpot adiciona parâmetros de consulta de altura e/ou largura à URL src de quaisquer imagens que tenham um atributo de largura ou altura. Observação: o redimensionamento da imagem leva menos de um minuto; se a página for solicitada antes de a imagem ser redimensionada, a imagem não redimensionada será exibida para essa solicitação. Os navegadores recebem várias opções para que a resolução da imagem seja carregada. Assim, suas imagens ficam nítidas em monitores padrão e de alta resolução.

A otimização/compressão e o redimensionamento automático de imagens são ativados por padrão para todas as páginas/arquivos hospedados pela HubSpot.

Captura de tela do elemento img com srcset adicionado automaticamente em diferentes URLs de redimensionamento

Para arquivos jpg individuais, se a URL da imagem tiver o parâmetro de consulta quality=high, a imagem não sofrerá compressão.

Os desenvolvedores que trabalham com o HubSpot CMS também podem fornecer contexto adicional do HubSpot às imagens para controlar ainda mais o redimensionamento. Isso é feito através da função resize_image_url(). Assim, os desenvolvedores podem incluir contenções nos módulos para evitar que os criadores de conteúdo exibam imagens grandes em páginas e e-mails. A função também pode ser útil para situações em que o tamanho de uma imagem não é definido por atributos de altura e largura dentro do HTML, como uma imagem de fundo.

Accelerated Mobile Pages (AMP)

O AMP, ou Accelerated Mobile Pages, é um formato de página específico para dispositivos móveis que carrega conteúdo quase que instantaneamente. O AMP pode ser ativado nos posts de blog hospedadas pela HubSpot com o toque de um botão. Consulte Como usar Accelerated Mobile Pages (AMP) no HubSpot para obter mais detalhes.


Este artigo foi útil?
Este formulário deve ser usado apenas para fazer comentários sobre esses artigos. Saiba como obter ajuda para usar a HubSpot..