Chrome团队：2020年了，浏览器兼容性还是一个大问题

Posted 2021-03-30 OSC开源社区

根据 2019 年 Web 开发人员需求评估（Web Developer Needs Assessment，DNA）调查，来自世界各地的 28,000 多名开发者所反馈的最大需求是浏览器兼容性问题——网站在不同网络浏览器上的外观或行为方式不同，这给开发人员带来不少痛苦。

因此，MDN 在 2020 年 3 月进行了一项针对浏览器兼容性的后续调查。这次调查揭示了 Web 开发人员在浏览器兼容性方面遇到的痛点。Chrome 团队通过一篇博客文章将其分享出来，并谈论了 Chrome 本身在这些问题上所做的努力。

Flexbox

Flexbox 是用于网络布局的工具，它提供了一种符合人机工程学的方式来定义可以在不同大小的视口上正常响应的布局。但是，如果不能在所有浏览器中都使用此功能 ，它的体验就不是很好。

Chrome 团队表示，Flexbox 是他们今年实现浏览器兼容性的首要任务之一，并已经在其中投入了大量资金。

具体来说，Chrome 渲染团队在现代 LayoutNG 布局引擎的基础上，对 Chromium flexbox 实现的架构进行了重新设计。这项工作预计会在 Chrome 84 中引入，它有望解决 Chromium 中的许多 Flexbox 兼容性问题。

他们也正致力于在今年内为 Chromium 提供 flex-gap 和 fieldset+flex 支持。flex-gap 也将在 Chrome 84 中可用。

Scrolling（滚动）

在多个浏览器上正确滚动不是一件易事（例如，需要整个库来一致地锁定正文滚动）。Chrome 团队仍在研究有关滚动兼容性的反馈，目前为止，有几个关键领域很突出：

• 虚拟键盘如何影响（或不影响）不同浏览器中的视口单元。（Chrome 团队温馨提示：Microsoft Edge 在 VirtualKeyboard API 上的最新工作可能对此有所帮助。）

• 与输入相关的事件以及与之交互的结果缺乏一致性。

• 难以控制跨浏览器的滚动行为（例如，通过滚动锚定）。

表单控件

表单是 Web 中一个非常古老的部分，甚至早于 CSS。表单控件旨在模仿本机平台的外观，但它们未能始终如一地做到这一点，也未能满足现代 Web 开发的需求。兼容性调查在这方面揭示了两个主要问题：跨浏览器中的风格和行为不一致。

在样式表单控件方面，Microsoft Edge 和 Google Chrome 团队最近完成了这一项目，更新了基于 Chromium 的浏览器中的默认表单样式。

就行为而言，人们似乎普遍担心表单控件的行为未得到很好的指定，或者浏览器未始终遵循这些规范。一些具体示例是，当在包含表单的页面之间来回导航时，它们支持某些 <input> 类型、自动填充行为和内容恢复行为。

CSS Grid

像 Flexbox 一样，CSS Grid 是现代布局的重要组成部分。调查结果显示，似乎 Chromium 中对 CSS Grid 的支持还不错。但有一项例外——Chromium 仍然不支持 subgrid。

Chrome 团队透露，Microsoft Edge 的一个团队正在重新构造 Chromium 的 Grid 支持，以使用新的 LayoutNG 引擎。作为此计划的一部分，Chrome 也打算添加对 subgrid 的支持。

最后，Chrome 团队指出，当涉及到浏览器兼容性时，仍然有太多缺少的功能和边缘错误。如果浏览器供应商可以理解到这些造成麻烦的原因，并采取措施解决问题，一切将会变得更好。在接下来的时间里，Chrome 也将变得更加兼容。

推荐阅读