写点什么

Chrome 54 终结 YouTube 的 Flash 内嵌技术

  • 2016-10-19
  • 本文字数:1686 字

    阅读完需:约 6 分钟

谷歌已经启动了 Chrome 54 项目。最新发布的版本进一步地边缘化 Flash,转而使用 HTML5 在浏览器里内嵌 YouTube 视频,同时包含了大量问题修复和功能改进。

谷歌移除 Flash 的工作已经进行了一段时间,发布的多个更新强化了用户和开发者对 HTML5 的使用体验。

YouTube 从 2015 年 1 月份开始使用 HTML5 作为默认的视频内嵌技术,谷歌在去年改变了 Chromium 处理网站 Flash 的方式。

从 Chrome 45 开始,浏览器在运行最重要的内容并暂停其它 Flash 内容之前会先检测网页中是否包含了 Flash 内容。

Chrome 54 稳定版重写了 YouTube 内嵌 Flash 的方式,当检测到有内嵌的 Flash YouTube 视频,浏览器会自动使用 HTML5 替代它。谷歌表示这个变化是“为了减少 Flash 在 Chrome 中的使用”。

Chrome 54 还带来了 Custom Elements 规范的 v1 版本。

Custom Elements v1:可重用 Web 组件这篇博文里,谷歌工程师 Eric Bidelman 说,通过使用自定义元素,“Web 开发者可以创建新的 HTML 标签,弥补已有标签的不足,也可以对其他开发者开发的组件进行扩展”。另外,跟 v0 版本不一样的是,v1 版本的 API 在设计上有很大不同。

关于如何遵循 v1 规范为一个元素定义 JavaScript API,Bidelman 说:

自定义元素的功能是通过 ES2015 类来定义的,ES2015 扩展了 HTMLElement。扩展 HTMLElement 可以保证自定义元素会继承整个 DOM API,也就是说,为这个类添加的任何一个属性 / 方法都会成为自定义元素 DOM 接口的一部分。本质上,就是使用这个类为你的标签创建 JavaScript API。

Bidelman 举了 AppDrawer 这个例子来说明如何定义 DOM 接口,其中类的属性被映射成 HTML 属性:

复制代码
class AppDrawer extends HTMLElement {
// A getter/setter for an open property.
get open() {
return this.hasAttribute('open');
}
set open(val) {
// Reflect the value of the open property as an HTML attribute.
if (val) {
this.setAttribute('open', '');
} else {
this.removeAttribute('open');
}
this.toggleDrawer();
}
// A getter/setter for a disabled property.
get disabled() {
return this.hasAttribute('disabled');
}
set disabled(val) {
// Reflect the value of the disabled property as an HTML attribute.
if (val) {
this.setAttribute('disabled', '');
} else {
this.removeAttribute('disabled');
}
}
// Can define constructor arguments if you wish.
constructor() {
// If you define a ctor, always call super() first!
// This is specific to CE and required by the spec.
super();
// Setup a click listener on <app-drawer> itself.
this.addEventListener('click', e => {
// Don't toggle the drawer if it's disabled.
if (this.disabled) {
return;
}
this.toggleDrawer();
});
}
toggleDrawer() {
...
}
}
customElements.define('app-drawer', AppDrawer);
</app-drawer>

关于更多自定义元素的信息,包括自定义元素的扩展和重构,请参看这里

Chrome 54 还包括了大量安全方面的问题修复。尽管谷歌没有透露太多关于这些问题的细节,Richard Bustamante 在稳定通道更新里还是列出了总共21 个安全问题修复,包括6 个“高”安全级别问题。其中一个是URL 欺骗漏洞相关问题,有一个是全局XSS 问题(CVE-2016-5181),还有一个Blink 引擎的堆溢出问题(CVE-2016-5182)。谷歌的PDF 软件包PDFium 有三个高级别的问题修复。

从谷歌公布的 Chrome 54 已移除和不再推荐使用的 API 列表来看,最新版本的 Chrome 不允许跨域访问 window.onunload 事件处理器,为的是让 Chrome 和 HTML 规范保持一致。HTTP/0.9 不再被推荐使用(开发者应该转向 HTTP/2),initTouchEvent 被移除。

Chrome 55 计划在今年 11 月发布。

查看英文原文: Chrome 54 Kills YouTube Flash Embeds


感谢冬雨对本文的审校。

给InfoQ 中文站投稿或者参与内容翻译工作,请邮件至 editors@cn.infoq.com 。也欢迎大家通过新浪微博( @InfoQ @丁晓昀),微信(微信号: InfoQChina )关注我们。

2016-10-19 19:003300
用户头像

发布了 322 篇内容, 共 147.1 次阅读, 收获喜欢 148 次。

关注

评论

发布
暂无评论
发现更多内容

HTTPS的安全性从何而来?

产品训练营第四周作业

朱航

产品经理训练营第0期-第四次作业

孙行者

第0期 第四周作业 极客大学产品经理训练营

产品经理训练营第四次作业

Jobs

产品经理训练营--第四周学习总结

月亮 😝

第四周

Jove

计算机中的流水线技术到底是个啥?

冰河

程序员 进阶 计算机 流水线技术

20210209—生活记录

VC

二月春节不断更

微信朋友圈发动态用例及流程图(学习模拟):

🙈🙈🙈

极客大学产品经理训练营

用例文档练习

王一凡

产品经理

第4周作业_贷款申请用例

园子

互联网金融 小额贷款 去中心化金融借贷系统开发

产品训练营 - 作业 4

简小一

第四章作业-用例

Wangyunnfei

业务流程与产品文档

王一凡

产品经理训练营

产品经理第四周作业

朱琴

面试官系列:讲讲快速失败和安全失败的区别?

后台技术汇

面试 2月春节不断更

云计算自动化对于虚拟化环境意味着什么?

云计算

产品经理训练营-作业四

胡小湖

如何检验人生的假设

熊斌

个人提升 2月春节不断更

「产品经理训练营」作业 04

🌟

产品经理 产品经理训练营 产品经理训练

用例--学生智慧课堂扫码加入课堂

赝品

干个副业开个小店的简单分析

boshi

创业 副业赚钱 七日更

第四周作业

墨狂之逸才

作业4

YING꯭YING

数据结构与算法 - 排序1.冒泡排序

小马哥

Java 排序算法 数据结构与算法

【LeetCode】K 个不同整数的子数组题解

Albert

算法 LeetCode 2月春节不断更

极客时间购买课程用例

Geek_a32093

/(ㄒoㄒ)/~~晚了

Nydia

前端工程师必须知道的用javaScript刷新当前页面的3种方法

孙叫兽

JavaScript 大前端 刷新

第四周总结

Jove

架构11周

FreeOcean

不可用原因

Chrome 54终结YouTube的Flash内嵌技术_JavaScript_James Chesters_InfoQ精选文章