DNA調(diào)查來自世界各地的28,000多名開發(fā)者所反饋的最大需求是瀏覽器兼容性問題

根據(jù) 2019 年 Web 開發(fā)人員需求評估(Web Developer Needs Assessment，DNA)調(diào)查，來自世界各地的 28,000 多名開發(fā)者所反饋的最大需求是瀏覽器兼容性問題——網(wǎng)站在不同網(wǎng)絡瀏覽器上的外觀或行為方式不同，這給開發(fā)人員帶來不少痛苦。

因此，MDN 在 2020 年 3 月進行了一項針對瀏覽器兼容性的后續(xù)調(diào)查。這次調(diào)查揭示了 Web 開發(fā)人員在瀏覽器兼容性方面遇到的痛點。Chrome 團隊通過一篇博客文章將其分享出來，并談論了 Chrome 本身在這些問題上所做的努力。

Flexbox

Flexbox 是用于網(wǎng)絡布局的工具，它提供了一種符合人機工程學的方式來定義可以在不同大小的視口上正常響應的布局。但是，如果不能在所有瀏覽器中都使用此功能 ，它的體驗就不是很好。

Chrome 團隊表示，F(xiàn)lexbox 是他們今年實現(xiàn)瀏覽器兼容性的首要任務之一，并已經(jīng)在其中投入了大量資金。

具體來說，Chrome 渲染團隊在現(xiàn)代 LayoutNG 布局引擎的基礎上，對 Chromium flexbox 實現(xiàn)的架構進行了重新設計。這項工作預計會在 Chrome 84 中引入，它有望解決 Chromium 中的許多 Flexbox 兼容性問題。

他們也正致力于在今年內(nèi)為 Chromium 提供 flex-gap 和 fieldset+flex 支持。flex-gap 也將在 Chrome 84 中可用。

Scrolling(滾動)

在多個瀏覽器上正確滾動不是一件易事(例如，需要整個庫來一致地鎖定正文滾動)。Chrome 團隊仍在研究有關滾動兼容性的反饋，目前為止，有幾個關鍵領域很突出：

虛擬鍵盤如何影響(或不影響)不同瀏覽器中的視口單元。(Chrome 團隊溫馨提示：Microsoft Edge 在 VirtualKeyboard API 上的最新工作可能對此有所幫助。)

與輸入相關的事件以及與之交互的結果缺乏一致性。

難以控制跨瀏覽器的滾動行為(例如，通過滾動錨定)。

表單控件

表單是 Web 中一個非常古老的部分，甚至早于 CSS。表單控件旨在模仿本機平臺的外觀，但它們未能始終如一地做到這一點，也未能滿足現(xiàn)代 Web 開發(fā)的需求。兼容性調(diào)查在這方面揭示了兩個主要問題：跨瀏覽器中的風格和行為不一致。

在樣式表單控件方面，Microsoft Edge 和 Google Chrome 團隊最近完成了這一項目，更新了基于 Chromium 的瀏覽器中的默認表單樣式。

就行為而言，人們似乎普遍擔心表單控件的行為未得到很好的指定，或者瀏覽器未始終遵循這些規(guī)范。一些具體示例是，當在包含表單的頁面之間來回導航時，它們支持某些類型、自動填充行為和內(nèi)容恢復行為。

CSS Grid

像 Flexbox 一樣，CSS Grid 是現(xiàn)代布局的重要組成部分。調(diào)查結果顯示，似乎 Chromium 中對 CSS Grid 的支持還不錯。但有一項例外——Chromium 仍然不支持 subgrid。

Chrome 團隊透露，Microsoft Edge 的一個團隊正在重新構造 Chromium 的 Grid 支持，以使用新的 LayoutNG 引擎。作為此計劃的一部分，Chrome 也打算添加對 subgrid 的支持。

最后，Chrome 團隊指出，當涉及到瀏覽器兼容性時，仍然有太多缺少的功能和邊緣錯誤。如果瀏覽器供應商可以理解到這些造成麻煩的原因，并采取措施解決問題，一切將會變得更好。在接下來的時間里，Chrome 也將變得更加兼容。