As the largest open ecosystem in history, the Web is a tremendous utility, with more than 1.5B active websites on the Internet today, serving nearly 4.5B web users across the world. This kind of diversity (geography, device, content, and more) can only be facilitated by the open web platform.
Users uniquely experience the Web as one as they navigate from site to site, and thus the responsibility is with all of us to work on delivering quality experiences that reach all.
At this year’s Chrome Developer Summit (CDS), we are focusing on giving developers the capabilities to reach the bar that our users demand. To help further foster the diversity and capability for web developers, we’ve been working closely with the ecosystem to make enhancements to the web platform, improve developer experience, and make meaningful updates to the browser itself.
Enhancing the versatility of the Web
Our vision is to make loading disappear for all our users. At I/O this year, we previewed Portals, which allows developers to create seamless experiences by pre-rendering content and optionally embedding it in the page to change the way users navigate across the web. We’re pleased to see the new style navigation from early partners like Fandango have been testing on their site already. Portals is available behind the chrome://flags/#enable-portals flag for developers to experiment with.
At CDS this year, we’re previewing Web Bundles,an infrastructural API that will allow developers to distribute their web content across any format - email, FTP, or even USB, without any compromises. Not only does this unlock delivery of web content at lightning fast speeds, it will also allow for peer-to-peer distribution even when users are offline. In the future, APIs likeBackground Periodic Syncand Content Indexing will allow developers to proactively cache and surface relevant web content for people even if they’re not on an active internet connection. Web Bundles is now available behind the experimental flag, and the other two are now available as origin trials.
Consumption of web content has never been more diverse; while the rise of mobile-first in developing markets has been well documented, we’re now seeing an increase in cross-device computing with the youth across the globe. We’re committed to making the platform powerful enough for developers to create amazing modern experiences that users expect while taking advantage of the frictionless of the web. By focusing our efforts on enabling fully capable web applications, we’ve been working to bring many primitives to the platform, including:
SMS Receiver, allowing web apps to retrieve two-factor SMS messages.
Contact Picker, which will allow people to share web content to their contact lists, bringing social media and communication capabilities to web apps.
Native File System API, enables web apps to read or save changes directly to files and folders on the user's device. This allows developers to build powerful web apps that interact with files on the user's local device, like IDEs, photo and video editors, text editors, and more.
There’s a lot more that we’re working on in this space and we can’t wait to see what you build with these capabilities. You can read all about our latest work in our blog on supporting new web experiences.
Enabling developer success no matter the framework or CMS
As web developers, we’re on a collective journey providing people their best, unique web experience. This collective responsibility makes accurate, actionable data on the health of the web increasingly important.
CDS gives us a checkpoint to see how we are doing and have a discussion on where we go next. We use the HTTP Archive to see how the web is built and the Chrome User Experience Report to see how it is experienced. Over the past year, we’re seeing a positive growth in the percentage of sites with fast First Contentful Paint and fast First Input Delay, our core metrics for loading and interactivity.
Measuring user experience quality is multi-faceted, today we introduced two new metrics to give developers a holistic view of how their sites are performing. Largest Contentful Paint (how quickly users see the most meaningful page content) and Cumulative Layout Shift (how stable a page feels).
Now, data is great, but insights that lead to fixes and improvements are better. We often get asked “What do I do with this information?” We’ve collaborated with many experts from the community on The Web Almanac, to give developers a holistic view of the health of the web. We launched over 17 chapters today and we’re excited to continue to identify and share more such insights.
Developers work incredibly hard to move their performance metrics in the right direction, so we are looking at ways to reward developers for going the extra mile. Today we are sharing some early explorations which surface speed signals in Chrome’s UI.
Frameworks, libraries and CMS’es form a critical part of the developer ecosystem and we’re keen to support them on their journey of creating instant and seamless for their users. Earlier this year we created Lighthouse Stack Packs for WordPress and React to support their developer ecosystems in build fast and reliable sites, and today we’ve increased the coverage include Angular, AMP as well as the ecommerce CMS, Magento, bring more actionable insights to developers irrespective of the tools developers use.
We’ve been excited to see that the Framework Fund has supported a number of meaningful projects that make it easier to hit the performance bars by default, and we’re looking forward to seeing more projects being funded this year.
Finally, we have launched Lighthouse CI to make sure that developers are given insights for each pull request. Developers can quickly hook up Lighthouse CI to their build pipeline to get a rich diff of the changes that they made and the impact it had on the quality of their site.
Making the browser work for you
We believe the web is for everyone, no matter their device type, internet speed or purchasing power. To help ensure the platform remains accessible to all, we’re investing in performance and memory improvements to the browser, including bringing new features like Image Lazy Loading that is now going to be available to Chrome Lite users by default, and Paint Holding, shipping soon in Chrome.
The web needs to be a safe and trustworthy place for everyone. Furthering our initiatives around HTTPS encryption, we began working with the community to start blocking all mixed content - insecure HTTP subresources on HTTPS pages - by default, and also experimenting with DNS over HTTPS, which offers better security and privacy by encrypting the traffic between the browser and DNS provider
We are also following up on our I/O promise to make our existing third-party cookie controls more visible. Starting with the Chrome M79 Beta, we’re experimenting with a toggle for controlling third-party cookies on the Incognito New Tab Page. We are also working on redesigning our settings pages to make access to this control easier in regular mode. And finally, apart from continuing to make progress to improve the existing cookies infrastructure, we’re also continuing to develop our Privacy Sandbox, a secure environment for content that also protects user privacy.
We want to thank the entire web community for their continued investment in a platform that is so impactful to so many people around the world. We believe it is our collective responsibility to elevate the web experience for every user and in that spirit, let's celebrate the 'We' in Web.
The web celebrated its 30th anniversary this year, and what an amazing three decades they have been. We’ve seen the platform go from powering simple hypertext documents, to one that enables rich, immersive, and dynamic experiences that are at the forefront of design.
Looking forward, the world’s needs continue to evolve, and that motivates us to continue our participation with the global web community to adapt and improve the platform to meet the needs of the future. Our efforts are focused on making the web faster and more powerful, while keeping our users’ trust and safety front and center.
Vision for an Instant Web
Speed matters on the web. We’ve found that users are highly sensitive to loading speed and this can have a direct impact on the business.
So we’ve been working hard to make the browser faster and lighter so developers can do more with their experience. By focusing on startup bottlenecks, we were able to improve the loading speed on Chrome’s startup by 50% on low-end devices; and 10% across devices. We also improved scrolling performance by 18% and through V8, JavaScript memory usage reduced by up to 20% for real world apps.
Apart from making the browser more efficient, we’ve also been adding more features to the platform to take the burden away from developers. And we’d like to share a few of these here:
To deliver a great image loading experience without needing developers to build their own JavaScript solutions, we’re bringinglazy loading for images and iframes directly into the browser. All developers have to do is add a simple HTML attribute and Chrome will take care of the rest.
For fast sites, Chrome’s eager clearing of the page, when a user wants to navigate to another page, can be detrimental to the experience. To avoid this flash of a white “loading page”, we’re rolling out a new experiment called Paint Holding to improve navigation on the web. You can see it in action for the Awwwards website here:
Speaking of navigations, Portals, is a new technology that we believe will fundamentally change the way users traverse the web. Portals are similar to iframes and allow content to be embedded directly in a page, but unlike standard iframes, they can be ‘activated’ to become the top-level page, enabling instant transitions across the web. Advanced experiences can even hold pieces of the original page’s UI privately and securely, so that you can provide seamless overlays that still hold our ideals of the origin model.
At I/O, we shared our vision of how developers would be able to use Portals and associated APIs to support pre-fetching, enhanced transitions and the exchange of contextual information between sites. And now that Portals API is available behind a flag in Chrome Canary, we’re excited to see what developers will build with this new primitive.
Another technology that we’re particularly excited about is Web Packaging, a bold new contract between web developers and web servers. With Web Packaging, the model for loading pages changes from the browser requesting the page from the origin’s server to it being able to load from anywhere — even potentially other peer devices.
This gives the browser the flexibility to preload content and load pages instantly while doing so in a privacy preserving way. Signed Exchanges, the first phase of this vision is now available in Chrome for developers to use.
These are some of the things that we’re doing to make the web more instant, but its success is predicated on developers making their experiences fast and maintaining that performance. So we’ve added a bunch of tools to help.
In 2017, we launched the Chrome UX reportto give developers a better sense of how their users truly experience their webpages by providing them real world metrics. The report is now includes a data set of nearly 6 million origins and is powering more of our tools, including the latest Speed Report in the Google Search Console. The report is currently in beta and you can register here to join the program and share your feedback.
To give developers an even wider array of real world metrics, the Firebase team have broadened their Performance Monitoring tool to also cover web apps.
And to stay on the rails for performance, we’ve seen many top sites implement ‘performance budgets’ within their build environments, and that is why we’ve built performance budgets directly into Lighthouse, so that you can get alerted to performance regressions before they hit your production site.
Creating a more powerful web
Our vision is to allow you to do absolutely anything that you want your users to do, on the web. So we’ve been working hard over the last year to close the capability gap by focusing on the features that get your experiences closer to your users.
Working closely with the community to address the most pressing and critical needs, we’re bringing many of these features to fruition at a great pace. Some of the capabilities that we’re most excited about include File system access, Unlimited Quota and the SMS based authentication feature that is particularly important for developers working in markets where “one-time passwords” are an important part of the authentication process.
And while we continue our momentum here, we’ve already launched the Web Share Target API allowing your apps to be integrated into the native system sharing, and opened up Shape Detection APIs that enable experiences like the Web Perception toolkit that we launched at I/O today. The toolkit allows developers to integrate with the mobile camera and enable people to use their website more effectively.
With mobile gaining many such strong capabilities, we also wanted to enable developers who build quality web experiences to get more reach. So we’ve launched Trusted Web Activities, that allow developers to integrate their web content into Android apps. And businesses like OYO Rooms, India’s biggest affordable hotels network, are already using Trusted Web Activities to power a lite version of their experience, a common pattern that we’re seeing amongst partners in some markets.
But the thing that we’re most excited about is the progress that we’ve made on desktop capabilities, with technologies like Web Assembly and individual media and productivity APIs unlocking many new use cases. Hulu and Google’s Duo are great examples of what’s possible on the web today. And we’re excited to have our friends at Slack join in and fully committed to roll out an offline-enabled web-powered version of their desktop app later this year.
PWAs on desktop came to ChromeOS last year, to enable web apps that need full window support and common desktop app capabilities. And now we’re excited to have extended support to Windows, Mac, and Linux.
We’re excited to see the momentum for PWAs on desktop and we wanted to ensure that we do our part to ensure that users can identify high quality PWAs and install them easily, so we’ve improved discoverability by bringing a new “Install” button directly into Chrome’s UI, within the Omnibox. This is one step to support developers building amazing experiences to get more engagement with their loyal users and we hope to continue doing more here.
In this landscape of massive device fragmentation, we wanted to see if it is possible for us to build an experience that could work across all devices, from the lowest-end feature phones to the large screen desktops. So we built a fun game - Proxx, that uses preact for UI, Comlink to be able to use workers and do more off the main thread. And yes, it works across all devices and performs well even on the most constrained ones. And because it's on the web, you can play it right here; but maybe after you're done reading. :)
Over the next year we will continue to open up even more of the capabilities that enable the next generation of games, productivity, media and social apps to come to the web, all whilst ensuring that the core principles of user safety and trust are preserved.
Bringing transparency, choice and control
User experience is extremely important to us and their safety and privacy remains at the heart of it. At I/O, we shared important upcoming changes to how Chrome will handle cookies in order to enable choice over tracking, and that enhance web security and privacy generally. And later this year, we will preview new features in Chrome that give users transparency and control over how they are tracked on the web.
We believe these changes will help improve user privacy and security on the web — but we know that it will take time. So we’re committed to working with the web ecosystem to understand how Chrome can continue to support these positive use cases and to build a better web.
Improving your developer experience
As the scope of the web platform increases and the demand from users to have ever faster, safer and more capable experiences at their fingertips it should be easier, not harder to build high-quality sites.
We built web.dev to bring our measurement tools, aka, Lighthouse and guidance all in one place. We’ve improved the site that now provides over 200 easy to follow guides for performance, safety, accessibility, resilience, and more. And at I/O, we announced our intent to build guidance for the tools that you use, starting with React.
And we’re adding the same level of personalization to Lighthouse, to give developers reports and improvement tips for the framework that they use. We’ve built in guidance for Wordpress and will be adding more over the rest of 2019 and beyond.
The web has come a long way over the last 30 years and we’re excited to be working with the developer community and other browsers with a shared mission to bring universal access to information and services to more people than ever.
Today, moving from page to page on the web feels like a long, slow transition - users have to stare at a white screen as their site loads and if they’re on a bad network, they’re disappointed when they see...nothing.
We want to enable developers to deliver a zero-friction, seamless experience to their users on the web and we’re excited to share two new specifications that we’ve been working on - Web Packaging and Portals.
One way to make loading fast is to get content as close to the user as possible, such as in edge caches. But the rise in HTTPS had the side effect of making this harder to achieve. And while AMP enables us to have privacy preserving pre-rendering of content with lightning fast load times, it came with the nagging issue of the browser not showing the publisher’s URL. Building on the AMP model, we introduced Web Packaging that gives the browser a proof of origin for the resources that it renders. This is achieved through Signed Exchanges, a subset of the full Web Packaging proposal.
So as long as the package is properly signed with a key that corresponds to the domain, it is presented to the user as having come from that domain. This enables privacy-preserving preloading and makes edge caching much easier, because now your content can be distributed to multiple caches without the need for an explicit DNS relationship with that cache. And we’re excited to see that Signed Exchanges are already available for origin trial. One of the first places you can see this in action is with the Google Search developer preview for signed exchange AMP content.
While instant loading is great, Portals take away the entire perception of navigation between pages by enabling multi-page sites to act like single-page applications through the same level of fluid transitions. It’s best when seen in action:
It’s still early in the development of the spec and we’d love your feedback on how we can make them more relevant for your use case.
Smooth user experience without losing developer experience
Having buttery smooth interactions is important, and as Mariko said yesterday, you can never add enough butter. However this level of UX often comes with a bitter trade-off, one that none of us like - bad developer experience. But we believe that it IS possible to break this dead-lock and that is where we’ll be spending a lot of our time in the coming year.
The Houdini APIs, such as the CSS Paint API, Animation and Layout Worklets give developers an unprecedented level of control to build new and modern interfaces.
And to give developers a well-lit path and ensure that they don’t regress from their performance goals as they build in incremental features, we’re working to build Feature Policy that catch common mistakes and give developers a signal during staging and more importantly in production. For more on this, tune in to Jason’s talk later today.
Performance at scale
Focusing on performance is critical today. Frameworks play a very important role in achieving lasting improvements at scale. We’ve already seen some great work done by various frameworks over this past year, and we want to collaborate and support their efforts in 2019.
So we’re excited to announce that starting today, we’ll be making feedback from framework teams a standard part of the Chrome Intent to Implement process. We want to use this process to include the voice of frameworks within the features that we prioritize.
Secondly, to really strengthen this collaboration, we’re launching a fund with an initial amount of $200,000 to support the development of performance related features in third party frameworks. We’ll share performance goals that we’d love to see “on by default” in frameworks. We’re excited to see what the developer community will come up with given their experience working with frameworks and the wider ecosystem. And based on the potential impact of the proposal, we’ll support your work through direct funding.
We’ll have more to share on this in the coming weeks. In the meantime, developers can go to this link to register interest. Applicants can start an RFC on the github repo of the project they intend to modify and would be considered only if the project’s core maintainers sign-off on the feature.
Meanwhile, stay tuned on the livestream to watch the rest of the sessions of day two of Chrome Dev Summit 2018!
