Source: Chrome 75 Beta: low latency canvas contexts, sharing files, and numeric separators from Chromium

Unless otherwise noted, changes described below apply to the newest Chrome Beta channel release for Android, Chrome OS, Linux, macOS, and Windows. Find more information about the features listed here through the provided links or from the list on ChromeStatus.com. Chrome 75 is beta as of May 2, 2019.

Hint for low latency canvas contexts

The canvas.getContext() method now supports a desynchronized hint, which provides a low-latency alternative to the now deprecated NaCl/PPAPI solution which used native OpenGL rendering. The new solution requires either 2d or webgl context types.

To use it, pass desynchronized: true in the666 options parameter of canvas.getContext() and specify CanvasRenderingContext2D, a WebGL2RenderingContext, or a 65WebGL2ComputeRenderingContext as the context type. For example:

const canvas = document.querySelector("canvas");
const context_type = '2d'; // 'webgl' or 'webgl2'
canvas.getContext(context_type, {desynchronized: true, alpha: false });

For more information and links to sample code, read Low latency rendering with the desynchronized hint on our developer’s site.

Web share now supports files

Files are now supported by the Web Share API. Over the last few years, we’ve been working to bring native sharing capabilities to the web. The Web Share API allows web apps to invoke the same share dialog box that a native app user would see. The code looks something like this:

if (navigator.canShare && navigator.canShare({ files: filesArray })) {
  navigator.share({
    files: filesArray,
    title: 'Vacation Pictures',
    text: 'BarbnHere are the pictures from our vacation.nnJoe',  })
  .then(() => console.log('Share was successful.'))
  .catch((error) => console.log('Sharing failed', error));
} else {
  console.log('Your systems doesn't support sharing files.');
}

If you’re already used the sharing APIs, most of this looks familiar. As highlighted above, the new feature brings a new method and a new shareData property. For details read Share files with Web Share.

Numeric separators

Numeric literals now allow underscores (_, U+005F) as separators to make them more readable. For example, 1_000_000_000 will be interpreted by mathematical operations as equivalent to 1000000000.

There are a few things you should be aware of. Underscores can only appear between digits, and consecutive underscores are not allowed. So literals such as 3._14, _2.71 or 1.6__2 are illegal.

Other features in this release

Allow PaymentRequest.show() to take optional detailsPromise

The detailsPromise argument is a way to signal that the browser should show a spinner or equivalent and wait on allowing user interaction until an update. Some users may not know the total or the number of line items at the time of attempting to open the payment sheet with show().

Animation improvements

Animation() constructor

The new Animation()33 constructor gives developers more control over the created animation by using the exact KeyframeEffect object (see below). Currently developers must use the Element.animate() method, which returns an Animation object that is internally constructed.

AnimationEffect and KeyframeEffect

AnimationEffect and KeyframeEffect allow a developer interactive control over the following parts of their Animation:

• The Animation target (the element being animated).
• The Animation timing properties (duration, delay, etc.).377

AppCache: Cross-origin resource size padding

For quota accounting purposes, the size of cross-origin AppCache resources are now padded. Cross-origin resources are resources whose origin differs from the manifest’s origin. The padding size will be a random number between 0 and about 14MB. Quota accounting purposes include the size reported by the Quota API and quota enforcement. An origin’s storage API calls are blocked when the origin exceeds its quota.

CSP: `script-src-attr`, `script-src-elem`, `style-src-attr`, `style-src-elem` directives

These four new directives provide the functionality of the script/style directive but with more granularity, applying to elements or attributes.

HTMLVideoElement.playsInline

This is a hint a website may provide to a user agent to display a video content within the element’s playback area.

MediaStreamTrack.getCapabilities() support for audio device-related constrainable properties.

MediaStreamTrack.getCapabilities() now returns the device-related capabilities of the source associated to a MediaStreamTrackucifically sample size, sample rate, latency, and channel count/

There is also a variant InputDeviceInfo.getCapabilities(), available in the results of MediaDevices.enumerateDevices(). These devices are used as sources for MediaStreamTrack, and getCapabilities() in this case returns the same values as MediaStreamTrack.getCapabilities() for sampleSize, channelCount, and latency.

noreferrer attribute for window.open()

Allows a web page to use window.open() without leaking referrer information by leaving the referrer header out of page navigations.

Web RTC improvements

RTCDtlsTransport

This interface provides information about active transports. Specifically, this interface allows an application access to information about the Datagram Transport Layer Security (DTLS) transport over which RTP and RTCP packets are sent and received by RTCRtpSender and RTCRtpReceiver objects, as well as other data such as SCTP packets sent and received by data channels.

RTCIceTransport

This interface provides information about the state of the ICE transports used by RTCPeerConnection to send and receive media to another endpoint.

Service workers appear in Chrome’s Task Manager

Service workers now appear in Chrome’s Task Manager.

stale-while-revalidate

The new stale-while-revalidate response directive is used by the Cache-Control header to define an extra window of time during which a user agent can use a stale asset during asynchronous revalidation. The revalidation of such assets bypasses the service worker. op0This change improves subsequent page load latencies by keeping stale assets out of the critical path.

Web Authentication API: FIDO CTAP2 PIN support

This feature extends Chrome’s implementation of the Web Authentication API to support local user authorization of security key operations via a user-defined PIN for keys that implement the FIDO CTAP2 protocol. Web sites using web authentication can request or require such authorization via the API’s user verification mechanisms.

Interoperability

Allow waitUntil() and respondWith() inside microtasks during event dispatch

To conform to the specification, ExtendableEvent.waitUntil() and FetchEvent.respondWith() can now be called during the microtask checkpoint at the end of event dispatch. Previously, this would throw an InvalidStateError.

Feature Removal

Remove overflow: -webkit-paged-x and overflow: -webkit-paged-y

These are old webkit-specific properties that allowed developers to fragment content over columns inside a scrollable region. They are now removed.

Practically speaking these aren’t used. Most developers use them accidentally, and typically when they are they force a new formatting context similar to setting overflow: hidden.