Chrome 38 Beta: New primitives for the next-generation web

Thursday, August 28, 2014

Today’s Chrome Beta channel release includes a ton of new primitives and APIs to simplify development and give developers more control over their web applications. Unless otherwise noted, changes described below apply to Chrome for Android, Windows, Mac, Linux, and Chrome OS.

New HTML element: <picture>

This release adds support for the new <picture> element thanks to the hard work of community contributor Yoav Weiss, who was able to dedicate his time to implementing this feature in multiple rendering engines because of a successful crowdfunding campaign that raised 50% more than its funding goal.

The <picture> element takes the concept of responsive design, previously solved by sending duplicate resources to the client, and bakes an elegant solution right into the web platform. It allows developers to list multiple versions of images that may be appropriate for the browser to display based on screen size, pixel density, or other factors.


<picture>
    <source media="(min-width: 45em)" srcset="large.jpg">
    <source media="(min-width: 32em)" srcset="med.jpg">
    <img src="small.jpg" alt="The president giving an award.">
</picture>


New JavaScript features

Chrome 38 also enables by default several new JavaScript language features from the draft ECMAScript 6 (ES6) specification. Additions include:
  • Maps and sets, two highly-requested data structures which make storing and interacting with data simpler and more rational.
  • Iterators now provide an easy and extensible way to iterate over sequenced data types such as arrays and strings, as well as the new maps and sets.
  • Symbols, which help prevent object properties from unintentionally interfering with each other.
  • Math functions such as Math.sign and Math.log10, which prevents developers from having to re-implement these functions and provides the performance boost of built-in functions. Take a look at the full list of new functions.
Future releases of Chrome will contain even more ES6 features as the specification matures. Stay posted!

Other updates in this release
  • The Network Information ("NetInfo") API is now enabled, giving web applications access to the current type of network on a device running Android, iOS, or Chrome OS. This could allow an app to only do data-intensive activities such as syncing when connected to a Wi-Fi connection.
  • The addition of the Screen Orientation API allows developers to not only detect whether a device is in portrait or landscape mode, but also lock the screen orientation while a user is within that app.
  • The CSS value "image-rendering: pixelated" is now supported, which allows scaled images to appear to be composed of very large pixels. Example use cases include high-performance display of zoomed photos in image editing software without large bandwidth or load time costs.
  • The Encoding API enables the encoding and decoding of data from binary streams, such as converting between a raw ArrayBuffer and a string.
  • The new File interface allows developers to create and interact with File objects in the same way as Blob objects.
  • SVG fonts are no longer supported, except on Windows systems older than Windows 7. Note that while the feature works on those systems, it is considered deprecated.
As always, visit chromestatus.com/features for a complete overview of Chrome’s developer features, and circle +Google Chrome Developers for more frequent updates!

Posted by Andreas Rossberg, Senior Symbolic Software Engineer

Post a Comment