Chromium Blog: Chrome 52 Beta: CSS containment, simpler performance measurement, streamable responses from service workers, and more options for web push

Chrome 52 Beta: CSS containment, simpler performance measurement, streamable responses from service workers, and more options for web push

Friday, June 10, 2016

Unless otherwise noted, changes described below apply to the newest Chrome Beta channel release for Android, Chrome OS, Linux, Mac, and Windows. CSS Containment Rich, interactive experiences are a cornerstone of the web, but can sometimes take a long time to render due to their complexity. Currently, Chrome improves rendering performance by using heuristics to determine which parts of a page have changed. Only sections that have changed are updated instead of rendering the entire page 60 times per second. However, because elements can display outside the bounds of their parents, it is possible that changes to one element could affect elements anywhere else in the document. This dramatically increases the number of elements that Chrome must consider while rendering.
New in this release, the CSS contain property allows developers to prevent an element’s children from displaying outside of its bounds. When an element updates, this guarantee allows Chrome to ignore any element outside the parent node during rendering, leading to faster rendering times. Performance Observer Collecting accurate real-user measurement (RUM) data is critical to detecting performance problems and regressions that may hurt the user experience of a site. Chrome's DevTools allow local site testing, but measuring how a site performs for real users with varied devices can be challenging. The latest version of Chrome supports the PerformanceObserver API, which enables a simple and performant way to collect RUM data at runtime. Instead of polling for updates, sites can declare which metrics they’re interested in. The browser notifies the site when new data points for those metrics become available. Service Worker Responses Powered by ReadableStreams Streaming HTTP responses allow browsers to progressively render earlier portions of a large HTML document before the entire response is available. The latest version of Chrome improves service workers by adding streaming support. Sites can use the Streams API to construct streamable Response objects by passing a ReadableStream to the Response constructor. Offline Wikipedia client demonstrates the speed benefits of readable streams. Web Push Protocol and VAPID Support Push notifications have unlocked a new level of re-engagement for web apps, but until now developers have had to use proprietary push message delivery services and different APIs for different browsers. Chrome now supports VAPID, an open standard to authenticate a site’s server with a push service. When using VAPID, sites are given a Firebase Cloud Messaging endpoint, which supports the cross-browser web push protocol. Other features in this release

Chrome now pauses animations while showing modal dialog boxes.

HTTP alternative services allow sites to specify additional origins that can be used to reach a certain resource, enabling easier protocol upgrades and load balancing.

ImageBitmaps can be created more easily using ImageBitmapOptions to specify configurations on construction.

Sites can now free the memory consumed by an ImageBitmap using ImageBitmap.close().

Chrome now supports OpenType small capitals and easier styling of numbers using the font-variant-caps and font-variant-numeric properties.

Touch gestures inside a cross-origin iframe can no longer trigger popups unless they correspond to a tap gesture, preventing accidental pop-ups during scrolling.

Now only secure origins can create or delete secure cookies on Chrome for Android.

The latest version of Chrome supports -webkit-appearance:none which disables the default rendering of HTML5 meter elements and allows easier custom CSS styling.

The unsafe-dynamic Content Security Policy expression allows sites to use single-use or hash-based whitelists to verify script sources, making it easier to protect against cross-origin scripting attacks.

Sites can now use the Fetch API to programmatically set the referrer policy for a request.

CanvasRenderingContext2D now supports the filter attribute, allowing sites to apply effects to primitives drawn to the canvas.

Sites can now test whether or not a key exists within the bounds of an IDBKeyRange using IDBKeyRange.includes().

The HTMLMediaElement.srcObject attribute simplifies associating a MediaStream with a media element.

AudioParam now supports the read-only min and max attributes to simplify introspection.

RTCCertificates can now be stored in IndexedDB.

PannerNode and AudioListener now support automation methods, allowing smooth audio transitions.

Stylesheets can now specify alpha values for colors using eight- and four-bit hexadecimal values instead of the longer rgba() syntax.

Sites can now experiment with persistent storage as an origin trial, allowing a site to disable automatic storage clearing when bookmarked.

Multiple WebVTT tracks will now be presented as user options in the default media controls, enabling language selection for captions and subtitles.

postMessage overrides of the form postMessage(message,transferables,targetOrigin) have been deprecated.
The MediaStream ended event and the corresponding onended attribute have been deprecated.
The web app manifest icons entry no longer supports the density property.
The DynamicsCompressorNode.reduction attribute is now a readonly float instead of an AudioParam.
flexbox children with position:absolute will now be positioned using justify and align if the element does not have a left:, right:, top:, or bottom: position specified.
requestAutocomplete() has been deprecated and removed due to low usage numbers.
X-Frame-Option will no longer be supported in the meta tag to support a more secure implementation.
Invalid values for track-kind are now treated as metadata instead of subtitles to improve media behavior in older user agents.

Posted by Shubhie Panicker, Performance Powerhouse

Chromium Blog

Chrome 52 Beta: CSS containment, simpler performance measurement, streamable responses from service workers, and more options for web push

Labels

Archive

Feed