[MUSIC PLAYING] [APPLAUSE] BEN GALBRAITH:
I'm Ben Galbraith. DION ALMAER: And
I'm Dion Almaer. And we're on the
Chrome team, where we work on the Web Platform, and-- BEN GALBRAITH: We'll be tag
teaming throughout this talk, as we share with you-- DION ALMAER: Some
highlights of what's new on Chrome and the Web. BEN GALBRAITH: And since
last year's Google I/O, we've had three
major anniversaries. In September, Chrome
turned 10 years old. And to celebrate, we shipped
a major update to Chrome's UI. DION ALMAER: In the
same month, Google marked 20 years pursuing
its mission of organizing the world's information. And two months ago, the Web
celebrated its 30th birthday. So I guess the Web is
a real grown up now. BEN GALBRAITH: I guess
we're headed to middle age. So it was back in 1989
that Tim Berners-Lee described this vision
that he had for the Web. And I love this concept of
a space where everything can be linked to everything. And I think this captures
the spirit of the Web and what makes it special
in today's landscape. It's this massive, global scale
open platform where all of us can freely connect
with each other and where a new experience
is just a link away. DION ALMAER: And
the Web's future depends on all of
us working together to adapt and improve it, to
meet the needs of our evolving world. This need to
collaborate is why we work on the open-source
Chromium Project, as we work to improve
the Web Platform. And we're really
excited that Chromium is used by so many different
browsers all around the world. BEN GALBRAITH: So the Web has
come so far over the past three decades-- this is the world's
first web page up here-- from simple documents
to really, really sophisticated modern websites. And so as we think about
the next three decades, we ask ourselves
what lies ahead. We have three major
goals for the work that we're doing to
improve the Web Platform. First, we want to enable users
to traverse the Web instantly, no matter where they
are in the world. And this helps ensure
that people keep exploring and finding new content. And it builds this
rich diversity that we value so
much on the Web. Second major goal is
expanding the power of the Web, which
enables people to find all of the world's information
and services on the platform. And it really brings
this vision of everything connected to everything
on the platform to life. Our third major goal is ensuring
that, as people navigate the Web, they're kept safe. And so this
afternoon, we're going to update you on
some of the work that we've been doing
in these three areas. DION ALMAER: So let's start
with loading links instantly. Back in the early days-- [DIAL-UP SOUND] --you know, the
dial-up modem era-- does this bring
back any memories? BEN GALBRAITH: I
don't know if they're good memories or bad memories. DION ALMAER: They're
really good memories. This was fun. [INAUDIBLE] BEN GALBRAITH: I guess. DION ALMAER: Back
in the dial-up era, high-speed connections were
kind of limited to institutions. You didn't really
have them at home. But today, broadband
is everywhere. We increasingly have blazingly
fast connections, even in our pockets. The instant web is here. OKR achieved. BEN GALBRAITH: Except
it's really not. DION ALMAER: Really? BEN GALBRAITH: No. If you look at the data--
we're product managers, sometimes we do that. In real world
conditions, the web can be pretty far from instant. These are stats from
HTTP Archive, which has a corpus of
about 5 million URLs that it retrieves over the world
from a data center in the US. On average, it takes six
seconds before the web page even starts to paint. And it takes nine seconds
before users can even start interacting with the web page. And then when you
start to consider other areas of the world with
poorer connectivity, or sort of emerging, entry
level devices, it can be much, much worse. DION ALMAER: And
what's more, web pages are constantly getting
bigger, nearly doubling in size over the
past three years to an average total of 1.6 megs. BEN GALBRAITH: And we
found that users are really sensitive to loading speed. This is from a recent
study from the company SOASTA, the respected
performance testing firm. They found that even
just one second increases in loading times caused
big conversion decreases for developers. It's a really, really
important area. DION ALMAER: This is why
we've invested so much energy through the years in
adding new web platform features throughout the
stack that enable developers to improve the performance
of their sites, such as preload and prefetch,
to make sure the browser knows what to prioritize
for the current page and can fetch what
you think will be needed for the next one. BEN GALBRAITH:
And the developers who take advantage of
all these improvements that are landing in
the web consistently see big, big gains. For example, Wayfair,
the popular retailer, recently optimized their
site and saw a 10% increase in their year-over-year
conversion rates. And Times Internet did
a similar optimization and increased their average
session duration by 31%. We used to work in
retail and fight for basis point improvements. DION ALMAER: That's
a big improvement. BEN GALBRAITH: These
are massive gains. And again, it's
consistent whenever developers put in this effort. DION ALMAER: For example,
we spent a bunch of effort over the last year optimizing
Chrome's initial page load performance. And you can really see these
gains on entry level Android devices where we've gotten
it down to half the time. Much of these gains are
powered by improvements we've made to V8, our
JavaScript engine. And this is so important,
because JavaScript size has grown 50%, as well. And it's great to see new
features that developers seem to really like,
like async/await, really got a lot faster
as the VM team really kind of supercharges it. BEN GALBRAITH: OK. A big part of the increase
that Dion was talking about comes from images. And you know images are great,
especially as our world becomes more visual, but they also
lead to a lot of bloat. For example, the average
page transfers 840 kilobytes of images, which is two
times bigger than it was three years ago. And so with this in mind,
we've added a new feature to the platform, lazy
loading, that helps. And it does this by loading
only the images that are required for the user to see. And it automatically manages
the loading of new images as the user scrolls. And it addresses two problems. First, it's just a waste of
data to send images down to user that they're never going to see. And two, we've found that mobile
entry level devices really struggle when they try to
download a lot of images simultaneously. They start to thrash. And it can lead to a really
sluggish experience for users. All you need to do is add
the new loading lazy tag to your image tags, and
Chrome manages the rest. It detects the connection
speed of the user to decide when to load, and it
retrieves the first 2 kilobytes of the image to figure out what
the size of the placeholder should be. We're also extending
this feature to iframes, so that they can also
be lazily loaded. And this is in Canary, and
you can play with it today. DION ALMAER: Great. So to help you keep up with all
of these platform improvements, a few years ago, we introduced
a tool called Lighthouse. It's built right
into Chrome DevTools, and it analyzes your
site to tell you exactly how to use all of
the latest of the platform's features to optimize
your site's performance. Once you do the work
to get your site fast, though, you want to
keep it that way. And with a large
team adding features, it's really easy to regress. What we're seeing with
successful developers are they continuously
measure their websites, and they set
performance budgets. Partners like Pinterest
and Uniqlo Canada saw an improvement in both
business metrics and user engagement when they
focused on performance and implemented budgets. So we love this
practice so much, we wanted to add simple
right into Lighthouse. And we did that today. It's really simple to set up. You get a configuration
in a JSON file, and you just set
different resource limits, or set different metrics
that you want to hit. Then take Lighthouse--
it's easy to integrate it into your continuous
integration server-- and that's it. So you can open up the
newest release of Lighthouse and start budgeting. BEN GALBRAITH: About
a year and a half ago, we released the Chrome
User Experience Report. This is a massive corpus
of Chrome performance data that tells you exactly how
your users are experiencing your site all across the world. And it also shows you how
your competitors are doing. We've been steadily expanding
this corpus of data-- it now has about
six million sites-- and you can get to the
raw data and explore it using Google Cloud's
BigQuery product. And we've also
been integrating it into our performance tooling,
like HTTP Archive and PageSpeed Insights. And we have a new integration
that we're announcing today on our Search Console where,
now, there's a new speed report that gives you
insights at the URL level and also gives you aggregated
information about how groups of pages can be improved. DION ALMAER: And then to go
even deeper on your sites, the Firebase team announced
Firebase Performance Monitoring earlier today. This lets you instrument
your own sites together in even wider array of real user
metrics, and it's all for free. BEN GALBRAITH: There's one
more small performance feature I want to tell you about, and
it's called Paint Holding. To understand this
one, we need to look at one of my favorite sites. I don't know how to
pronounce this, actually. DION ALMAER:
A-wuh-wuh-wuh-wards? BEN GALBRAITH: Awuh-awards. I think it's Awwwards. It's a fantastic award
site for web design. It's really fast,
which is great. But there's this
white flash when you transition between pages,
which is really annoying. Take a look. I'm going to play it now. We click on the Performance
Center, and you get the flash. So this is actually a
feature, from our perspective, the flash you just
saw, because we want to show the user that
Chrome is being responsive and that we're going out
and we're loading the page. And so we immediately
clear the browser as soon as we start
that process to show you that something's happening. But in this case, it happens
nearly instantaneously. And so the flash is
just really annoying. So with Paint Holding,
we now look at the page that's being loaded. And if it's responding
fast enough, we get rid of the flash. So I'll replay the video
with this feature turned on, and you'll see a really
seamless transition. So this flag is available
in Canary today. So this is just a
highlight of the work that we're doing to make
the Web more instant. We'd also like to preview a
couple of longer-term efforts that we have underway
that have the potential to take the web much
further in this direction. And to talk about
one of them, I'd like to invite Barb
onto the stage. Please welcome Barb. [APPLAUSE] BARB PALSER: Thank you, Ben. Hi, I'm Barb Palser. I work on the Chrome and
Web Partnerships Team helping partners test
new web capabilities. And one of the things
that we've been working on is a new page
transition experience. Today, as we click
through links, we feel the transition
of leaving one site and moving to the next. And when an iframe loads,
it's a window to another site, but you can't go through that
window to the other site. Portals make that possible. Portals are like iframes
that you can navigate to. When a user opens a
portal, the portal becomes the top-level page. With associated APIs to
support free prefetching, enhanced transitions,
and the exchange of contextual
information, portals enable fluid, composed journeys
within or across sites. So portals are very new. And we have a demo to
show you why we are so excited about their potential. So we'll start at this
imaginary meal planning site, which aggregates
recipes from other sites. Now, the first thing
that catches my eye is this avocado toast-- naturally, we're
in the Bay Area-- but I'm looking for
a dinner recipe. So I will save this one to the
imaginary social site, Nom Nom. When I click the Share
button, the share card will open in a portal. I'm now on Nom Nom's domain,
but the meal plan site appears to persist
in the background. This is thanks to the
adoptPredecessor function in Portals, which allows the
origin page to share context with the destination page. So I'll save this recipe,
which will close the portal, so that I can keep browsing. Normally, each of the
recipes on this page might link directly
to a destination site. But here, they're
all embedded portals which, with the
help of prefetching, can empower developers
to build cool things, like this peaking
experience where I can preview a
page on another site while I'm still on
the meal plan site. And when I finally find
a recipe that I want and click through to get
my ham and spinach sammy, this portal transition is
so smooth you don't feel it. But here we are on another site. So this recipe looks great. I'd like to buy the ingredients. This recipe site is now ready
to hand off my shopping list by zipping through another
portal to a grocery site where I can check out. Now, this shopping list
handoff was accomplished by another function called
PortalActivateOptions, which sends information from the
origin page to the destination page. This animation could also
be a nice distraction, if you're waiting for the
destination page to render. So at the end of
this journey, we have used four creative
portal transitions across four sites in one
composed instant experience. Now, portals also have a very
strong single-site use case, enabling the smooth transitions
of a single-page app without having to re-architect
a multi-page website. So here, we've built a-- oh, if I can go back
and show that video-- so I may go forward, back to-- there we go. So I hope we can
see the animation. There we go. So here, we've built a demo for
Hatena and [NON-ENGLISH] web comics, the Japanese
manga brand, showing these SPA-like
transitions on their multi-page site. So we have just
launched the Portals API as an experimental feature
behind a flag in Canary. And we're really eager for
the developer community to uncover new use
cases for Portals and also share your
feedback with us. So now, I will
hand it back to Ben for another part of
the instant web vision. [APPLAUSE] DION ALMAER: Thanks, Barb. BEN GALBRAITH: Thanks, Barb. So we've got one more standard
we want to talk to you about. This one's called Web Packaging. So with Packaging, the
model for loading web pages changes from today's
model, which we all understand, where the browser
requests a page from an origin server, to a new
model where developers create a signed package
that contains the page. And the browser can load
it from anywhere, even potentially other peer devices. And this can enable
privacy-safe preloaded models because the data to
fetch the package doesn't go back to
the origin server. And it gives the browser
tremendous flexibility to preload pages
more of the time. The first phase of Web
Packaging, signed exchanges, is available in
Chrome Canary today. And we believe, when you look
at the emerging Web Packaging and Portal standards, they
have potential, over time, to enable a more seamless
instant web with packaging enabling privacy-safe
preloading and portals enabling seamless transitions. And we'd love your
feedback on both. OK. Now, we'd like to shift
gears and talk about some of what we're doing to
make the web more powerful. DION ALMAER: That's right. Fast, instant loading is
a really exciting vision and magical when it works. But it's only the
beginning of the story. What really matters
is what the user can do once the website is loaded. New capabilities for the Web are
regularly becoming available. And over the past year,
we've continued our efforts to expand what's
possible on the Web, rolling out APIs that bring
powerful capabilities to you. So when I think
about cool websites, I normally think
about movie websites. So maybe we should
see someone using the real power of the web? BEN GALBRAITH: Some
big motion picture from this year to see how they
really merchandise the move. DION ALMAER: A popular movie. Yeah. BEN GALBRAITH: Well,
let's take a look at one. DION ALMAER: I meant "Avengers." I meant the-- uh-- BEN GALBRAITH: That may not be
what we had in mind, actually. This is the "Captain
Marvel" website. It kind of fits the
30th anniversary theme. You've got a nice MIDI file
playing in the background. DION ALMAER: It's very retro. It's very like retro. And I love how quirky
and fun the web can be. Well played, Marvel. But seriously, what can you
do with the new platform capabilities? To show us a real example,
let's welcome Paul to the stage. BEN GALBRAITH:
Please welcome Paul. [APPLAUSE] PAUL LEWIS: Thanks, chaps. Hi, everyone. I'm Paul Lewis. I'm a software engineer
on the Chrome team. Now we've been thinking
about the camera, how developers use it, and what
that could mean for the web. Because I think most of
us are used to the idea that you can get
links from a web page. But what if you could get links
from objects in the real world? Because many of them
have QR codes, bar codes, product logos, images,
and that kind of thing. And it's the case that when
you're in, say, in a store, and you're looking at a product,
rather than thumb typing, if you could just hold the
product up to the camera and get some information
inside of the PWA, that would be really useful. And it's that kind
of scenario we've had in mind as we've
been working on a thing that we call the Web
Perception Toolkit, which I'm going to try and give
you a demonstration of now. So if we could switch
across to the device. Marvelous. OK, so what I have here is the
I/O Web Sandbox Scanner PWA. Quite a mouthful, I'm
sure you'll agree. But what it lets me do
is it lets me scan items from our sandbox out there. I also have something that
I actually really like, which is this 3D printed
Chrome dino thing. It's amazing. Do I want this? Yes, I do. [LAUGHTER] Right? Marvelous. And it has a barcode. So what I'm going to do is
I'm going to start this up, which is our scanner. So this is using the
Web Perception Toolkit. First thing it does
is it starts up a camera feed and a couple of
detectors in the background. So what I'm going to do is
I'm going to try and scan the barcode, if I can, with
the lighting being as it is. There it is. OK, so it's detected
the barcode. And you can see it's put
this card on the screen. Now, that's not magic. I've already told the
Perception Toolkit what I'm looking for by
putting some structured data inside of the PWA. I've told it what
I'm looking for and what I want it to put in
the card when that's found. So I've given it the
image, and the title, and so on, and so forth. This card that you're seeing is
also part of the Web Perception Toolkit. Now, in order to
do the scanning, we use the Shape
Detection API, which is a brand new Web
Platform API that lets you do QR code and barcode
detection, as well as face detection and text detection,
if your device supports it. But it's a brand new
API, so it might not be available everywhere. So in that case, we
also use WebAssembly to provide the same QR code and
barcode scanning functionality. So we're maximizing
support and performance by doing it this way. So from here, I can, say, go
into the details of the thing that I scanned. And if this was a
shopping experience, you could imagine I could
add to cart and go on my way. Now, that's one thing, but
what we also wanted to do was to be able to
support images. So I'm going to scan
something else for you. So I'm going to go out here,
and I'm going to scan again. Now, what I have here on my
I/O badge is the Squoosh logo. Squoosh is a PWA that we
announced at Chrome Dev Summit last year. I put the sticker
on my badge, and I'm going to try and see if
I can get it to scan, which it just did. That's pretty cool. Again, it's the same
kind of structured data that's in the PWA
that's actually identifying this logo for me. So from here, not only can I
view details as I did before, I can also launch it,
because it's an app. Off we go to our PWA. And we're happy, and
we're on our way. Right. That's the end of the kind
of official demoey bit, except, well, I want
to do bonus round. Huh? What I want to do is show you
something a little bit extra that I put in in the
last couple of days. So you heard Barb
talk about Portals. And up until a
couple of days ago, I hadn't had a chance
to play with it. And I thought, I could
add it to that PWA. LOL. That'll be a great idea. If you're up for it,
I'll show it to you. So are you up for it? AUDIENCE: Yeah! PAUL LEWIS: Yeah. OK. This is what's known as
a high stakes maneuver, because I'm going to be loading
Chrome Canary, with flags, in a keynote, in front
of a lot of people. So if it goes badly,
it never happened. The official demo was
amazing and flawless. If it goes well, we
holler, we cheer, we high-five, and we
call this a good one. Does that sound OK? AUDIENCE: Yeah. PAUL LEWIS: All right. OK. Here goes. So what I'm going to do is I'm
going to go to Chrome Canary. Same PWA that you saw before. Start scanning. Here we go, initializing
the detector. And it detects it. Now, watch what happens
when I tap the Launch. Here we go. Flips over. I went into squoosh.app. [APPLAUSE] [CHEERS] So if you don't have it, you
just get the normal experience. If you do have Portals, you
get that wonderful transition. And with that, I'll say-- wait, can we go
back to the slides? Yes. [INAUDIBLE] next. Marvelous. So if you've enjoyed that and
you want more information, do check out the website,
which is perceptiontoolkit.dev. Or come and see us in the
sandbox over the next few days, and we'll run you
through all the things that we've been working on. Thank you, very much. [APPLAUSE] BEN GALBRAITH: Thanks, Paul. DION ALMAER: Thank you, Paul. BEN GALBRAITH: OK. So Paul mentioned
how they are able use WebAssembly to
provide compatibility when some of the APIs they
needed weren't available. I wanted to show you another
example of a Google property that's been using WebAssembly
for a fantastic desktop experience. This is Google Duo. It uses the Modern Web Media
stack for video capturing streaming, of course. But it uses WebAssembly to
bring their native library for Echo detection
seamlessly to the web. And it can be installed and run
in its own top-level window. DION ALMAER: With web apps and a
lot of momentum now in desktop, we wanted to improve
the discovery flow and make it easier for users
to install their favorite web apps right to their desktop. So starting in
Chrome 76, Chrome's going to be showing an
installation prompt right within the Omnibox for PWAs
across all desktop platforms, as Hulu shows here. PWAs on desktop
came to Chrome OS first late last year
to enable web apps that need full Windows support
and common desktop app capabilities. Today, we've
extended that support to Windows, Mac, and Linux. And we love how
web apps fit right into these desktop
operating systems. BEN GALBRAITH:
Also happy to share that Slack is embracing this
new desktop installation model. And they're rolling out an
offline-enabled web-powered version of their desktop
app later this year. And our own Stadia
service, while we're talking about desktop, was able
to use new capabilities that have recently come
to the Web Platform to use full access to the
keyboard and the mouse and to have low latency
controller support, really challenging
our notions of what's possible in a browser. DION ALMAER: And
we're still making lots of integration
improvements on mobile too. We launched Trusted Web
Activities to give developers the best way to put full-screen
web content into an Android app. OYO Rooms, which is India's
largest affordable hotels network, use Trusted
Web Activities to power a light version of
their experience, which is a common pattern that
we're seeing with partners in certain markets. Their web team had already
built a high-quality PWA that they can then
easily leverage. And we continue to bring
core capabilities to mobile. Here, we see the
Indian company, Myntra, sharing products
with their PWA, using Android's native-share-sheet. And the Twitter PWA uses
the Web Share Target API to tell the system that
it can accept the shared link. BEN GALBRAITH: Dion's
talking about Twitter. What I love here is
it shows an example of the full progressive
web app vision. Because from a single
code base and experience, they're able to scale across
the full spectrum of devices, going from feature phones all
the way to high-powered desktop devices. DION ALMAER: It's the dream. BEN GALBRAITH: It is
the dream, my friend. And speaking of
feature phones, we've noticed that a certain class
of web-enabled feature phone are becoming very popular
in emerging markets. And as we saw this
trend, we asked ourselves how far we could push it. And so we decided
to try and create a really rich game using the
web that would run really well on this form factor, as
well as larger form factors. DION ALMAER: And with the whole
30-year anniversary theme, it was a good
excuse to look back. And I don't remember about you,
but I wasted quite a few hours playing Minesweeper
back in the day. And so it got us thinking,
what would a 2019-- BEN GALBRAITH: We have
a fan in the back. DION ALMAER: We've got
a fan in the back-- Minesweeper. It teaches you how to-- yeah. What would a 2019 version
of Minesweeper look like? We call it Proxx. So this game here, for us to
hit our performance budget, we wanted to use libraries to
be productive, but also small enough in size. So this led us to be
using Preact for our UI, Commlink to help us use workers
to do more off the main thread, and Rollout to
deliver type builds. Proxx loads incredibly
fast, as it only needs 18k to be interactive,
which is actually a lot smaller than the original Windows game. BEN GALBRAITH: That is amazing. DION ALMAER: Yeah. And it also supports
the feature phones that Ben was talking
about earlier. At the same time,
we want visuals that you can expect
from a modern game that runs at 60 frames a second. And we want people relying
on assistive technologies to be able to enjoy
our game, as well. So we made accessibility
a first-class citizen. So did we succeed in building
an interactive game that works across all devices? You be the judge. Go to proxx.app to play. And you can find all
of the source code available on GitHub. And then to see
how this was built, join the team that made
it during their session on Thursday. BEN GALBRAITH: We're
also working to integrate the web with Assistants. And to show some of
what we're doing, I'd like to invite Dana to
the stage to tell us more. Please welcome Dana. [APPLAUSE] DANA RITTER: Thank you, Ben. Hi, my name's Dana Ritter. I'm the product manager
behind the technology that Sundar introduced earlier
today, Duplex on the Web. Duplex on the Web
is the technology that helps you get things done. But it doesn't only help
you get things done, it can also help you get things
done in your own language. This is extremely
interesting, when we consider the many,
many people coming online that interact online and
interact in the internet, but not on predominant
languages that are supported. Consider for a moment there are
approximately 500,000 people speaking Hindi that are online,
but not very well-serviced by the set of e-commerce sites
that are available to them. I'd like to show a demo
from Xiaomi, a leading smartphone brand in India. And on this basis, you'll
see what we can provide. Imagine for a moment I'm
a Hindi speaker in India. Ideally, I would like to be
able to search, browse, and buy all in my own language,
even if the underlying website's in English. So first, search. As you can see, we
already support Hindi from a searching prospective. Now, I can come with
Google Shopping in India, and I can browse the
power bank I want. Here, we'll choose
the second one. Google Shopping will provide for
me details of that power bank, partially translated
right now in Hindi. We're working as we speak on
the entire experience being translated. And to complete
the cycle of buy, that's where Duplex
on the Web steps in. This blue button here,
translated, says fast checkout. Once I click that, Duplex
on the Web opens Chrome, goes to the underlying
website from Xiaomi. It's in English, as you can see. But Duplex on the Web
will help me in Hindi. I can see all my information. I can see the product
I'm interested in. Looks good. I'm going to check out. As you move forward,
Duplex on the Web leverages Chrome, the
information that's stored in addresses and
payment information, to navigate all the
cumbersome forms. Of course, we adhere, as
well, to all the privacy and security concerns
that are extremely important from a
Chrome perspective, as well as from the website. Here, I'll have to enter my
security code for my credit card. I enter that
information, but I'd like to see a summary of my
purchase before I'm done. Duplex on the Web navigates to
the site to show me my summary, the summary of the purchase, tax
total, sends me a notification, and my power bank is on the way. This technology we're very
excited to bring to users, partners, and web developers. Specifically for web
developers, you'll be able to go to
the Search Console to see the status
of your site, as it relates to Duplex on the
Web, the relative health. You'll also be able to provide
a test account for Duplex on the Web to understand
what your site looks like beyond the login. That helps increase the
quality of the experience for your users. And finally, we also
offer additional control for web developers for
configuring the robots.txt file to be able to restrict
different parts of the site, if that's something
that you'd like to do. As Sundar said
earlier today, we'll carefully roll out
this technology-- first in the Showtime space
and rental cars. And that'll be followed on
by a shopping experience, much like you've seen here. Thank you very much. Ben, back to you. [APPLAUSE] BEN GALBRAITH: Thank you, Dana. It's fantastic to see
the Assistant open up parts of the web to even more of
the world with the translation capabilities. So we've talked about a
bunch of new capabilities that the web now has. And more capabilities
are coming. There's a steady stream of new
capabilities in the pipeline. These are just some
of my favorites. Can't wait to have native file
system access, the ability to expand quota, contacts
picker integration, the ability for web apps to
integrate with MIME-types in the OS, SMS-based
authentication, and more. And these are really going
to take the web even further towards this vision we have of
linking everything together. As we bring these
capabilities to the platform, we often compare
it to a fugu fish, because fugu fish can be a
really delicious delicacy. Unless it's prepared wrong,
in which case it kills you. And so as we thread the needle
on the web between power and safety, we're very
mindful of the need to preserve what makes the
web greatest of all, which is that it has safety
designed first, to keep users safe as they
navigate and explore all across the world. So this is a good
opportunity to transition to the last section of our
talk, and share what else we're working on to keep users safe. Of course, this has always been
a big focus for us at Chrome. When we first rolled, out we
had the auto-updating feature that was, if you remember,
controversial at the time. Anyone remember how
controversial that was? Surely the Minesweeper
person can give me a little bit of a hand. It was a really
controversial feature, and we did it because we wanted
to make sure that users always had the latest security fixes. We also have features
like safe browsing to protect users
against known bad sites. DION ALMAER: And
then since last I/O, we rolled out site
isolation, a major update to Chrome's multi-process
architecture. Chrome's always put
tabs in its own process, both for stability and security. But site isolation takes
us to the next level by isolating cross-domain
content within a page, as shown here on this
iframe, into its own process. This aligns the OS process
boundary with the web security model. We also rolled out the latest
phases in our multi-year effort to move the web to HTTPS
by default, flipping the UI model around URLs to one
where we assume HTTPS as the [INAUDIBLE],, and
warn the user when its HTTP and when they're at risk of
sending data in the clear. Over the past three
years, we've seen HTTPS page loads on
Windows go from 42% to 82%, which we think is a significant
security and privacy win for users on the web. And it wouldn't be possible
without the broad community, such as the Let's Encrypt . Initiative. BEN GALBRAITH: So
we've also been working to address user feedback
about tracking on the web. And as we do that, we've
been focused on giving users transparency and choice over
how they're tracked on the web through easy-to-use controls. We want this to be a powerful
and very useful feature, and so we're working with
users to get this right. And we'll preview user-facing
features later this year. Today, we're sharing
our plans around changes to how cookies work in Chrome
to support transparency and control features
in browsers. Let me explain. So today, when we, as
developers, set a cookie, it's visible, by default,
in both first-party and third-party contexts. Now, this enables tracking. And it also leaves
cookies that were really intended for use only
by the same site exposed more broadly, by default. It also means that browsers
need to rely on guesswork, based on observing how
cookies are accessed, to understand both the
intent of the developer and to provide transparency to
users as to what's happening. Moving forward, Chrome will
make all cookies limited to first-party
context by default and will require developers
to explicitly mark a cookie as needing
third-party visibility, which creates a clear distinction
between first-party and third-party cookies and
enhances web safety. As a developer, to make
cookies third-party visible, you just need to add a new
setting, called samesite none to the cookie. Later, we will also require
that third-party cookies only be served over HTTPS
connections, which further enhances web security. Both of these states
are available now for testing in Chrome
Canary behind flags. And you can see web.dev
for more technical details. We'll roll out these changes to
users over the coming months, starting with the first-party
cookie change I just described, and later with
the HTTPS requirement for third-party cookies. Now, some developers
attempt to track users with a technique known as
browser fingerprinting. This involves looking at
things like HTTP headers or invoking JavaScript APIs to
build a profile of what makes the user's browser unique. And then you can use this to
create a type of signature that you use to
follow the user around as they navigate the internet. We see these efforts as
subverting user choices about tracking. And so Chrome is
announcing that we will work to block fingerprinting. And we'll share more details
in the coming months. But we're sharing this now
to make clear our commitment to user privacy. As we make these
and other changes, we're taking care to preserve
the health of the web ecosystem, but we're
also clearly putting users first, and their choices. We see this as a journey that's
similar in scope to what Dion described earlier, wit
moving to HTTPS by default, . And we'll work with the full web
community to refine our plans. And we need your feedback to
make sure we get this right. DION ALMAER: So phishing is
a major problem on the web. And we've been working with
the FIDO Alliance and the W3C on a new web standard to help. The result is
WebAuthn, which brings two-factor
authentication to the web and can enable your
web apps to take advantage of modern devices
with hardware tokens built-in. A fantastic best
practice we're seeing is using biometric checks
on the device when users have previously signed in. In fact, here at Google,
we're rolling out support for WebAuthn
with passwords.google.com as a real authentication model. And this isn't just
about usability. Our friends at Yahoo! Japan shipped fingerprint
re-auth and improved time to signin by 37.5%. BEN GALBRAITH: OK,
so to wrap up-- speed remains
incredibly important. And take advantage of the
platform enhancements and tools that we've made to
move your site closer to an instant experience. And check out Portals
and Packaging, and give us feedback,
because we see these as having big
potential to redefine the future of an instant web. Capabilities of the Web are
expanding faster than ever. Take advantage of
the new features so that users can do more on
your site right in the browser and easily re-engage afterwards,
leading to higher conversions for your business. And prepare for the upcoming
privacy changes that are coming to Chrome, and
consider integrating WebAuthn into your site. DION ALMAER: So there's
so much good stuff coming, we really want to
help you keep up with the latest features and
best practices for the web. That's why we created a
new site, web.dev, to help. It's a straightforward
guide to teach you how to build on the modern
web, with interactive code labs on the most important topics. And with Lighthouse
integrated, we can help tailor the guidance
based on your websites and help monitor your
progress, including how to optimize popular
web frameworks like React, CMSs like WordPress,
all for top performance. Web.dev is here
to help you build the instant, powerful,
safe web that we hope to browse together. BEN GALBRAITH: You're
also all invited to join us in six months
at the Chrome Dev Summit in San Francisco
where we'll share more progress on these themes. DION ALMAER: And I think
we'll bring some avocado toast from the-- BEN GALBRAITH: I
was wondering if you were going to go for that line. Cool. Hey, have a great
I/O, and thanks for joining us this afternoon. DION ALMAER: Thank you. BEN GALBRAITH: Take care. [APPLAUSE] [MUSIC PLAYING]
