当您的页面链接至使用 target="_blank" 的另一个页面时,新页面将与您的页面在同一个进程上运行。 如果新页面正在执行开销极大的 JavaScript,您的页面性能可能会受影响。

此外,target="_blank" 也是一个安全漏洞。新的页面可以通过 window.opener 访问您的窗口对象,并且它可以使用 window.opener.location = newURL 将您的页面导航至不同的网址。

单击下面的一个链接,打开一个需要大量JavaScript计算的页面(以下并非链接,请参见原文——译者注):

<a target="_blank">
<a target="_blank" rel="noopener">

没有rel="noopener",随机数会被新打开页面中的JavaScript阻断。不仅如此,所有主线程活动也会被阻塞,试试选择页面中的文本。但加了rel="noopener"之后,随机数生成一直保持在60fps。当然,是在Chrome或Opera中。

大多数浏览器都是多进程的,除了Firefox(他们正在改)。每个进程包含多个线程,包括我们常说的“主”线程。解析、样式计算、布局、绘制和非worker的JavaScript都在主线程里执行。就是说,一个域中的JavaScript与另一个标签页或窗口中的域中的JavaScript在不同的线程里。

然而,由于我们可以通过window.opener同步跨窗口地访问DOM,因此通过target="_blank"启动的窗口还在同一个进程(线程)中。通过window.open打开的iframe和窗口也一样。

rel="noopener"会阻止window.opener,因此不存在跨窗口访问。Chromium浏览器为此做过优化,会在独立的进程中打开新页面。

REFs

网站使用 rel="noopener" 打开外部锚的更多相关文章

  1. Web 安全问题 rel="noopener nofollw"

    1. noopener 如果你需要用 a 标签打开一个标签页时,你会使用 target='_blank' 这个属性,此时你需要添加 rel='noreferrer noopener' 当你使用 tar ...

  2. a标签属性 rel=noopener noreferrer

    当你浏览一个页面点击一个a标签链接跳转到另一个页面时, <a href="http://www.baidu.com" target="_blank"> ...

  3. a rel=noopener

    看vue-element-admin的源码的时候,看到a 标签使用  rel=noopener: 然后就很奇怪这个是干什么用的:然后百度到一篇文章,涨知识了. 个人的理解是:不加 rel=noopen ...

  4. WEB - 关于rel="noopener"

    参考网址 https://mathiasbynens.github.io/rel-noopener/ 例子 <a href="https://cli.vuejs.org" t ...

  5. Pyqt 打开外部链接的几种方法

    Pyqt 触发一个事件,打开外部链接,我找到了这个方法,供大家参考 1. QDesktopServices 的openUrl 方法 QtGui.QDesktopServices.openUrl(QtC ...

  6. Android打开外部DB文件

    DB文件要放在Assets文件夹下,封装一个工具类,如下: package com.XX.DB; import java.io.File; import java.io.FileOutputStrea ...

  7. C# 以嵌入到窗体的方式打开外部exe

    using System; using System.Collections.Generic; using System.Text; using System.Diagnostics; using S ...

  8. 微信不支持App下载的解决方案 微信跳转打开外部浏览器下载(苹果跳转商店下载)

    在微信中,打开app下载链接,或者使用微信扫一扫app下载二维码,都是无法下载app的. 因为腾讯为了自身利益,屏蔽了其他app直接在微信中下载.下面给分享下,找到的2种有效的解决方案. 方案:点击链 ...

  9. MFC 用ShellExecute打开外部文件

    知识点: 获取CListCtrl选中文本 用ShellExecute打开外部文件 一.CListCtrl::GetFirstSelectedItemPosition CListCtrl::GetFir ...

随机推荐

  1. POJ1175:Starry Night(bfs)

    http://poj.org/problem?id=1175 题目解析: 这个题因为数据的原因可以很水的过,但我因为把1e-8写成了1e-9WA了N遍,一直WA,题目意思很简单就是相似图形(就是求旋转 ...

  2. PAT 1128 N Queens Puzzle[对角线判断]

    1128 N Queens Puzzle(20 分) The "eight queens puzzle" is the problem of placing eight chess ...

  3. iOS error: -34018

    一般报这个错误是由于操作keychain 报的错. 遇到该情况的情况: 1.是否打开权限 2.苹果自身的bug,传送门:https://stackoverflow.com/questions/2974 ...

  4. linux时区问题

    时区问题很麻烦- 0.查看时间命令 #date 查看系统时间 #date -s 修改时间,看下面的例子 #// (将系统日期设定为2014年07月16日) #:: (将系统时间设定为下午11::) # ...

  5. Python笔记 #10# Histograms

    1.Build a histogram In [1]: help(plt.hist) Help on function hist in module matplotlib.pyplot: hist(x ...

  6. 初识PHP(二)常用函数

    在此记录一些常用库函数和常用语法以便查阅 一.PHP手册 php手册中文地址 http://php.net/manual/zh 二.一些常用操作 2.1字符串操作 2.1.1 strpos — 查找字 ...

  7. POJ 1840 Eqs(乱搞)题解

    思路:这题好像以前有类似的讲过,我们把等式移一下,变成 -(a1*x1^3 + a2*x2^3)== a3*x3^3 + a4*x4^3 + a5*x5^3,那么我们只要先预处理求出左边的答案,然后再 ...

  8. [调参]batch_size的选择

    链接:https://www.zhihu.com/question/61607442/answer/440944387 首先反对上面的尽可能调大batch size的说法,在现在较前沿的视角来看,这种 ...

  9. [原][译][osgearth][EarthFile]关于EarthFile 的Model Layer 讲解(通过earth文件加载模型层)(OE官方文档翻译)

    原文参考:http://docs.osgearth.org/en/latest/references/earthfile.html#model-layer 本人翻译能有限.... 模型层 模型层渲染“ ...

  10. thinkphp3.2笔记(4)模板函数的使用 foreach标签

    一  模板函数的使用 1.代码 效果: 函数会按照从左到右的顺序依次调用.如果你觉得这样写起来比较麻烦,也可以直接这样写:{:substr(strtoupper(md5($name)),0,3)} 默 ...