New WebKit Features in Safari 12.1

Jonathan Davis – Web Technologies Evangelist for Apple – has done a writeup on the new features that have landed in Safari 12.1, which is included with macOS Mojave 10.14.4 and iOS 12.2.

This release delivers web platform features that improve website integration with the operating system, new real-time communication capabilities, more compatible encrypted media support, and features that help developers reduce the need for polyfills.

Whilst Dark Mode most likely is the most touted feature, I’m especially excited to see Intersection Observer land as it allows you to do nifty stuff such as lazily load images, triggering events for position: sticky;, prefetch pages for links that are in the viewport, etc.

Supporting <input type="color" /> looks handy, yet (on iOS) I’d also like to be able to input a color hex code myself.

The <datalist> element also forms a nice addition, but the implementation (on iOS) needs some more work imho: the triangle on the right of the input makes me think it’s a dropdown. Upon tapping the input I get to see three of the defined options. Since I am under the impression that this control is a dropdown, I’m also left with the impression that I can only choose one of those three options that are initially presented … confusing.

Not mentioned in the post, but mentioned in the release notes, is the fact that Safari will now implicitly add rel="noopener" onto links that have target="_blank" set.

New WebKit Features in Safari 12.1 →
Safari 12.1 Release Notes →

🤔 Why should you care about rel="noopener"? Mathias Bynens – who else – has got you covered.

Published by Bramus!

Bramus is a frontend web developer from Belgium, working as a Chrome Developer Relations Engineer at Google. From the moment he discovered view-source at the age of 14 (way back in 1997), he fell in love with the web and has been tinkering with it ever since (more …)

Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.