Extensões fofas do Chrome que não deixam seu navegador lento

Extensões decorativas de navegador têm uma fama, e ela é em boa parte merecida: pesadas, faladeiras, instaladas com uma lista de permissões que ninguém leu. O que é uma pena, porque a categoria é divertida de verdade e todos esses problemas dão para evitar.

Três coisas que vale verificar

• A lista de permissões. O Chrome mostra ela antes de instalar. Storage é um arquivo de preferências. Tabs, cookies, history e webRequest são as que deixam uma extensão olhar o que você navega.
• Se ela mexe no layout da sua página. Uma extensão que insere elementos no fluxo do documento, ou que mede posições a cada evento de rolagem, consegue travar uma página lisa por pouco que desenhe.
• Para onde ela manda requisições. Uma decoração com a aba de rede movimentada está fazendo um segundo trabalho que ninguém te contou.

Por que é o layout que morde

Ler uma propriedade de layout — a altura de um elemento, a posição dele na tela — obriga o navegador a terminar todo o trabalho de layout pendente antes de conseguir responder. Faça isso dentro de um tratador de rolagem e você pediu ao navegador para parar e medir sessenta vezes por segundo, numa página que ele estava desenhando pela metade.

Esse é o mecanismo por trás da maioria das reclamações de «essa extensão deixa a rolagem travada», e ele é invisível até alguém medir com um profiler. A correção não tem glamour: nunca ler layout durante a rolagem, escrever só transformações e deixar o compositor mover.

Como isso fica aqui

O scrolldog é um bichinho de pixel que corre pela borda de cada página na sua velocidade de rolagem. Ele também é um exemplo resolvido das verificações acima, porque precisou passar por elas para ser tolerável de conviver:

• Duas permissões: storage e unlimitedStorage. Sem tabs, sem cookies, sem history, sem webRequest.
• Uma permissão de host — api.scroll.dog — usada para conferir a licença, nunca para mexer na página em que você está.
• O bichinho mora numa trilha fixa de tamanho zero e só escreve uma transformação CSS, então o layout da sua página nunca muda.
• A rolagem é escutada de forma passiva e reduzida a uma escrita por quadro de animação.
• Um botão o tira de todas as abas abertas na hora.

Nada disso é vantagem — é o mínimo. Uma coisa cujo trabalho inteiro é ser bonita de olhar não tem por que deixar nada mais lento.