What is rel=noopener

rel='noopener' Keeps You Safe and Fast

Performance

When you open another page using target="_blank", the other page may run on the same process as your page, unless Site Isolation is enabled. If the other page is running a lot of JavaScript, your page's performance may also suffer. See The Performance Benefits of rel=noopener.

Security

The other page can access your window object with the window.opener property. This exposes an attack surface because the other page can potentially redirect your page to a malicious URL. See About rel=noopener.

Recommendations

In general, when you use target="_blank", always add rel="noopener" or rel="noreferrer".

<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" attribute has the same effect, but also prevents the Referer header from being sent to the new page. See Link type "noreferrer".

Reference Links

• Links to cross-origin destinations are unsafe
• What is rel="noopener" in WordPress? (Explained)
• About rel=noopener - GitHub Pages
• rel='noopener' Keeps You Safe and Fast - Love2Dev