News and developments from the open source browser project
Universal rendering with SwiftShader, now open source
Wednesday, June 29, 2016
SwiftShader is a software library for high-performance graphics rendering on the CPU. Google already uses this library in multiple products, including Chrome, Android development tools, and cloud services. Starting today, SwiftShader is fully open source, expanding its pool of potential applications.
Since 2009, Chrome has used SwiftShader to enable 3D rendering on systems that can’t fully support hardware-accelerated rendering. While 3D content like
is written for a GPU, some users’ devices don’t have graphics hardware capable of executing this content. Others may have drivers with serious bugs which can make 3D rendering unreliable, or even impossible. Chrome uses SwiftShader on these systems in order to ensure 3D web content is available to all users.
Chrome running without SwiftShader on a machine with an inadequate GPU (left) cannot run the WebGL Globe experiment. The same machine with SwiftShader enabled (right) is able to fully render the content.
SwiftShader implements the same OpenGL ES graphics
used by Chrome and Android. Making SwiftShader open source will enable other browser vendors to support 3D content universally and move the web platform forward as a whole. In particular, unconditional WebGL support allows web developers to create more engaging content, such as casual games, educational apps, collaborative content creation software, product showcases, virtual tours, and
. SwiftShader also has applications in the cloud, enabling rendering on GPU-less systems.
To provide users with the best performance, SwiftShader uses several techniques to efficiently perform graphics calculations on the CPU. Dynamic code generation enables
the code towards the tasks at hand at run-time, as opposed to the more common compile-time optimization. This complex approach is simplified through the use of
, a custom C++ embedded language with an intuitive imperative syntax. SwiftShader also uses vector operations in
fashion, together with multi-threading technology, to increase parallelism across the CPU’s available cores and vector units. This enables real-time rendering for uses such as
Developers can access the SwiftShader source code from its
. Sign up for the
to stay up to date on the latest developments and collaborate with other SwiftShader developers from the open-source community.
Posted by Nicolas Capens, Software Engineer and Pixel Pirate
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
channel release for Android, Chrome OS, Linux, Mac, and Windows.
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
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.
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
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
to construct streamable
objects by passing a
to the Response constructor.
Offline Wikipedia client
demonstrates the speed benefits of readable streams.
Web Push Protocol and VAPID Support
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
, 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.
allow sites to specify additional origins that can be used to reach a certain resource, enabling easier protocol upgrades and load balancing.
can be created more easily using
to specify configurations on construction.
Sites can now free the memory consumed by an
Chrome now supports
small capitals and easier styling of numbers using the
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
which disables the default rendering of HTML5
elements and allows easier custom CSS styling.
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
now use the Fetch API
set the referrer policy
now supports the
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
attribute simplifies associating a
with a media element.
now supports the read-only
to simplify introspection.
can now be stored in IndexedDB.
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
can now experiment
, allowing a site to disable automatic storage clearing when bookmarked.
Multiple WebVTT tracks will now be presented as
in the default media controls, enabling language selection for captions and subtitles.
overrides of the form
have been deprecated.
ended event and the corresponding onended attribute have been deprecated.
web app manifest
entry no longer supports the density property.
attribute is now a
instead of an
will now be
positioned using justify and align
if the element does not have a
deprecated and removed
due to low usage numbers.
will no longer be supported in the
tag to support a more secure implementation.
Invalid values for
are now treated as
to improve media behavior in older user agents.
Posted by Shubhie Panicker, Performance Powerhouse
The Mobile Web Is Open for Business
Thursday, May 19, 2016
Posted by Rahul Roy-chowdhury, VP Product Management, Chrome
One of the virtues of the web is its immense reach, providing access to information for all internet users regardless of device or platform.
With the explosion of mobile devices, the web has had to evolve to deliver great experiences on the small screen. This journey began a few years ago, and I am excited to be able to say that the mobile web is
open for business
Hear the recording from Google I/O where I discussed the state of the union and how to take advantage of
new experiences like AMP and Progressive Web Apps (PWAs)
to deliver a best-in-class mobile experience.
If you don’t have time to watch,
here’s a quick recap of the four aspects to focus on while building
a great mobile web experience:
Expressiveness has always been a strength of the web, but sometimes that expressiveness can come at the cost of loading time or smooth scrolling. For example, event listeners allow developers to create custom scrolling effects for their website, but they can introduce jank when Chrome needs to wait for any touch handler to finish before scrolling a page. With the new
passive event listener API
, we've given control back to the developer, who can indicate whether they plan to handle the scroll or if Chrome can begin scrolling immediately.
Speed also goes beyond user experience gains.
have shown that 40% of users will leave a retail site if it takes longer than 3 seconds to load. To get a blazing fast web page in front of users immediately, we've introduced
Accelerated Mobile Pages (AMP)
. With AMP, we have seen pages load 4x faster and use up to 10x less data. AMP is already seeing great adoption by developers, with more than 640,000 domains serving AMP pages.
Progressive Web Apps (PWAs)
let developers take advantage of new technologies to provide users with an engaging experience from the very first moment. Thanks to a new API called service worker, all the important parts of a web app can be cached so that it loads instantly the next time a user opens it. This caching also allows developers to continue to provide a fast and meaningful experience even when the user is offline or on an unreliable network. PWAs provide elements of polish too: an icon users can add to their home screen, a splash screen when they open it, and a full-screen experience with no address bar.
JalanTikus Progressive Web App
Logging in is a ubiquitous pattern on the web, but
92% of users
abandon a task if they've forgotten their password. To alleviate this pain, Chrome's password manager enables more than 8-billion sign-ins per month, and we're expanding support with the
Credential Management API
. Using this API allows web apps to more closely integrate with the password manager and streamline the sign-in process.
Even once logged in, checkout can be a complicated process to complete. That's why we're also investing in capabilities such as the
Web Payment API
and enhanced autofill, assisting users by accurately filling in forms for them. We've found that forms are completed 25% more when autofill is available, increasing odds for conversion.
Once the first interaction with a user is complete, re-engaging on the web can be tricky. Push notifications address this challenge on native apps, and now the
is available on the web as well. This allows developers to reconnect with their users even if the browser isn't running.
Over 10 billion push notifications are sent every day in Chrome, and it’s growing quickly. Jumia
that users who enabled push notifications opened those notifications 38% of the time and recovered carts 9x more often than other users.
Jumia Mobile Web Push Notifications
As developers begin embracing these new technologies, we're seeing success stories from around the world.
one of the world's largest e-commerce sites, built a PWA and saw conversion rates for new users increase by 104%.
They've also found that u
sers love the experience, spending
74% more time on their site per session.
Another great example is
, an Indonesian news aggregator service that was app-only until they developed a PWA with feature parity to their native app. Since launching they have found it to perform even faster than their native app, and have seen comparable time spent per session:
3 minutes on average on both their mobile website and their native app.
Even developers who have only begun implementing certain PWA technologies have seen success.
a leading retailer in Saudi Arabia, implemented push notifications and saw users who opted-in returned 4x more often.
These returning users also spent 100% more than users returning from other channels.
These are just a handful of businesses that have begun reaping the benefits of investing in Progressive Web Apps.
about our how partners are using PWA technologies to enhance their mobile web experience.
to our YouTube channel to stay up to date with all the mobile web sessions from Google I/O, which we will continue to upload as they’re ready. Thanks for coming, thanks for watching, and most of all, thank you for developing for the web!
chrome web store
Give us feedback in our
Official Google Blog
Public Policy Blog
Lat Long Blog
Ads Developer Blog
Android Developers Blog