New WebKit features in Safari 15.4

  • Now all major browsers support the <dialog> element without polyfill. Yay!

    https://developer.mozilla.org/en-US/docs/Web/HTML/Element/di...

  • Edit: removing the snark/sarcasm I put into it.

    I was really hoping this announcement would include support for push notifications for PWAs. I've been trying to build a few Discourse forums and they work very well as PWAs except for the fact that iOS doesn't support PWAs sending push notifications.

    So here's to hoping the next iteration will.

  • > added support for the <dialog> element

    Might as well get started on those uBlock filters!

        dialog[class*="newsletter" i]
        dialog[id*="newsletter" i]
        dialog[class*="social" i]
        dialog[id*="social" i]
        dialog[id*="mailchimp" i]

  • > New support for BroadcastChannel allows tabs, windows, iframes, and Workers from an origin to send messages to each other. This enables experiences like syncing login state for a site across multiple tabs.

    This is SUPER nice... there are other hacks like IndexedDB or localStorage but this is way better!

    But the frustrating part her is that we're excited about Webkit finally starting to catch up.

    Chrome is just perpetually innovating and then Webkit is constantly lagging.

    Supporting Safari is BY FAR the hardest part of my job.

  • I'm happy to contribute two new features as part of my WebKit internship: the ic unit (as mentioned in the changelog), and CSS Motion Path, which I'm honestly surprised is not mentioned.

  • Here I am still waiting for ES2018 regex look-behinds to be implemented. The folks working on the regex engine must have jumped ship or something.

  • With so many new features being added to browsers lately it is easy to forget, that not all browsers on old devices are updated, be it older iPad or even laptop with ChromeOS. Dear web developers, please don't forget to add fallbacks or polyfills for older devices.

  • Credit where credit is due: this is a rarely good release.

    Cynical me has observed this annual pattern where Apple just before their developer conference suddenly becomes "genuinely" interested in the web community and actively listens to feedback. Then, things get back to normal, which means they don't implement anything, all feedback goes to /dev/null, documentation is lacking and bugs are never solved.

    It's hard to get past this cynical angle because even in this release they're boasting about how they're "first" to implement something, whilst it remains to be the browser lagging years behind. Typical Apple, fluffy marketing with zero self-reflection.

    I did see there's lots of webkit vacancies at Apple now, so one can hope things are changing for the better. Probably because it looks better to regulators.

  • Is Apple going to do anything about Safari (on my 2021 16" M1 Pro) hitting 200 points in BrowserBench, while Chrome hits 299? Sure, Safari battery life is great, but the browser is slow, buggy (refreshes the page when I back a page half the time; can't speed up videos without audio distortion; typing into the search bar is laggy and I on a daily basis arrow down to select a previously used URL, hit enter, and then find that Safari moved my selection up or down, almost like it had to sync or something).

    I try really hard to love Safari, I really do, but it's just a shitshow outside of battery life.

    Also, Brave is consistently 20-30 points below vanilla Chrome on BrowserBench? Any ideas why?

    And finally, and this is pretty egregious, but the 1Password browser extension is a 20-30% (yes) performance hit (on the BrowserBench benchmark) on any Chromium based browser that I use, and on Firefox. What the fuck, AgileBits?

    See for yourself: https://browserbench.org/Speedometer2.0/

  • A lot of good (if long-awaited) changes in there, like smooth scrolling. Interesting to see how hard they're pushing the fact that they are the first browser to implement a bunch of features.

  • A nice/useful bulleted summary thread by Apple's Jen Simmons: https://twitter.com/jensimmons/status/1503454398487408640?s=...

  • Great to see Safari add lazy loading for images! I’ve been hoping for that one, I wasn’t aware it was in the works.

  • dang, still no SIMD for WebAssembly. Chrome and Firefox are meanwhile hitting 45gflops (85% of peak) on my M1 Air. Safari only gets to 12.5gflops

  • > Developers can now enable Navigation Preload in ServiceWorker to improve load performance and avoid ServiceWorker startup delays that block network requests

    Does that mean <link rel='preload'> finally works on Safari?

  • Safari 15.4 broke my web app. Impossible debug and workes fine in 15.3.x and any other browser. Awkward disappearing elements & zindex or canvas bug.

    Worst browser especially it is impossible to debug in windows.

  • Really looking forward to start using cascade layers. Hopefully it'll encourage the community to work closer to pure CSS and leave behind some of the madness out there like CSS-in-JS or Svelte's scoped styles.

  • > WebKit added support for lazy-loading images with the loading attribute on the <img> element, providing web developers with an easy way to instruct the browser to defer loading certain images until the user scrolls near them

    Maybe there's hope that I can then just turn this off on a browser level? I've got gigabit internet at home, and your images popping in on scroll makes it feel like I'm on dial up.

    Lazy loading images is at best user hostile bandwidth saving, and it's not even that much in this day and age.

  • Appreciate the work the WebKit team is doing, but would love to see more support for WKWebView devs. The WKPreference updates are nice, but such a small step. As a browser developer targeting iOS (where one is forced to use WKWebView), it is shocking how many hacks are required to build table stakes features on top of WKWebView. Of course, I can imagine the Safari team would have little motivation to help in this regard since it is about enabling competition.

  • Wohoo to :focus-visible support.

    The suffering is over!

  • It doesn’t look like the Push API made it

  • I was just in despair this last weekend when I discovered that vh decreases when the onscreen keyboard shows up and thus reflows my page where some elements have max-height: Xvh. I'm glad this is being addressed with lvh!

  • Woo, csp strict-dynamic. Safari was the last major browser not to support, and it makes csp so much easier to use.

  • > Apps on iOS, iPadOS, and macOS can now control allowing or preventing web content from using the Fullscreen API.

    Too bad Safari still does not offer this as a toggle on iPadOS. I really hate the fullscreen video players on my iPad. They are mostly unusable with touch. Maybe it can be controlled using an Extension?

  • Very excited about dialog being its own thing.

    There are of course a lot of nice built-in solutions to things, but having a quick-and-easy modal mechanism allows people to have cleaner code for something they're gonna try to do one way or another.

  • I immediately looked for haptic feedback support but alas it's not there. I get that it could be abused so I'd want it as an opt-in feature. It's really useful for soft keyboards (of all kinds).

  • Been waiting for this for so long. Especially the BroadcastChanel feature since there is currently no way for PWAs installed twice on the Home Screen to “share” data between them. Hope that BC fixes that

  • undefined

  • What's the best way to access newer features in Safari if one's work computer is locked to the previous version of macOS?

  • When will they support webp on macOS 10? I guess never?

  • Until Apple fixes the mess they made with ad-blocking and allows full-fat ublock origin to work on Safari again, it could be 100x better than any other browser and it would still be worthless compared to Firefox.

    Shame, because I really do like Safari.

  • Aaaand they introduced WebGL bugs that broke our product, and iPhone users will experience these bugs until we can hack a workaround in, or until Apple acknowledges a bug report (that I have to make a minimal test case for and report, and haven't narrowed down yet), patches the issue in Safari, and decides if it's important enough to release as a 15.4.1 (which they probably won't, which means I'm stuck finding a workaround) - or if it comes out in iOS 16, then a good chunk of our users will never get the fix - so I'm stuck finding a workaround, still.

    The bundling of Safari versions with iOS, combined with the draconian policy of "Safari is the only legal rendering engine on iOS", bites me every day as a developer that's working on a mobile site for iDevices.

  • undefined

  • undefined

  • undefined

  • Web MIDI? Still surprised that's missing on Apple.

  • It is scary how many basic features it didn't support before

  • Wake me when they finally fix the GPU acceleration bug breaking <canvas>

  • Finally Safari stops holding up the entire internet!

    I mean I'm sure they still are, just slightly less now.

  • Funny how the <dialog> test button does not work on Safari 15.3, if it's not backward compatible, it might not be worth implementing.

    But kudos on the gradiant and CSS improvements.