{"id":38887,"date":"2023-03-28T14:41:31","date_gmt":"2023-03-28T18:41:31","guid":{"rendered":"https:\/\/mjtsai.com\/blog\/?p=38887"},"modified":"2023-04-03T11:33:19","modified_gmt":"2023-04-03T15:33:19","slug":"safari-16-4","status":"publish","type":"post","link":"https:\/\/mjtsai.com\/blog\/2023\/03\/28\/safari-16-4\/","title":{"rendered":"Safari 16.4"},"content":{"rendered":"<p><a href=\"https:\/\/webkit.org\/blog\/13966\/webkit-features-in-safari-16-4\/\">WebKit<\/a>:<\/p>\n<blockquote cite=\"https:\/\/webkit.org\/blog\/13966\/webkit-features-in-safari-16-4\/\"><p>This release is packed with 135 new web features and over 280 polish updates.<\/p><p>[&#8230;]<\/p><p>Deeply integrated with iOS and iPadOS, Web Push notifications from web apps work exactly like notifications from other apps.<\/p><p>[&#8230;]<\/p><p>WebKit on iOS and iPadOS 16.4 adds support for the <a href=\"https:\/\/developer.mozilla.org\/docs\/Web\/API\/Badging_API\">Badging API<\/a>. It allows web app developers to display an app badge count just like any other app on iOS or iPadOS.<\/p><p>[&#8230;]<\/p><p>Safari 16.4 adds support Declarative Shadow DOM, allowing developers to define <a href=\"https:\/\/developer.mozilla.org\/docs\/Web\/Web_Components\/Using_shadow_DOM\">shadow DOM<\/a> without the use of JavaScript. And it adds support for <a href=\"https:\/\/developer.mozilla.org\/docs\/Web\/API\/ElementInternals\"><code>ElementInternals<\/code><\/a>, providing the basis for improved accessibility for web components, while enabling custom elements to participate in forms alongside built-in form elements.<\/p><p>[&#8230;]<\/p><p>Safari 16.4 adds support for quite a few new CSS properties, values, pseudo-classes and syntaxes.<\/p><p>[&#8230;]<\/p><p>Safari 16.4 now supports <a href=\"https:\/\/developer.mozilla.org\/docs\/Web\/Performance\/Lazy_loading\">lazy loading<\/a> iframes with <code>loading=\"lazy\"<\/code>.<\/p><\/blockquote>\n\n<p><a href=\"https:\/\/front-end.social\/@jensimmons\/110096732637221761\">Jen Simmons<\/a>:<\/p>\n<blockquote cite=\"https:\/\/front-end.social\/@jensimmons\/110096732637221761\"><p>It&rsquo;s hard to express just how massive a release Safari 16.4 is for web developers.<\/p><p>Last night, I was reading replies web developers posted on Twitter back in 2021, when I asked what developers need most from WebKit &mdash; and the vast majority of things you asked for have now shipped.<\/p><\/blockquote>\n\n<p>Now how about <a href=\"https:\/\/mastodon.social\/@davewoodx\/110096534763335228\">fixing<\/a> <a href=\"https:\/\/mjtsai.com\/blog\/2021\/11\/22\/safari-forgets-your-history\/\">the history<\/a> and <a href=\"https:\/\/mjtsai.com\/blog\/2023\/03\/15\/printing-lazy-web-images\/\">printing<\/a>?<\/p>\n\n<p><a href=\"https:\/\/www.macstories.net\/news\/ios-16-4-overview-emoji-notifications-web-shortcuts\/\">Federico Viticci<\/a> (<a href=\"https:\/\/mastodon.macstories.net\/@viticci\/110096352485224519\">Mastodon<\/a>):<\/p>\n<blockquote cite=\"https:\/\/www.macstories.net\/news\/ios-16-4-overview-emoji-notifications-web-shortcuts\/\"><p>I was able to test notifications for web apps added to the Home Screen using <a href=\"https:\/\/alerty.dev\/\">Alerty.dev<\/a>, a web service I recently discovered whose sole purpose is to let users program their own notifications to deliver via an <a href=\"https:\/\/pfista.notion.site\/Alerty-API-Documentation-879a830803dd4521a857870891cd7b52\">API<\/a> to all their devices. Alerty is similar to <a href=\"https:\/\/www.pushcut.io\/\">Pushcut<\/a> and <a href=\"https:\/\/pushover.net\/\">Pushover<\/a>, but instead of requiring a native app to be installed on the user&rsquo;s device, it can just deliver real-time push notifications via a web browser (on desktop) or a web app on the Home Screen in iOS and iPadOS 16.4. This was a perfect opportunity to sign up for the service and try it out with some of my shortcuts.<\/p><\/blockquote>\n\n<p>Previously:<\/p>\n<ul>\n<li><a href=\"https:\/\/mjtsai.com\/blog\/2023\/03\/27\/ios-16-4-and-ipados-16-4\/\">iOS 16.4 and iPadOS 16.4<\/a><\/li>\n<li><a href=\"https:\/\/mjtsai.com\/blog\/2023\/03\/27\/macos-13-3\/\">macOS 13.3<\/a><\/li>\n<li><a href=\"https:\/\/mjtsai.com\/blog\/2023\/03\/15\/printing-lazy-web-images\/\">Printing Lazy Web Images<\/a><\/li>\n<li><a href=\"https:\/\/mjtsai.com\/blog\/2023\/02\/21\/web-push-for-web-apps-on-ios-and-ipados\/\">Web Push for Web Apps on iOS and iPadOS<\/a><\/li>\n<li><a href=\"https:\/\/mjtsai.com\/blog\/2021\/11\/22\/safari-forgets-your-history\/\">Safari Forgets Your History<\/a><\/li>\n<li><a href=\"https:\/\/mjtsai.com\/blog\/2021\/07\/27\/safari-frustrations\/\">Safari Frustrations<\/a><\/li>\n<\/ul>\n\n<p id=\"safari-16-4-update-2023-03-29\">Update (2023-03-29): See also: <a href=\"https:\/\/news.ycombinator.com\/item?id=35329961\">Hacker News<\/a>.<\/p>\n\n<p><a href=\"https:\/\/twitter.com\/gingerbeardman\/status\/1640754668484657164\">Matt Sephton<\/a>:<\/p>\n<blockquote cite=\"https:\/\/twitter.com\/gingerbeardman\/status\/1640754668484657164\"><p>Safari 16.4 has some breaking changes (fixes?) to CSS, which means the <a href=\"https:\/\/github.com\/uetchy\/Polyglot\">Polyglot Safari Extension<\/a> by \n@uechz\n that I use every day no longer displays its popup.<\/p><p>But I created a <a href=\"https:\/\/github.com\/uetchy\/Polyglot\/issues\/128#issuecomment-1487229870\">quick-fix workaround<\/a> with a User Stylesheets!<\/p><\/blockquote>\n\n<p id=\"safari-16-4-update-2023-04-03\">Update (2023-04-03): <a href=\"https:\/\/www.construct.net\/en\/blogs\/ashleys-blog-2\/safari-releases-development-1616\">Ashley<\/a> (via <a href=\"https:\/\/news.ycombinator.com\/item?id=35421554\">Hacker News<\/a>):<\/p>\n<blockquote cite=\"https:\/\/www.construct.net\/en\/blogs\/ashleys-blog-2\/safari-releases-development-1616\">\n<p>Safari 16.4 rolled out last week, and for us it's been a nightmare. We make the browser-based game creation app Construct. Early versions of Safari 16.4 broke opening projects, previewing projects, and all existing content published with Construct, all in different ways. I wanted to share our experience so customers, developers, regulators, and Apple themselves can see what we go through with what is supposed to be a routine Safari release.<\/p>\n<\/blockquote>\n\n<p><a href=\"https:\/\/news.ycombinator.com\/item?id=35422381\">macguillicuddy<\/a>:<\/p>\n<blockquote cite=\"https:\/\/news.ycombinator.com\/item?id=35422381\"><p>We encountered a relatively major regression during the iOS 16.4 beta which unfortunately went live with the release version of 16.4. Requesting an &lsquo;environment-facing&rsquo; camera using getUserMedia now provides the ultra-wide camera (rather than the usual standard angle lens).<\/p><\/blockquote>","protected":false},"excerpt":{"rendered":"<p>WebKit: This release is packed with 135 new web features and over 280 polish updates.[&#8230;]Deeply integrated with iOS and iPadOS, Web Push notifications from web apps work exactly like notifications from other apps.[&#8230;]WebKit on iOS and iPadOS 16.4 adds support for the Badging API. It allows web app developers to display an app badge count [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"apple_news_api_created_at":"2023-03-28T18:41:33Z","apple_news_api_id":"ad611966-69fd-42ab-8504-c501d9580968","apple_news_api_modified_at":"2023-04-03T15:33:22Z","apple_news_api_revision":"AAAAAAAAAAAAAAAAAAAAAQ==","apple_news_api_share_url":"https:\/\/apple.news\/ArWEZZmn9QquFBMUB2VgJaA","apple_news_coverimage":0,"apple_news_coverimage_caption":"","apple_news_is_hidden":false,"apple_news_is_paid":false,"apple_news_is_preview":false,"apple_news_is_sponsored":false,"apple_news_maturity_rating":"","apple_news_metadata":"\"\"","apple_news_pullquote":"","apple_news_pullquote_position":"","apple_news_slug":"","apple_news_sections":"\"\"","apple_news_suppress_video_url":false,"apple_news_use_image_component":false,"footnotes":""},"categories":[2],"tags":[338,31,2185,30,2223,1074,103,328],"class_list":["post-38887","post","type-post","status-publish","format-standard","hentry","category-technology","tag-css","tag-ios","tag-ios-16","tag-mac","tag-macos-13-ventura","tag-push-notifications","tag-safari","tag-webkit"],"apple_news_notices":[],"_links":{"self":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/38887","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/comments?post=38887"}],"version-history":[{"count":3,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/38887\/revisions"}],"predecessor-version":[{"id":38933,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/38887\/revisions\/38933"}],"wp:attachment":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/media?parent=38887"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/categories?post=38887"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/tags?post=38887"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}