Main image of article Apple WWDC 2020 Highlights: Big Things for Web Developers

For iOS developers, Apple’s annual WWDC conference is a time of lively updates and retooling. Web developers usually find something of benefit, but rarely much to be excited about. This year, that changed.

The main takeaway from WWDC 2020 is the Mac’s change to an ARM-based SoC, which Apple has dubbed “Apple Silicon.” This is noteworthy for web developers, too, mainly because it gives Apple license to open up Safari for extensions.

Safari has boasted extensions for a long time, but now Apple allows web developers to port Chrome or Firefox extensions without much retooling. Safari’s existing extensions were great for Objective-C or Swift developers—but not so much for web developers writing JavaScript or CSS.

Safari’s web extensions are built using HTML, CSS, and JavaScript, and allow developers to use the same extension model and APIs used in other browsers. Web extensions also have deep privacy controls so users can allow them to work across the web, a URL, or a page. Notably, this is also a way to further ingrain web developers into Apple’s ecosystem, as Safari Web Extensions are sold via the Mac App Store. As we’ve noted before, the Mac App Store may eventually be the only way to download anything for the desktop, including extensions.

This also means Safari Web Extensions need to flow through Xcode, and that extensions should be part of an app bundle. To facilitate the porting of extensions, Apple has a new command line tool for use in Xcode that bundles existing extensions into apps. It only needs to be run once per extension, but creates a new Xcode project wherein an extension from another browser can be bundled as an app. 

Unsupported keys in a build get a warning. In a session about Safari Web Extensions, Apple also said any unsupported keys will simply not work in an Safari Web Extension. The example provided was a notifications key that was unsupported in Safari; it’s important to note that more complex extensions will likely have to source Apple-y fixes for any keys that are unsupported.

You will need to purchase an Apple Developers license to publish extensions for Safari.

FaceID and TouchID for the Web

Another major point of interest from this year’s WWDC involves FaceID and TouchID being supported within Apple’s Web Authentication API, which previously only supported hardware keys. It works much the same as FaceID and TouchID for apps currently does. There’s a platform authenticator that identifies which capability your device has (FaceID or TouchID); all personal details are held in the device’s secure enclave so no app can read or write to your personal data. 

For the web, Apple takes this a step further. As the company notes, some hardware keys using an attestation authenticator can be spoofed or duplicated, which makes them less secure. Instead, Apple uses anonymous attestation, which works a lot like its Sign-In with Apple feature. Apple uses its own servers to host temporary attestation certificates, much like Sign-In with Apple uses obfuscated email addresses to sign you into apps. 

For web developers, adopting the feature is a three-step process. A site must first check to see if the feature is available on the device being used. Someone using an older Mac, iPhone, or iPad can’t take advantage of FaceID, TouchID, or perhaps either authentication method.

Second, the site has to create a public key credential for a new user that contains the proper authentication information. Finally, to allow users to sign into a site, there is a getter for credentials that allows a site to authenticate the data on their server.

Deeper Integrations for What’s Next

Apple added deeper integrations with two of its existing technologies that figure prominently in the company’s future: Apple Watch and augmented reality (AR).

Users and talking heads on Twitter have long wished Apple would allow for third-party Apple Watch faces, and it has. Sort of. A brand or company can now create watch faces using Apple’s existing templates, or use the web to show off their complications (then share them with users from a web page).

Here’s an example: Let’s say you operate a meditation platform. This service has a website, iOS app, and three Apple Watch complications. There are a large number of users coming to the website, and the app is popular, but your Apple Watch complications don’t seem to be quite as well-used. Your site (and app) could be used as platforms to surface an existing Apple Watch face with your complications, which users can download straight from your site or app for use on their watch. 

Developers still can’t create their own watch faces, but this allows them to control the face type, color scheme, and any additional complications. It’s a low-key way for Apple to ‘theme’ your watch face gallery. It’s possible (probable, really) the gallery of watch faces we have on our wrists via swiping left or right will soon be ‘themed’ for workouts, meditations, sleep, and just about anything else. We expect next steps will be Siri suggesting watch faces you’ve downloaded based on time of day or typical activity.

Augmented reality, which is almost certainly Apple’s next big thing, may hinge on bespoke eyewear to truly go mainstream. Now web developers can add call-to-action banners so users can buy things they’re looking at in AR, encompassing both augmented reality and Apple Pay. The past few years has seen Apple make it easier for users to view things in AR (and create new AR 3D models using USDZ). Now it’s allowing users to buy the things they see, via pop-up banners while viewing an item.

Users can also pre-order or chat with a business via these pop-ups, which seems ripe for heads-up eyewear. It’s easy to imagine a user using pop-ups and a chat feature to virtually measure and order custom drapes, for example. 

Apple Did More for the Web

At this year’s WWDC, browser interoperability was enhanced with 140,000 new interoperability tests, service working was improved, the Web Animations API added JavaScript features for controlling animations, there’s a new resize observer for viewport or child image size handling, support for system font families in CSS, line-break alterations to avoid layout jenk, WebP support for images, and HDR video support with the ability to cast videos from the web to any supported AirPlay device. Oh, and Siri events can now be handled entirely on the web and added to Maps or the Calendar apps.

That’s a lot of stuff. 

If there’s any downside in this avalanche of new things, it’s with Safari Web Extensions. Apple’s language hints that these will only be available in the Mac App Store, which means Apple is limiting the open web. Combined with its other efforts, such as Bootcamp for Mac disappearing with the ARM transition and Mac apps apparently being funneled into the Mac App Store, Safari extensions appear to be another brick in Apple’s walled garden.