剛剛結束的蘋果 WWDC2022 上，除了最新 iOS 16 Beta 版系統，WebKit 官方也宣佈將推出 Safari 16 beta 版的主要 Web 技術。目前，Apple Developer program 成員已經可以通過安裝 macOS Ventura、iOS/iPadOS 16 的開發者 Beta 版來測試 Safari 16。
WebKit 官宣 Safari 16 Beta 版中的 Web 新功能
太平洋時間 6 月 6 日，WebKit 官方部落格發文詳細介紹了此次 Safari 16 Beta 版中的 WebKit 新功能，具體內容如下：
- Web Inspector 擴充套件
全新 Safari 16 支援 Web Inspector 擴充套件，可以增強 Safari 的內建瀏覽器開發工具，特別是在使用功能強大的第三方框架和服務時尤其有用。通過使用 Safari Web Inspector 擴充套件，使用者可以從這些框架和服務中安裝開發者工具擴充套件，讓工作能夠更快、更輕鬆地進行開發。
Safari Web Inspector 擴充套件與其他瀏覽器中的開發者工具擴充套件使用相同的 JavaScript API，方便開發者工具擴充套件的建立者能輕鬆地將其移植到 Safari。同時，Web Inspector 擴充套件也加入了 Safari Web 擴充套件的其他改進，包括能夠同步 iOS、iPadOS 和 macOS 上啟用的擴充套件。
- 容器查詢（Container Queries）
與媒體查詢(Media Query)類似，容器查詢允許使用者根據容器的大小而非 viewport 的大小來調整網頁上特定專案的佈局或樣式。
Safari 16 支援 Size queries（大小查詢）和容器查詢單元。容器查詢單位類似於 viewport 單位，但它們指定了相對於查詢容器而非 viewport 的維度的長度。
- macOS 上的 Web Push 功能
macOS Ventura 上的 Safari 16 即將推出 Web Push 功能，可遠端向網站和 Web 應用程式的使用者傳送通知，通過推送 API 及通知 API，在 Safari 未執行時傳送這些通知。
Web Push-in Safari 使用相同的 Apple Push 通知服務，為所有 Mac 和 iOS 裝置提供本機推送功能。據悉，蘋果將在 2023 年為 iOS 和 iPadOS 系統提供 Web Push 功能。
- 次網格（Subgrid）
CSS Grid 的出現徹底改變了 Web 佈局設計的可能性，子網格將網格提升到了另一個層次，提供了一種將網格容器的子代放到該網格上的簡單方法。它可在不受 HTML 結構約束的情況下跨過複雜的佈局排列專案。Safari 的網格檢查器允許使用者為任意多個網格開啟覆蓋，這在編寫子網格時尤其有用。
- Flexbox Inspector
繼去年的 Grid Inspector 之後，Safari 16 新增了 Flexbox Inspector，它與 Safari 15.4 中新增的對齊編輯器（Alignment Editor ）完美匹配。
Flexbox 容器的覆蓋使 CSS 對 Flexbox 容器的影響更容易視覺化，新的覆蓋有助於從視覺上區分可用空間和間隙。它還顯示了專案的邊界，以及它們是如何分佈在 Flexbox 容器的主軸和橫軸上的。
- 可訪問性改進
Safari 16 在 macOS 上引入了 WebKit 可訪問性支援的重新架構，從而提高了效能和響應能力。
此更改允許 WebKit 在比以前更短的時間內處理來自客戶端（如 VoiceOver）的更多可訪問性請求。在一些複雜的網頁上，測量到在 25% 的時間內服務的可訪問性請求數是原來的兩倍。
- Animation Improvements（動畫改進）
CSS 偏移路徑（也稱為運動路徑）為 Web 開發人員提供了一種沿任意形狀的自定義路徑設定動畫的方法。通過“偏移路徑”（offset path）屬性，可定義要沿其設定動畫的幾何路徑。
“偏移定位”（offset anchor）、“偏移距離”（offset distance）、“偏移位置”（offset position）和“偏移旋轉”（offset rotate）屬性為使用者提供了其他功能，可以優化正在設定動畫的物件的精確移動。
目前，通過 Safari 16 使用者可設定 CSS 網格的動畫，也就是說可以對行或列的大小進行動畫更改，從而為頁面上的移動提供了全新的可能性。
Safari 16 還增加了對複合操作的支援，解決了元素動畫如何影響其基礎屬性值的問題，同時還為 39 個 CSS 屬性新增了對離散動畫的支援。
- Overscroll Behavior
CSS Overscroll 行為決定了當使用者滾動瀏覽器併到達滾動區域的邊界時會發生什麼，當使用者想要停止滾動連結時它就很有用，當使用者在框內滾動併到達末尾時，就可以控制停止或允許滾動頁面的其餘部分（控制瀏覽器過度滾動時的表現）。
- “共享程式設計師”（Shared Worker）
Safari 中更新了一種新型別的“工作人員” —— Shared Worker，Shared Worker 在後臺執行 JavaScript，只要使用者對您的域開啟了任何選項卡，您的共享工作執行緒就可以執行，並且對同一域開啟的所有選項卡都可以共享同一個共享工作執行緒。因此，如果您想要像開啟一個 WebSocket 連線到一個代表多個選項卡進行通訊的伺服器這樣的操作，請嘗試使用 Shared Worker。
- 其他
其他新功能還包括對錶單控制元件的修復和改進，以及對<表單>的支援。HTML 輸入元素的 requestSubmit（）和 showPicker（）方法，以及對 Shadow Realms 的支援和對 Worker src Content Security Policy 指令的支援。
WebKit 新功能引發開發者熱議
作為本次 WWDC2022 活動上的一大技術亮點，Safari 16 Beta 版中的 WebKit 新功能確實讓廣大開發者興奮不已。但是，與此同時在開發者社群 Reddit上，WebKit 的新功能卻引發了不少開發者的“吐槽”和熱議。
這裡，我們看到其中一篇題為“Web push notifications are coming to iOS in 2023”的帖子裡，（連結：https://www.reddit.com/r/prog...）就有不少開發者對這一點表達了自己的看法，大家感受下：
“Oh please, not so fast Apple. With this break neck speed we might even get the PWA install prompt before the end of the century.”（哦，拜託，別那麼快，蘋果。以這種驚人的速度，我們甚至可能在本世紀末之前得到PWA安裝提示。）
“we might even get the PWA install prompt before the end of the century.Hopefully never.”（我們甚至可能在本世紀末之前得到PWA安裝提示。
希望永遠不會。）
“How about stop forcing all browsers to be Safari on iOS first, yeah?”（不如先停止強制所有瀏覽器在 iOS 上使用 Safari，好嗎？）
“Do you mean forcing them to use the WebKit engine? There are other browsers for iOS but they currently all have to use WebKit.”（你的意思是強迫他們使用 WebKit 引擎嗎？還有其他 iOS 瀏覽器，但它們目前都必須使用 WebKit。）
“Oh yay, another pop up I have to say no to on literally every website from 2023 onwards.”（哦，耶，從 2023 年起，我必須對每個網站上的另一個彈出視窗說不。）
“So it just said ‘look for Web Push on iOS in 2023’
Honestly I am not too hopeful about this as I would imagine it would probably be locked behind layers of settings because Apple being Apple. I can't really see they would make it easy for people to escape the App Store ecosystem.
Too difficult for me to imagine Apple would actually allow IM apps that bypass their app store.”
......
據瞭解，近一年來 WebKit 瀏覽器共推出了 162 多項新功能和改進，包括 Safari 15.2、Safari 15.4 和 Safari 15.5。今年早些時候推出的功能包括 dialog 元素、lazy loading、Inactive、：has（）偽類、新視口單元、層疊層、焦點可見、強調色、外觀、彩色字型的字型調色盤、BroadcastChannel、Web Locks API、File System Access API、WebAssembly 的增強功能、對畫布中 Display-P3 的支援、對 COOP 和 COEP 的新增，以及在 Web Inspector 中改進了 CSS 自動完成和新的 CSS 變數工具等等。
此次更新的 Web 技術，主要是可以讓使用者在 Safari 16 上更方便的工作。然而，備受開發者吐槽的“Web push”功能以及疑似“強迫讓所有 iOS 上的瀏覽器都用 Safari”的操作，確實成為了不少使用者的煩惱。