When you link to a page on another site using the `target="_blank"` attribute,
you can expose your site to performance and security issues:

- The other page may run on the same process as your page. If the other page is running a lot of JavaScript, your page's performance may suffer.
- The other page can access your `window` object with the `window.opener` property. This may allow the other page to redirect your page to a malicious URL.

Adding `rel="noopener"` or `rel="noreferrer"`
to your `target="_blank"` links avoids these issues.

> [!NOTE]
> **Note:** Anchors set to `target="_blank"` have [`noopener`](https://www.chromestatus.com/feature/6140064063029248) behavior by default. Explicit specification of \`rel="noopener" helps protect users with legacy browsers, including Edge Legacy.

## How the Lighthouse cross-origin destination audit fails

[Lighthouse](https://developer.chrome.com/docs/lighthouse/overview.md.txt) flags unsafe links to cross-origin
destinations:
![](https://developer.chrome.com/static/docs/lighthouse/best-practices/external-anchors-use-rel-noopener/image/lighthouse-audit-showing-b1f47b11d85bc.png) Lighthouse audit that shows unsafe links to cross-origin destinations.

Lighthouse uses the following process to identify links as unsafe:

1. Gather all `<a>` tags that contain the `target="_blank"` attribute but not the `rel="noopener"` or `rel="noreferrer"` attributes.
2. Filter out any same-host links.

Because Lighthouse filters out same-host links, there's an edge case you should
be wary of when working on a large site. If one page contains a
`target="_blank"` link to another page on your site without using
`rel="noopener"`, the performance implications of this audit still apply.
However, you won't see these links in your Lighthouse results.

> [!NOTE]
> **Note:** Each Best Practices audit is weighted equally in the Lighthouse Best Practices Score. Learn more in [The Best Practices
> score](https://developer.chrome.com/docs/lighthouse/performance/performance-scoring#best-practices).

## Improve your site's performance and prevent security vulnerabilities

Add `rel="noopener"` or `rel="noreferrer"`
to each link identified in your Lighthouse report.
In general, when you use `target="_blank"`, always
add `rel="noopener"` or `rel="noreferrer"`:

```html
<a href="https://examplepetstore.com" target="_blank" rel="noopener">
  Example Pet Store
</a>
```

- `rel="noopener"` prevents the new page from being able to access the `window.opener` property and ensures it runs in a separate process.
- [`rel="noreferrer"`](https://html.spec.whatwg.org/multipage/links.html#link-type-noreferrer) has the same effect and also prevents the `Referer` header from being sent to the new page.

Read [Share cross-origin resources safely](https://web.dev/articles/cross-origin-resource-sharing)
for more information.

## Resources

- [Source code for **Links to cross-origin destinations are unsafe** audit](https://github.com/GoogleChrome/lighthouse/blob/master/lighthouse-core/audits/dobetterweb/external-anchors-use-rel-noopener.js)
- [Site isolation for web developers](https://developer.chrome.com/blog/site-isolation.md.txt)