Chrome 71 Beta is here with a relative time format and more

2 min read

Chrome 71 beta was released yesterday with international relative time formats and other features.

A relative time format in Chrome 71 Beta

Phrases like ‘yesterday’ or ‘three months’ are common while writing or speaking. But such phrases are not a part of the built-in date and time APIs. So using them in code is not possible. To fulfil this need, libraries provide localized versions of such phrases. But using them required downloading customary phrases for each supported language thereby increasing the bundle size and download time.

Chrome 71 Beta has a new Intl.RelativeTimeFormat() function which shifts this job of phrases to the JavaScript engine. Examples to show how this works:

const rtf = new Intl.RelativeTimeFormat('en');

rtf.format(3.14, 'second');
// → 'in 3.14 seconds'


rtf.format(-15, 'minute');
// → '15 minutes ago'

This API can even do things like retrieving information for multiple languages, dealing with parts of a date or time individually etc. For more details on this, visit the Chrome post.

Some other features in Chrome Beta 71

Apart from the addition of a relative time format, other features have been added.

FullscreenOptions

The Element.requestFullscreen() method can now be customized on Android with the use of an optional options parameter. The navigationUI parameter allows choosing between making the navigation bar visible or a completely immersive mode where no controls are shown on the screen until a gesture is performed to bring out the navigation.

Support for new font types

Chrome Beta 71 brings support for COLR/CPAL fonts. These are a type of OpenType color font composed of layers. The layers are made of vector outline glyphs and color palette information. With this addition, Chrome now supports three color font formats which are cross-platform. The other two are CBDT/CBLC and SBIX.

MediaElement and MediaStream nodes defined only for AudioContext

Chrome Beta 71 allows creation of MediaElementAudioSourceNode, MediaStreamAudioSourceNode, and MediaStreamAudioDestinationNode elements exclusively by using an AudioContext. In older versions these could be created using an OfflineAudioContext, but that is not supported anymore due to spec compliance and real-time nature of the nodes not being met by OfflineAudioContext.

Some interoperability improvements

For interoperability with other browsers, Chrome now calls capture event listeners in the capturing phase. This is done at shadow hosts, while previously it was done in the bubbling phase.

Chrome now calculates the specificity for the :host() and :host-context() pseudo classes and also for the arguments of ::slotted(). This makes it compliant with the Shadow DOM v1 spec.