Utilizando e melhorando a performance do seu website com o Cloudinary
Recentemente trabalhamos em uma repaginada no nosso website, modificamos alguns textos e aproveitamos para substituir algumas imagens. Quando começamos esse processo, logo no inicio, me lembrei que tempos atrás havia trabalhado com o Cloudinary em uma empresa, então fui verificar no website deles os planos, e para minha surpresa existe um plano free que por enquanto vem suprindo nossas necessidades.
Não queríamos mais fazer upload das nossas publicações em nosso próprio servidor, queríamos testar o nosso website colocando a maioria das imagens em um servidor separado. Começamos a subir as imagens no Cloudinary para algumas postagens e até para algumas páginas do nosso website, muitas postagens ainda estão sem imagens porque foram migradas de um website antigo nosso, e que no momento ainda não temos intenção de colocar imagens, enfim.
O bacana de utilizar o Cloudinary é que, além de dar uma folga ao seu servidor, ele permite algumas configurações interessantes, por exemplo você faz o upload da sua imagem como preferir, no tamanho e resolução que preferir, mas você pode definir nas configurações da imagem como quer utilizá-la no seu website, tamanho, qualidade, pode editar, pode aumentar, diminuir, cortar e a sua imagem original estará lá, o que o sistema faz é gerar um link de referência para a imagem que você criou e você coloca no seu website, vou exemplificar.
O GTMETRIX (sistema de análise de websites) nos mostrou que umas seis imagens do nosso website poderiam ser otimizadas, e o bacana é que ele mesmo te informa qual redimensionamento você deve fazer, uma das imagens estava em 402 x 402 e ele alertou que poderíamos utilizar 100 x 100 ganhando mais desempenho, entramos no Cloudinary, acessamos a imagem e editamos para 100 x 100, o que o Cloudinary fez foi deixar a imagem existente em sua versão original, mas gerou uma nova imagem com tamanho 100 x 100, o que muda? O link, por exemplo, se o link original é com final /imagem.jpg, o que o sistema vai criar uma nova utilizando alguma nova referencia, por exemplo /c_scale,w_100/imegam.jpg, sério, isso é muito bacana. Fora isso você tem diversas outras funções, eu estou falando aqui do básico que utilizo, crio pastas para organizar, edito as imagens, muito bom.
A nossa experiência utilizando um bom sistema de cache, diminuindo requisições para o servidor, retardando a análise de JavaScript, trabalhando o bloqueio de renderização e agora com o Cloudinary é muito boa, não tenho uma imagem dos resultados do GTMETRIX anteriores, mas alcançamos uma ótima pontuação atualmente. No Website Grader também. É normal variar um pouco para mais e um pouco para menos, o importante é essa média.
Se você quer ter um website bem otimizado, o caminho é esse. Se tiver dúvidas, entre em contato.
Quando você compartilha as nossas publicações, você ajuda o nosso time a se manter motivado. Compartilhe.
