Performance

Sustentabilidade: a performance do seu site pode ajudar a salvar o planeta

Sustentabilidade: a performance do seu site pode ajudar a salvar o planeta

Você pode não pensar nisso com frequência, mas a Internet usa uma quantidade enorme de eletricidade e essa eletricidade precisa ser produzida em algum lugar. Na maioria dos países, isso significa a queima de combustíveis fósseis. Isso, por sua vez, significa que a pegada de carbono da Internet cresceu, se tornando a maior máquina movida a carvão da Terra.

O Mozilla Internet Health Report 2018 afirma que “a sustentabilidade deve ser uma prioridade maior”. Mas do jeito que está, os sites estão ficando cada vez mais pesados, o que significa que a demanda de energia da Internet continua crescendo.

Ao mesmo tempo, os impactos das mudanças climáticas ficam piores e mais numerosos a cada ano que passa. A grande maioria dos cientistas climáticos atribui a crescente ferocidade e frequência de eventos climáticos extremos ao redor do mundo às mudanças climáticas, que eles atribuem em grande parte à atividade humana. Embora alguns questionem a ciência, até mesmo as maiores empresas de petróleo do mundo agora aceitam e admitem que seus modelos de negócios precisam mudar.

Muitos esforços estão em andamento para melhorar a situação na web. A Green Web Foundation mantém um banco de dados cada vez maior de hosts da web que são totalmente movidos por energia renovável ou estão pelo menos comprometidos em ser neutros em carbono.

Desde 2009, o Greenpeace pressiona grandes empresas de Internet para limpar sua matriz energética por meio de sua campanha Clicking Clean. Em parte como resultado dessa campanha, o Google anunciou no ano passado que, pela primeira vez, comprou energia renovável suficiente para corresponder a 100% de seu consumo global para as operações.

Portanto, além de alimentar os servidores com energia renovável, o que mais os desenvolvedores da web podem fazer sobre as mudanças climáticas?

1. Performance e sustentabilidade

Talvez a maior vitória quando se trata de tornar os sites mais sustentáveis ​​é que performance, experiência do usuário e sustentabilidade estão todos perfeitamente interligados.

A principal métrica para medir a sustentabilidade de um produto digital é o uso de energia. Isso inclui o trabalho feito pelo servidor, o cliente e as redes de comunicação intermediárias que transmitem dados entre os dois.

Com isso em mente, talvez a primeira coisa a considerar seja como medimos o uso de energia do nosso site? Existem, bons recursos que podemos usar e que demonstram o uso de energia. Isso inclui a transferência de dados (ou seja, quantos dados o navegador precisa baixar para exibir seu site) e o uso de recursos do hardware servindo e recebendo o site. Uma métrica óbvia aqui é o uso da CPU, mas o uso da memória e outras formas de armazenamento de dados também desempenham seu papel.

Veja também: Como melhorar o desempenho do seu site

A transferência de dados é algo que podemos medir facilmente. Todos os principais navegadores fornecem ferramentas de desenvolvedor que nos permitem medir a atividade da rede.

2. Web design sustentável

Como podemos otimizar o site para torná-lo mais sustentável, com mais performance e, uma melhor experiência de uso?

Se estivermos fazendo uma reformulação completa de um site, ou começando um novo do zero, podemos começar com algumas perguntas. Por exemplo, o que realmente merece ou precisa estar em uma página inicial? E, mais especificamente, que valor cada elemento de uma página inicial traz? Como diz Heydon Pickering:

“O recurso de maior desempenho, acessível e fácil de manter de um site é aquele que você não cria em primeiro lugar.”

Jack que trabalha no WordPress.com, decidiu se desafiar criando um tema WordPress minimalista para ver até onde poderia levar as técnicas de web design sustentável. O resultado é um tema chamado Susty, e pode ser visto em ação no site que o acompanha: sustywp.com. Nesse exemplo específico, o site é entregue em pouco mais de 6 KB de transferência de dados, o que é bom, visto que o site médio tem cerca de 1,5 MB.

3. Reduzir solicitações de rede

A maioria dos websites possuem uma série de solicitações HTTP acontecendo que não são necessárias. Por exemplo, o WordPress agrupa alguns CSS e JavaScript que detectam o uso de emojis e garante que eles não apareçam como caracteres ilegais. Não há nada de intrinsecamente errado com isso, mas se você não planeja usar emojis, você pode evitar que eles carreguem.

Isso representa uma economia relativamente pequena, mas ao estabelecer uma filosofia de remoção de códigos e solicitações indesejados de nossas páginas, podemos fazer melhorias de performance muito mais significativas. Por exemplo:

  • Carrossel de imagens
    Precisamos mesmo de todas essas imagens? Eles estão melhorando significativamente a experiência do usuário? Ou poderíamos reduzi-lo a apenas uma imagem forte?
  • Fornecer imagens no formato WebP
    WebP é um formato de imagem moderno que fornece compactação superior sem perdas de qualidade. Usando o WebP, websites podem fornecer imagens menores e mais ricas que o tornam mais rápido.
  • Vídeos do YouTube
    Um vídeo do YouTube incorporado normalmente adiciona cerca de um megabyte de transferência de dados antes mesmo de alguém interagir com ele. Se apenas uma fração de nossos usuários fosse realmente assistir ao vídeo incorporado em nosso site, poderíamos apenas criar um link para ele?
  • Otimização e minificação de recursos
    Juntamente com tudo acima, devemos sempre minimizar HTML, CSS e JavaScript e concatenar quando apropriado.

Veja também: Como otimizar imagens no seu site WordPress e melhorar a performance

4. Modo de escrever o CSS

Quando se trata de otimização e performance de um site, devemos ter em mente que literalmente todos os caracteres do código contam. Cada caractere representa um byte, e mesmo depois de serem compactados pelo gzip, eles ainda estão ganhando peso.

CSS é um arquivo em que costumamos ver muitos inchaços. Felizmente, há um número crescente de ferramentas cada vez mais complexas que podem ajudá-lo a eliminar CSS não utilizado.

Se estamos começando do zero, talvez devêssemos pensar mais profundamente sobre como escrevemos CSS em primeiro lugar.

5. Desempenho do servidor

Até agora, o foco tem sido quase inteiramente no front-end, mas muito disso se torna irrelevante se não otimizarmos o lado do servidor.

Devemos tornar o serviço de nosso site o mais fácil possível para nosso servidor. Devemos usar HTTP/2 sobre HTTPS. Usar HTTPS abre um mundo de novas tecnologias da web que nos permite tratar a própria rede como algo útil.

Espero ter convencido você de que vale a pena fazer um esforço para tornar nossos sites mais sustentáveis. Especialmente porque, no processo, também fazemos garantimos que o site:

  • Tenha mais performance,
  • Seja mais amigável,
  • Mais acessível,
  • Melhor otimizado para motores de busca.

Fonte