博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Google Chrome 53 Beta引入影子(Shadow)DOM V1
阅读量:7249 次
发布时间:2019-06-29

本文共 1355 字,大约阅读时间需要 4 分钟。

Google Chrome 53 Beta引入影子(Shadow)DOM V1,以及支付请求(PaymentRequest)API。

\\

与之前影子DOM V0明显不同,V1弃用了影子DOM对多个根节点的支持,并增加了阻止外界访问内部的根节点关闭功能。

\\

在的博客中,Hayato Ito强调,虽然HTML、CSS、JavaScript非常有用也很强大,但是很难对大代码量进行维护。

\\

Ito表示,V1“能让元素封装自己的样式且子DOM不受外界DOM的影响。这提升了大代码量的可维护性”。同时Chrome仍将支持V0。

\\

在HackerNews关于Google Chrome 53 Beta的,用户borplk问到“影子DOM是否对React等有影响?如在提升性能等方面”。

\\

Google工程师Eric Bidelman到:

\\
\

很明显,影子DOM是一个浏览器内嵌的提升开发者效率的工具。

\\

在React中,你需要使用或支持模块化、增加CSS前缀的构建工具(如CSS Modules)。内联样式会将特性配置污染到全局,并且大量内联样式会让浏览器做超出必要的上下文切换(HTML解析器\u0026lt;-\u0026gt;CSS解析器)。注意,后者不太会成为真实应用的性能问题。

\\

在影子DOM中,你只需要写CSS。在“\u0026lt;style\u0026gt;”标签内使用简单的选择器或样式表,不需要其他工具,浏览器会自动将选择器的作用域神奇地控制在组件内部。影子根节点也阻止外部样式跨边界向内泄漏。在没有浏览器支持的情况下这点很难做到。

\
\\

在32 Beta版本中也引入了新的支付请求(Payment Request)API,Ito表示这个功能可以快速且安全地使用信用卡及Android Pay进行支付,用户不用输入就能提供账单地址、送货详情以及付款人信息。

\\

这个API在W3C工作草案中有:

\\
\

随着用户发起支付流程(如在交互式游戏中点击“能力提升”,在停车场中使用自动付费机或点击“购买”、“结账”按钮),网页会创建一个支付请求进行支付。在确认或拒绝支付前,用户需要输入信息,此时支付请求允许网页与用户代理间进行交互来获得信息。

\
\\

Google提供了一个演示。

\\

几乎隐藏在诸多53 Beta的小改进中的还有初次试验的。在页面使用navigator.bluetooth.requestDevice来请求访问附近的设备时,网页蓝牙API会提示用户选择设备。

\\

Chrome 53 Beta中一些弃用的功能有:

\\
\
  • 弃用HTTP/0.9,使用支持响应报文头的来取代。 \\
  • 已在的TLS Diffie-Hellman加密。 \\
  • TextEncoder API不再接受参数,并始终使用utf-8进行编码。 \\
  • Chrome不再信任没有证书透明度(Certificate Transparency)信息的Symantec及链向Symantec的CA所发布的新证书。\
\\

查看英文原文:

\\

感谢对本文的审校。

\

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

转载地址:http://ohhbm.baihongyu.com/

你可能感兴趣的文章
大神 Linus Torvalds 语录
查看>>
[LintCode/LeetCode] Find Median From / Data Stream Median
查看>>
Android开发套路收集整理与讨论
查看>>
代码规范的重要性,我已经放弃治疗
查看>>
笨办法学C 练习30:自动化测试
查看>>
mui初级入门教程(五)— 聊聊即时通讯(IM),基于环信 web im SDK
查看>>
[vs2008]Visual Studio 2008 SP1添加或删除功能提示查找SQLSysClrTypes.msi文件
查看>>
JS 设计模式二(封装)
查看>>
JavaScript “跑马灯”抽奖活动代码解析与优化(一)
查看>>
为什么我们选择 segmentfault 写作?
查看>>
多模型融合推荐算法在达观数据的运用
查看>>
JDK 11 马上就要来了!JDK 12 还会远吗?
查看>>
Kali Linux 2019.1 发布,Metasploit 更新到 5.0 版本
查看>>
【mysql的设计与优化专题(1)】ER图,数据建模与数据字典
查看>>
Jibo’s Name: How did we pick it?
查看>>
device's media capture mechanism,利用input:file调用设备的照相机/相册、摄像机、录音机...
查看>>
BroadLink:三款新品力求无障碍人机交互,三大平台分三期对外开放 ...
查看>>
掌门1对1获3.5亿美元E-1轮融资,华人文化产业基金、中金甲子基金等投资 ...
查看>>
Unity中的通用对象池
查看>>
ORA-00600: internal error code, arguments: [16703], [1403], [28], [...
查看>>