有史以来，所有主要浏览器供应商和其他利益相关方首次携手解决 Web 开发者发现的主要浏览器兼容性问题。Interop 2022 将在 15 个关键领域改善 Web 开发体验。在本文中，您可以了解我们是如何取得现在的、该项目的重点、如何衡量成功以及如何跟踪进度。
一切都始于 2019 年
早在 2019 年，Mozilla、Google 和其他公司开展了大量工作，通过开展 MDN 开发者需求评估调查问卷和深入研究的浏览器兼容性报告的形式来了解开发者的痛点。这些报告为我们提供详尽且切实可行的信息，以应对 Web 平台开发者面临的主要挑战，并促成了 2021 年兼容性计划工作。
除此之外，Compat 2021 为 CSS 网格（使用率为 12%，稳步增长）和 CSS flexbox（使用率为 77%）等强大功能奠定了坚实基础，其中包括 Flexbox 中的 gap 属性，解决了开发者在采用新布局方法时面临的首要痛点。
我们很高兴到 2021 年底，所有实现的得分都超过了 90%！
什么是 Interop 2022？
Interop 2022 是一项基准，获得三大浏览器实现的代表的同意，并通过公开提名和审核流程开发，并参考了支持者 Apple、Bocoup、Google、Igalia、Microsoft 和 Mozilla 的意见。
该基准测试关注了 15 个方面，开发者认为当这些方面缺失或在不同浏览器中存在兼容性问题时，这些方面尤为棘手。所有浏览器供应商都已同意专注于这些领域，大家都很高兴能开始着手改善 Web 应用开发体验。
15 个重点关注领域
以下功能将是 Interop 2022 的重点。其中包括 10 个新区域，外加从 Compat 2021 沿用的 5 个区域。新的关注领域包括：
级联层
级联层可让 Web 开发者更好地控制级联。它们提供了一种将选择器划分为层的方法，每个层都有自己的特异性。这意味着，您无需谨慎地为选择器排序，也无需创建高度具体的选择器即可覆盖基本 CSS 规则。
颜色空间和 CSS 颜色函数
如需在设计系统中使用颜色函数，您目前需要对 HSL 值依赖于 Sass、PostCSS 或 calc()。CSS 内置的颜色函数意味着颜色可以动态更新，并且新的颜色空间消除了对 sRGB 色域的限制，以及 HSL 的感知限制。
在 CSS 颜色级别 5 中定义的两个函数可在网络平台上实现更动态的主题：
color-mix()：接受两种颜色，并返回指定颜色空间中按指定量混合这两种颜色的结果。color-contrast()：从颜色列表选择与指定的单色具有最高对比度的颜色。
这些函数支持扩展的颜色空间（LAB、LCH 和 P3），除了 HSL 和 sRGB，它们还默认为统一 LCH 颜色空间。
新视口单元
2020 年 MDN 浏览器兼容性报告和全新 2021 年 CSS 现状调查问卷中凸显了处理视口大小调整难题。CSS 值和单位级别 4 针对最大、最小和动态视口尺寸添加了新的单位：lv*、sv* 和 dv*。这些广告单元可让您更轻松地创建占据移动设备可见视口的布局，同时将地址栏考虑在内。
此外，Interface 2022 背后的跨供应商团队将展开合作，共同研究和改进现有视口衡量功能（包括现有 vh 单元）的互操作性状态。
滚动
2021 年滚动式问卷调查报告证实，滚动功能和滚动兼容性难以实现，且有诸多改进空间。我们将重点介绍滚动贴靠、滚动行为和滚动行为，帮助开发者在各种平台上更加一致、顺畅地滚动。
我们还在探索新的滚动贴靠功能提案。
子网格
grid-template-columns 和 grid-template-rows 的 subgrid 值意味着，应用了 display: grid 的网格项可以从其所在的父网格部分继承轨迹定义。
例如，尽管每张卡片都有独立的网格，但以下 3 个卡片组件的页眉和页脚与相邻卡片的页眉和页脚对齐。这种模式之所以可行，是因为每张卡片都是跨越父网格三行的项，然后使用 subgrid 将这些行继承到卡片中。
还包含
- CSS Containment（
contain属性） <dialog>元素- 表单控件
- 排版和编码：包括
font-variant-alternates、font-variant-position、ic单元和 CJK 文本编码 - Web 兼容性，侧重于导致网站兼容性问题影响最终用户的浏览器之间的差异
通过 Compat 2021 项目，以下领域取得了很大的进步，但仍有改进的空间。因此，我们已将它们包含在 Interop 2022 中，以便解决其余问题。
- 宽高比
- Flexbox
- 网格
- 粘性定位
- 变形
调查工作
除了 15 个重点领域之外， Interop 2022 还包括三项调查工作。下面这些方面存在问题且需要改进，但规范或测试的当前状态还不足以借助测试结果对进度进行评分：
- 正在编辑，
contenteditable和execCommand - 指针和鼠标事件
- 视口衡量
浏览器供应商和其他相关方将协同合作，完善这些领域的测试和规范，以便将来纳入这项工作的后续版本中。
衡量成效并跟踪进度
系统将使用现有的 web-platform-tests 信息中心跟踪 15 个重点领域的进度。对于每个方面，我们确定了一组测试。然后，浏览器会根据这些测试打分，给出每个方面的得分以及全部 15 个方面的总分。
如需了解并跟踪进度，请查看 Interop 2022 信息中心。在这一年里，您可以跟随我们的脚步，了解您用来构建应用的平台是如何改进的。
这对开发者有什么影响？
这些多年来的互操作性工作，具体形式包括 Compat 2021、 Interop 2022 等，旨在完全承认并解决开发者多年来遇到的痛点。而且，这并不是单一的浏览器工作，而是所有主流浏览器供应商和朋友们为了全面改进网络平台而开展的强有力的合作。
实质上，我们的目标是使网络平台对开发者来说更易用、更可靠，以便他们可以将更多时间用于打造出色的网络体验，而不是解决浏览器不一致问题。
请与我们分享您的想法
如果您对 Compat 2021 期间的改进或 Interop 2022 中包含的任何功能有任何反馈，欢迎向我们提供反馈。以下哪项功能可为您的工作带来最大成效？你对什么感到激动？提交 GitHub 代码库问题或在 Twitter 上告知我们。
以下资源详细了解 Interop 2022：