网站使用 rel="noopener" 打开外部锚

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

当您的页面链接至使用 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

相关文章
mitt.js:小型事件发布订阅库
mitt.js:小型事件发布订阅库
1983 0
|
人工智能 自然语言处理 安全
如何通过网关降低大模型的调用费用,并提升合规性
如何通过网关降低大模型的调用费用,并提升合规性
1156 106
|
图形学
3D游戏角色动画——Elaina(全流程人物建模)
要求把自选一个游戏人物+动物模型做一个完整的展示动画视频。具体要求包括: 给出游戏人物+动物模型的背景资料、设计思路,给出模型设计、道具设计和动作设计等前期设计文档。 以给出游戏人物+动物的基础模型或者图片,进行完整的模型重建过程。 对游戏人物+动物模型做出特效、头部、盔甲、服装、武器等方面修改。 要求对游戏人物+动物模型设定一组新的完整动作,其他请结合创意修改。 根据角色设计输出人物和动物模型的渲染动画,在片头中包括姓名/学号,片尾动作制作中间资料的展示。.........
1099 0
3D游戏角色动画——Elaina(全流程人物建模)
|
存储 Java 编译器
【Android 构建新工具】Bazel 构建Android项目
Bazel只是编译工具,不是真正的编译器,所以还是需要Andorid开发的SD、NDK以及Android Studio,并配置开发环境。
979 0
|
设计模式 测试技术 程序员
系统困境与软件复杂度,为什么我们的系统会如此复杂
![](https://ata2-img.oss-cn-zhangjiakou.aliyuncs.com/neweditor/fd86aea9-c53b-4847-9b3c-b9bc6ee53e10.png) # 前言 有一天,一个医生和一个土木工程师在一起争论“谁是世界上最古老的职业”。医生说:“上帝用亚当的肋骨造出了夏娃,这是历史上第一次外科手术,所以最古老的职业应该是医生”,土木工程师说:“
2513 2
系统困境与软件复杂度,为什么我们的系统会如此复杂
|
人工智能 运维 数据中心
大型数据中心内的网络“甜点”——阿里巴巴自研DAC之路
大型数据中心内的网络“甜点”——阿里巴巴自研DAC之路
大型数据中心内的网络“甜点”——阿里巴巴自研DAC之路
|
机器学习/深度学习 人工智能 算法
让多任务奔跑起来!Waymo开放数据集3D语义分割任务冠军方案分享(图森)
今天分享图森打榜Waymo开放数据集3D语义分割任务的技术报告,整篇文章读下来比较通透。比较经典的打榜思路,尤其是后面的多任务学习、两阶段优化,有打榜或训练大模型需求的小伙伴可以仔细读读~
让多任务奔跑起来!Waymo开放数据集3D语义分割任务冠军方案分享(图森)
|
网络安全 数据安全/隐私保护 iOS开发
Mac配置Ruby环境和安装CocoaPods
Mac配置Ruby环境和安装CocoaPods
Mac配置Ruby环境和安装CocoaPods
|
供应链 开发者
SWOT 分析 | 学习笔记
快速学习 SWOT 分析。
838 0
SWOT 分析 | 学习笔记

热门文章

最新文章