Web Audio API

The Web Audio API is a high-level JavaScript API for processing and synthesizing audio in web applications. Whereas the HTML5 audio element allows for basic streaming and audio playback, the Web Audio API is powerful enough for more complex audio applications that require mixing, processing, or filtering audio data, such as a modern game audio engine or an interactive audio production application.

HTML5 Media Controllers

An HTML5 media controller can synchronize and otherwise coordinate the playback of multiple media elements. For instance, you could use a media controller to overlay a sign language interpretation track over a video track and keep the two in synchronization.

A media controller has the same methods and events as an HTML media element. This means that, for example, when you call the pause() method on a controller, any media slaved to that controller will be paused; or when a controller receives a canplaythrough event, all media slaved to that controller can be played through to the end without buffering.

HTML5 Timed Text Tracks

HTML5 timed text tracks enable captions, subtitles, descriptions, and chapters by letting you specify the timing of text that appears with a video element.

CSS Filters

CSS filters let you apply pixel effects to any image or web page element with a single line of code. Available filter functions include the following:

• sepia()

• hue-rotate()

• saturate()

• invert()

• opacity()

• brightness()

• contrast()

• blur()

• grayscale()

• drop-shadow()

Filters can be combined, and changes to the filter property can be animated with CSS transitions or animations. The figures below show an image with various CSS filters applied to it.

SVG Filters

Using Scalable Vector Graphics (SVG) filters, you can combine several filter primitive elements and light source elements into a single sophisticated filter, which can then be applied to any SVG element.

Redesigned Web Inspector

The Safari Web Inspector has a streamlined new design that speeds up common development tasks. It features a new iconography, a navigation bar that lets you easily switch between different web page elements, a persistent JavaScript console, integrated timelines, and more. Additionally, JavaScript debugging is now enabled by default, and the page source view now opens in the Web Inspector automatically.