# rel=noopener para benefícios de performance e segurança

> Use rel=noopener para performance e segurança web. Proteja sites de vulnerabilidades sérias e melhore velocidade em links externos. Proteja-se!

URL: https://dpw.dev/miscelanea/relnoopener-performance-seguranca/  
Publicado em: 2017-06-06  
Categoria: miscelanea  
Tags: performance  
Autor: Tárcio Zemel

Já ouviu falar do **rel=noopener**, atributo que se coloca em links externos? Neste artigo, aprenda mais sobre isso e como é possível, com a adição de poucos caracteres, trazer melhorias de desempenho e segurança para seus sites.

> Artigo baseado em [The performance benefits of rel=noopener](https://jakearchibald.com/2016/performance-benefits-of-rel-noopener/).

Se você tem links para outra site, a recomendação é usar `rel="noopener"`, especialmente se eles abrirem em uma nova janela/aba.

```
Exemplo de link

```

Sem isso, a nova página pode acessar seu objeto de janela via `window.opener`. Felizmente, o modelo de segurança de origem da web impede que ele leia sua página; infelizmente, para algumas API legadas significa que é possível navegar na página para um URL diferente usando `window.opener.location = newURL`.

> **Dica:** [Mathias Bynens escreveu sobre isso em detalhes](https://mathiasbynens.github.io/rel-noopener/) e, além disso, também há benefícios em performance.

## Janelas e processos

A maioria dos navegadores é multiprocesso -- com a exceção do Firefox, [mas eles estão trabalhando nisso](https://developer.mozilla.org/en-US/Firefox/Multiprocess_Firefox). Cada processo possui várias threads, incluindo o que frequentemente é chamado de "a thread principal". É aí que a análise, o cálculo do estilo, o layout, o painting de CSS e o JavaScript (não-worker) são executados. Isso significa que JavaScript executado em um domínio é executado em uma thread diferente para uma janela/guia acessando outro domínio.

No entanto, devido ao acesso síncrono cross-window que o DOM provê via `window.opener`, janelas executadas via `target="_blank"` acabam no mesmo processo e thread -- e o mesmo é verdadeiro para iframes e janelas abertas via `window.open`.

`rel="noopener"` impede `window.opener`, portanto não há acesso cross-window. Navegadores Chromium são otimizados para isso e abrem a nova página em seu próprio processo.

Em outras palavras, ao usar `rel="noopener"` em links externos, especifica-se que o acesso deve ser feito em outro processo, trazendo benefícios nas áreas de segurança e performance!

## Conclusão

Para garantir benefícios em performance e segurança, pode haver algo mais simples do que colocar um atributo `rel="noopener"` em links externos?

Por enquanto, ainda não é algo suportado em absolutamente todos os navegadores, mas a ideia é que estes benefícios sejam logo vistos pelos vendors e que seus produtos estejam preparados para o noopener o quanto antes isso acontecer. Também, é possível que no futuro existam maneiras mais práticas de, por exemplo, especificar que todos os links devam obedecer esta feature sem a necessidade de especificar link a link.

A web evolui a cada dia. E de forma surpreendente e emocionante. É bom saber que ainda poderemos presenciar e apreciar muitas melhorias mais.

---

Fonte: [dpw - desenvolvimento para web](https://dpw.dev/) (pt-BR).
Guia para agentes: https://dpw.dev/llms.txt
Índice completo: https://dpw.dev/sitemap-index.xml
Feed: https://dpw.dev/rss.xml