Neste documento, abordaremos como otimizar a performance de um site ao usar um script de aviso de consentimento de cookies. O objetivo é comparar a performance do site em quatro cenários: sem instalar o aviso de consentimento, instalando o aviso de consentimento imediatamente, instalando o aviso de consentimento imediatamente com o atributo "async" e instalando o aviso de consentimento após um atraso ou após o movimento do mouse do usuário. Vamos analisar as implicações de desempenho em cada um desses cenários.
Cenário 1: Sem o aviso de consentimento
Neste cenário, o site não possui um aviso de consentimento de cookies. A performance é maximizada, uma vez que nenhum script adicional está sendo executado.
Performance sem o aviso de consentimento
Código
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Performance Test</title>
<meta name="description" content="This is a performance test" />
</head>
<body>
Performance Test
</body>
</html>
Cenário 2: Instalando imediatamente
Neste cenário, o aviso de consentimento de cookies é instalado imediatamente no carregamento da página. Isso pode afetar a performance do site.
Performance com o aviso de consentimento imediato
Código
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Performance Test</title>
<meta name="description" content="This is a performance test" />
<meta
name="adopt-website-id"
content="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
/>
<script
src="//tag.goadopt.io/injector.js?website_code=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
class="adopt-injector"
></script>
</head>
<body>
Performance Test
</body>
</html>
Cenário 3: Instalando imediatamente com Async
Neste cenário, o aviso de consentimento de cookies é instalado imediatamente no carregamento da página com o atributo 'async'. Isso acaba melhorando a performance do site, pois o script é executado em paralelo.
Performance com o aviso de consentimento imediato com Async
Código
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Performance Test</title>
<meta name="description" content="This is a performance test" />
<meta
name="adopt-website-id"
content="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
/>
<script
async
src="//tag.goadopt.io/injector.js?website_code=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
class="adopt-injector"
></script>
</head>
<body>
Performance Test Async
</body>
</html>
Cenário 4: Instalando após um delay ou movimento do mouse
Neste cenário, o aviso de consentimento de cookies é instalado após um atraso ou em resposta ao movimento do mouse do usuário. Isso pode melhorar a experiência do usuário e limitar o impacto negativo na performance, pois não carregará grandes conteúdos imediatamente.
Performance com o aviso de consentimento após um delay ou movimento do mouse
Código
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Performance Test</title>
<meta name="description" content="This is a performance test" />
<meta
name="adopt-website-id"
content="xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
/>
<script>
var scriptLoaded = false; function loadScript() {
if (!scriptLoaded) {
var script = document.createElement("script");
script.src =
"//tag.goadopt.io/injector.js?website_code=xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx";
script.classList.add("adopt-injector");
document.head.appendChild(script);
scriptLoaded = true;
}
} setTimeout(loadScript, 4000); document.addEventListener("mousemove", function () {
loadScript();
document.removeEventListener("mousemove", loadScriptOnMouseMovement);
});
</script>
</head>
<body>
Performance Test
</body>
</html>
Comparação dos Cenários
Aqui estão algumas conclusões com base na comparação dos três cenários:
Cenário 1: Sem o aviso de consentimento, a performance é a melhor, mas pode não estar em conformidade com as regulamentações de privacidade de dados.
Cenário 2: A instalação imediata do aviso de consentimento pode impactar negativamente a performance do site. Como se trata de uma questão de milissegundos, essa alteração na performance acaba prejudicando os sistemas de busca e pode reduzir o ranqueamento do site, sem afetar a experiência do usuário.
Cenário 3: Instalar o aviso de consentimento com a utilização do atributo "async" melhora um pouco a performance em comparação com o cenário anterior, no entanto, ainda pode causar problemas em relação ao ranqueamento nos sistemas de busca.
Cenário 4: Instalar o aviso de consentimento após um atraso ou em resposta ao movimento do mouse do usuário pode equilibrar a conformidade com a privacidade de dados e a performance do site. No entanto, a experiência do usuário pode ser afetada se o atraso for muito longo.
Este documento tem o objetivo de fornecer uma visão geral das implicações de desempenho ao usar um aviso de consentimento de cookies e oferecer orientações sobre como otimizar a performance do site. A escolha do cenário adequado dependerá das necessidades e prioridades específicas do seu site e do seu público-alvo.