Apple, Mozilla, Google, and Microsoft are working on a benchmark called Interop 2022. It aims to help make developing for the web easier by solving major compatibility issues.
It focuses on 15 areas identified by developers as “being particularly troublesome when they are missing or have compatibility issues across browsers.” All browser vendors will work on these areas. The pain points include:
- Cascade Layers
- Color Spaces and Functions
- Dialog Element
- Typography and Encodings
- Viewport Units
- Web Compat
Interop 2022 will investigate three areas: editing, contentEditable, and execCommand; pointer and mouse events; and viewport measurement. The test dashboard found here measures how each browser performs on the various benchmarks. For example, in the stable versions of the browsers, Chrome and Edge scored 61, Firefox scored 69, and Safari scored 50. These are out of 100.
Writing for Apple, Jen Simmons explained some of the focus areas. Cascade Layers provides a way to organize styles into layers in CSS. For Color Spaces and functions, Interop can test browser support for three color spaces, LAB, LCH, and P3, and two writes to write color in CSS through functional notation. Display P3 was created by Apple and its device displays support this space, which is approximately 50% wider than sRGB.
Container queries is the most requested addition to the web from developers. It’s a tool in CSS to identify and measure the size of a specific container and conditionally apply styles based on the size.
Ultimately, “the goal is to make the web platform more usable and reliable for developers, so that they can spend more time building great web experiences instead of working around browser inconsistencies.”