{"id":36185,"date":"2022-06-10T17:02:15","date_gmt":"2022-06-10T21:02:15","guid":{"rendered":"https:\/\/mjtsai.com\/blog\/?p=36185"},"modified":"2022-06-10T17:02:15","modified_gmt":"2022-06-10T21:02:15","slug":"safari-16-announced","status":"publish","type":"post","link":"https:\/\/mjtsai.com\/blog\/2022\/06\/10\/safari-16-announced\/","title":{"rendered":"Safari 16 Announced"},"content":{"rendered":"<p><a href=\"https:\/\/developer.apple.com\/videos\/play\/wwdc2022\/10048\/\">What&rsquo;s new in Safari and WebKit<\/a> (<a href=\"https:\/\/news.ycombinator.com\/item?id=31662490\">Hacker News<\/a>):<\/p>\n<blockquote cite=\"https:\/\/developer.apple.com\/videos\/play\/wwdc2022\/10048\/\">\n<p>Explore the latest features in Safari and WebKit and learn how you can make better and more powerful websites. We&rsquo;ll take you on a tour through the latest updates to HTML, CSS enhancements, Web Inspector tooling, Web APIs, and more.<\/p>\n<\/blockquote>\n\n<p><a href=\"https:\/\/webkit.org\/blog\/12824\/news-from-wwdc-webkit-features-in-safari-16-beta\/\">Jen Simmons<\/a> (<a href=\"https:\/\/news.ycombinator.com\/item?id=31644622\">Hacker News<\/a>):<\/p>\n<blockquote cite=\"https:\/\/webkit.org\/blog\/12824\/news-from-wwdc-webkit-features-in-safari-16-beta\/\">\n<p>Safari 16 brings support for Web Inspector Extensions, so you can enhance Safari&rsquo;s built-in browser developer tools. This can be especially helpful when using powerful third-party frameworks and services &mdash; perhaps your team uses React, Angular, Vue, or Ember; or maybe a popular test suite or another developer service.<\/p>\n<p>[&#8230;]<\/p>\n<p>After years of collaboration by engineers working on various browsers to figure out whether or not they would even be possible, <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/CSS\/CSS_Container_Queries\">Container Queries<\/a> are finally here. Similar to Media Queries, Container Queries allow you to adjust the layout or styling of a particular item on your web page based on the size of its container rather than the size of the viewport. They&rsquo;ll be an invaluable tool for creating reusable components in a design system.<\/p>\n<p>[&#8230;]<\/p>\n<p>Web Push is coming to Safari 16 on macOS Ventura. This lets you remotely send notifications to users of your websites and web apps &mdash; and deliver those notifications even when Safari isn&rsquo;t running.<\/p>\n<p>[&#8230;]<\/p>\n<p><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/CSS\/CSS_Grid_Layout\/Subgrid\">Subgrid<\/a> takes Grid to another level, providing an easy way to put grandchildren of a grid container on that grid. It makes it possible to line up items across complex layouts without being constrained by the HTML structure.<\/p>\n<\/blockquote>\n\n<p>Previously:<\/p>\n<ul>\n<li><a href=\"https:\/\/mjtsai.com\/blog\/2021\/06\/17\/safari-15\/\">Safari 15 Announced<\/a><\/li>\n<\/ul>","protected":false},"excerpt":{"rendered":"<p>What&rsquo;s new in Safari and WebKit (Hacker News): Explore the latest features in Safari and WebKit and learn how you can make better and more powerful websites. We&rsquo;ll take you on a tour through the latest updates to HTML, CSS enhancements, Web Inspector tooling, Web APIs, and more. Jen Simmons (Hacker News): Safari 16 brings [&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":"2022-06-10T21:02:19Z","apple_news_api_id":"e614adb8-3b82-4ebc-be18-d9c7e2c7fedc","apple_news_api_modified_at":"2022-06-10T21:02:19Z","apple_news_api_revision":"AAAAAAAAAAD\/\/\/\/\/\/\/\/\/\/w==","apple_news_api_share_url":"https:\/\/apple.news\/A5hStuDuCTry-GNnH4sf-3A","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,103,328],"class_list":["post-36185","post","type-post","status-publish","format-standard","hentry","category-technology","tag-css","tag-ios","tag-ios-16","tag-mac","tag-macos-13-ventura","tag-safari","tag-webkit"],"apple_news_notices":[],"_links":{"self":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/36185","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=36185"}],"version-history":[{"count":1,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/36185\/revisions"}],"predecessor-version":[{"id":36186,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/posts\/36185\/revisions\/36186"}],"wp:attachment":[{"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/media?parent=36185"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/categories?post=36185"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mjtsai.com\/blog\/wp-json\/wp\/v2\/tags?post=36185"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}