 Hello, everyone. My name is Rahul. I'm the product lead on Chrome. And I'm excited to be back up here again this year to tell you about all the amazing progress we've made over the last 12 months. The theme of today, and something you're going to hear again and again, is that the modern mobile web is now mainstream. And this is really an amazing shift. So I'm going to tell you all about what's been happening and what it all means for you. It's the mobile web state of the union. So let's dive right in. The web has incredible reach. Just Chrome alone runs on over 2 billion devices, from phones, to tablets, to PCs. And the web is much bigger than just Chrome. There are over 5 billion devices out there that can access web content. 5 billion, that is a large number. And this didn't happen because of luck. This wide reach is a direct consequence of how the web operates. It is an open, decentralized platform. It has no gatekeepers. Developers get wide reach. Users get low friction. And on the Chrome team, our mission has always been to move the web platform forward. We spent a lot of time working on making the web platform better, lots of things on the foundations, things that just happened under the hood that you may not even recognize. But with every such change, the web platform just gets better. To take one example, over the last year, we focused our JavaScript performance on real-world web usage. It's sort of like, what kind of car would you rather drive? A car that's been road tested in real-world driving conditions? Or a car that's been tested in an artificial lab setting? We want our car, and our JavaScript engine is literally called V8. We want our car to be great on the roads that people actually drive on. And currently, we think the speedometer benchmark, best captures this real-world usage. So I'm pleased to announce that Chrome on Android is now 35% faster on this speedometer benchmark compared to a year ago. And we've seen similar gains on other OSes as well. To take another example, I'm sure all of us have experienced the annoyance of loading a web page and starting to read some content, only to have it jump to a different location. And this usually happens because some off-screen content is loaded in and pushed down the visible content. Now, to improve this user experience, we launched a new feature called scroll anchoring. And scroll anchoring works by locking the scroll position to an element that is visible on the page so the user stays in the same position even as off-screen content gets loaded in. So to show you what this looks like in action, on the left is Chrome without scroll anchoring. And on the right is Chrome with scroll anchoring enabled. And this is a long page. And as we scrolled out on the bottom of this page, you'll see on the right, the page stays locked in position. While on the left, the page is jumping all over the place as off-screen content gets loaded in. Now, this is a bit of a contrived demo just to show you exactly what's going on. But since we launched this feature, what we have seen is that on average, scroll anchoring prevents three jumps per page load. So this has had a huge impact on the quality of the user experience. And there are many more such changes, things that don't need any action from developers or users, but that just make the web platform better. So that's the foundation. Next, come all of the features and APIs that enable you all to do great things, to build great experiences on top of that foundation. And today, I'm going to talk about the amazing momentum we've seen across the core pillars of the modern mobile web. I'm going to talk about what we are doing to make web apps more polished and feel more integrated into the device. And I'm going to talk about all the ways we're working on to make building web apps easier than ever before. So let's start with momentum. One of the core pillars of the modern mobile web is accelerated mobile pages, or AMP, for content-focused experiences. Now, we all know that content experiences on the web can sometimes be quite painful. And we spearheaded the AMP project last year, the open source AMP project last year, to improve this experience. And the benefits that AMP brings are stark. On average, an AMP page loads in less than a second. And it uses 10 times less data. And as a result, the growth of AMP has been phenomenal. Last year at this time, there were 125 million AMP documents out there. And today, there are over 2 billion AMP pages from over 900,000 different domains. Amazing momentum. And more and more platforms are now linking out to AMP's. And they're doing this because they find that their users are more engaged when they can get to their content faster. For example, LinkedIn has found that people will spend 10% more time reading an article when it's an AMP page versus when it's not. And today, I'm excited to announce that several new partners are going to be supporting the AMP project in the coming weeks. Twitter will begin linking out to AMP's across all of their mobile web and native app properties. Tumblr will begin using AMP for 300 million of their blogs. Webua will begin supporting AMP in the coming weeks. And Tencent's QZone will also begin linking out to AMP in the next few weeks as well. And finally, AMP is seeing success in new verticals like e-commerce. With components such as AMP Bind, merchants can build interactive and engaging user experiences, and many merchants are doing just that. So that's AMP, a great way to build content-focused experiences for the modern mobile web. The second pillar of the modern mobile web is progressive web apps or PWAs. Progressive web apps are a way to build app-focused experiences that are reliable, fast, and engaging. And we were inspired to start this journey based on our belief that web experiences can and should be radically better. And users love these experiences, which means that they are more engaged, which means conversions are higher, which means business metrics are better. So this is just a good thing all around. But rather than me tell you about how awesome progressive web apps are, let's take a look at one that just launched recently. It is my pleasure to invite up on stage Patrick Trauber and Katie Sievert from Twitter. Thank you, Raul. Hello, Google I.O. My name is Patrick Trauber, and I'm the product manager for TwitterLite. And I'm Katie Sievert, engineer on the TwitterLite team. Just five weeks ago, we launched TwitterLite for the goal of delivering a great user experience at scale. Sorry, one second. We set out to build a Twitter client that, one, loads quickly on slow networks. Two, uses last mobile data. And three, works on all smartphones. Each month, more than 300 million users come to Twitter to find out what's happening in the world. And over 80% of our users are on mobile devices. We were seeing healthy growth in mobile web usage at Twitter, so we wanted to make sure that this experience was top notch. But rather than just telling you about TwitterLite, why don't we give you a live demo? Katie, can you walk us through TwitterLite? Sure. Let's pull it up. When users visit TwitterLite on Android, they're prompted to add it to their home screen. In fact, TwitterLite receives a million visits each day via the home screen icon. Let's go ahead and launch it. As you can see, it initially launches us in full screen mode, just like a native app. And TwitterLite is optimized for speed, taking advantage of the purple pattern to improve loading times by 30%. And with service worker caching, reloading the app is near instant and consumes no additional data. As you scroll through the timeline, it's fast and smooth like a native app. And since many users come to Twitter to get the latest news and often tap on publishing links, we've been big fans of AMP. On that note, let's go take a look at what Owen with the Google team is doing. He usually tweets interesting articles. Let's check out this one. Well, we're excited today to announce that TwitterLite now links out to AMP pages so that content loads almost instantly and uses less mobile data. For example, you can see here that when Katie tapped the link to the Guardian post on Owen's profile page, it loaded instantly in a new tab. Now let's show off a couple of engagement features. One of the key pieces of a polished experience is making sure users can capture media and tweet it. So to make things a little more interesting slash exciting, what do you say about doing a live photo tweet from onstage? All right. It's like you knew I was already going to do it anyway. All right. With a disclaimer that I'm not a professional photographer, although you don't need to use Twitter, everyone strike a pose. All right. Enter that. So let's type TwitterLiteLiveDemo at hashtagIO17. Tweet, ah, success. So we see the tweet right there. Now half of the fun is receiving retweets. Oh, thank you. Yes, successful demos are always a plus wordy. Now half of the fun is receiving the like, that retweet after you've tweeted something. And one feature that's had a huge impact on this has been push notifications. So let's pull up an entirely not pre-can tweet notification. All right. So Marius liked one of our tweets. You can see mobile.twitter.com at the top. Click on it. Takes us right to that tweet. Now, notifying users about recent activity is key to bring them back in the app. So this has been very important for us. And since recently adding it, we have been sending more than 10 million push notifications a day. But I could keep going for a pretty long time. But in the interest of time and keeping things light, let's send it back to Patrick. Thank you, Katie. It was important for us to deliver a fast, engaging experience while consuming less mobile data. Twitter Lite already consumes less data as compared to our native apps. But on top of that, we launched a new feature called Data Saver. When a user is in Data Saver mode, they can save up to an additional 70% on their mobile data. Everyone benefits from lower data usage, but this is especially compelling for users in emerging markets. Now, Twitter Lite delivers all of the key features at a fraction of the size compared to our native apps. Here you can see the size difference of Twitter Lite compared to our Android and iOS apps. And of course, the mobile web is more than just a landing page. We're excited to provide a fast, feature-rich experience and our users from around the world, from Nigeria to Japan to Ecuador, the Philippines, they love it as well. And we see it in our metrics, too. We're seeing increases in pages per session and tweets sent from Twitter Lite. And like Katie said, we're seeing more than 1 million launches from the home screen every day. Most importantly, our users are happy. Twitter Lite is our new standard mobile web experience available to all users globally on Android and iOS. And we hope you check it out. Thank you. Thank you, Patrick and Katie. Twitter.com is a PWA, folks. The modern mobile web is truly mainstream. And it's not just Twitter. Last year, we talked about some early adopters of progressive web apps. And since then, the momentum and growth has been phenomenal. These launches are happening all over the world and they're happening across all industry segments. Large travel companies like Expedia and Trivago and Weego have all launched progressive web apps. Publishers like Infobay and Forbes have launched progressive web apps. Forbes has seen their user engagement double since the launch of their progressive web app. E-commerce sites like Fandango, Rakuten, and Alibaba are all investing in PWAs. And even new services that we tend to think of as app only like right sharing services have gotten in on the action. Lyft launched their progressive web app last fall. And OlaCabs, India's largest right sharing service, just recently launched their PWA. And in fact, Ola will be up on stage in just a bit to show it off to you. Now, one reason progressive web apps are so successful is that multiple browsers are committed to them. So while developer adoption is growing, so is browser support. And if a browser you care about isn't on this list yet, progressive web apps are designed to work well everywhere. So you can always count on reaching the users that are important to you. Take the example of luxury cosmetics brand Lancome. Lancome recently launched a progressive web app. And it works great on all browsers. And they're seeing great stats. But what I want to call out here is that iOS is particularly important for Lancome because 65% of their mobile web users are on iPhones. And what Lancome observed was that those iOS users have a session length that is now 53% higher than it was before their launch. And this is despite the fact that some PWA features are not supported on that platform. Now, the progressive and progressive web apps really refers to progressive enhancement. But what it really means is that you can count on reaching the users that are important to you no matter what browser mix you care about. So the momentum and growth across the core pillars of the modern mobile web, across AMP and progressive web apps, has been truly incredible over the last 12 months. The modern mobile web is now truly mainstream. Now, while all of this momentum is happening all around us, we have been heads down working on making progressive web apps even better. Our goal is to make web apps feel more integrated into the overall device so users get a robust, no compromises experience. How are we doing this? We're adding a lot of new APIs to the web platform. In fact, we added 250 new APIs just since Google I.O. last year. But what's really important is not the number of APIs we ship. What's really important is what use cases can these APIs unlock for you? And I want to talk about three use cases today. Installing web apps to your device, paying for things on the web, and polished media experiences. Let's start with installability. We already have a way to add web apps to your home screen, but we've made it a lot better. Now, first of all, we've heard from many of you that you would like the install prompt to be more reliable and predictable. And we've heard your feedback loud and clear. So I'm happy to report that now you can show the install prompt to your users when you want. And once a user has installed your web app to their device, it shows up every way you expect an app to show up. They show up in the app launcher, not just the home screen. They're integrated into Android settings. They participate in the Android intense system, like alongside any other native app. They can handle notifications natively rather than through Chrome. And web apps can launch in full screen mode, just like any native Android app can as well. So it's easier than ever before to install web applications to your device. So from installing web apps to your device, let's look at our second use case, paying for things on the web. Mobile payments are a big deal. Mobile commerce was worth $123 billion last year, just in the US alone. And to make payment flows on the web better, we launched a one-tap payments API called Payment Request. And it works with credit cards. And it works with Google forms of payment, such as Android Pay. And many merchants are actively using this API today. But we know that credit cards are just part of the puzzle here. People have lots of different ways to pay for things. And we want to make sure that a user on the web can pay for things using the payment apps they already use. So I'm very pleased to announce that now your website can integrate with any supported payment app using Payment Request. So if a user has a native payment app installed, you can integrate that right into your payment flow on the web. We're already working with Samsung Pay and Alipay. And many other native payment apps will be integrated very soon. And it's not just native payment apps. We want web apps to be integrated as well. And we're actively partnering with PayPal to bring their web app right into Payment Request. So we want to make sure that the entire third-party payment ecosystem is available for you in your checkout flow on the web. So from installing web apps to your device and payments, let's look at our third use case, media experiences. Media is important. Over 70% of internet traffic is video. And so it's important to us that we deliver a complete solution for media on the mobile web. Now, we've been working on adding many new APIs, things like the Media Sessions API, Background Fetch, Fullscreen, Orientation, and many others. And we put together a sample app to show you the kind of media experiences that are possible using these APIs. And so let me walk you through some of the highlights. First, as you can see, I've installed the app to my device. And when I tap on it, it launches in fullscreen mode with a splash screen. And app branding is front and center. There's no Chrome UI anywhere here. And when I tap on a video to play it, oh, actually, when I scroll up and down, you can see that the app feels smooth and fluid and just works in a very polished way. And when I tap on a video to play it, it plays back instantly. And this is not because the Wi-Fi is really good. It's because we prefetch the first few seconds of video so that we could enable instant playback. And if I just flip my phone over, it'll instantly enter fullscreen mode. And you can see this video has custom controls. So I can go backwards and forwards 30 seconds. And as I use the scrubber, you see thumbnails start to appear. And if I lock the device, you can see the background poster image. And you can see media controls appear right on the lock screen. And this could be really useful, for example, if I'm listening to audio on my morning commute. And finally, this all works really well offline as well. So if I go into airplane mode, I can view videos that I've previously saved for offline viewing. And I can tap on it. And I can play the video while I'm offline. All of this goodness is available on the mobile web today. So from installing web apps to your device, to paying for things on the web, to polished media experiences, we are working hard to make using web apps a great experience. We're also working hard to make building web apps a great experience. So here's a question. How good is your current web app? And how do you even find out? To help you answer that question, we launched a tool called Lighthouse. Lighthouse guides you along your PWA journey and runs over 100 audits against your web app, checking everything from page performance, to byte efficiency, to accessibility. And it even gives you a score from 0 to 100. So if you want to brag about your great Lighthouse score on Twitter, you can. It really does seem to get the competitive juices flowing. And we want to take all of the goodness of Lighthouse and make it as easy for everyone to use as possible. And so we're integrating Lighthouse right into Chrome Developer Tools. So you can just open it up, and you see a Lighthouse audit right there. Whether you want to tweet your score or not, I'll leave up to you. So how do you get a great Lighthouse score? Well, for one thing, your app will need to work well when you're offline or on a flaky network. And there's a powerful technology baked into browsers called Service Worker that enables this. But Service Worker is quite a low-level API and can be hard to work with directly. So to help you take full advantage of the power of Service Worker, I'd like to introduce Workbox. Workbox is a tool that we have built that enables you to get the most out of Service Worker. It builds upon existing tools, and it simplifies the number of common patterns and best practices, things like flexible caching, a managing background sync, or even collecting usage stats when the user is offline. And Workbox is completely modular and flexible so that you can just take Workbox, integrate it into your existing tools, and start using it right away. But to really max out that Lighthouse score, your app will need to do more than just work offline. It'll need to be fast. And this means that you need to be able to build and load your rich, complex application with as little extra overhead as possible. Web components are a way to build lightweight, reusable pieces of your app with very little overhead. You can create your own components, or you can reuse one of the thousands of components that already exist. Remember those amazing AMP performance numbers? AMP is based on web components. And just like we built Workbox to help you get the most out of Service Worker, we built Polymer to help you get the most out of web components. And I'm happy to announce today the launch of Polymer 2.0, the next major evolution of the Polymer library. It is a ground-up rethink that is built to take full advantage of the best new features of the modern web platform. It uses the new web component APIs that have shipped in Chrome and Safari. It embraces ES6 classes. It is completely modular. And best of all, it's 10% faster and 80% smaller. So to take a look at someone who has used Polymer to build a great progressive web app with a great Lighthouse core, let me invite up on stage Deepika Kapadia and Ratul Roy from OlaCabs. Thanks, Rahul. Hi, everyone. I'm Deepika Kapadia, head of Consumer Web Products. And I'm Ratul Roy, principal engineer. We are here all the way from Bangalore and really excited to tell you about Ola and our PWA. Ola is India's largest ride-hailing service with a mission to provide mobility for a billion Indians. We started six years ago out of a little apartment in Mumbai. And in those days, our co-founders would actually drive customers around when their ride didn't show up. Today, we do over a million daily rides. But even that's not enough when your mission is to move a billion Indians around. In order to do that, we needed to reach tier two, tier three cities, smaller cities with flaky networks, where users have low-end smartphones with slow processors and low memory. It's to reach this audience that we built our PWA. We'd love to show you what we've built. So let's go to demo with Ratul driving. Ratul, let's assume we're back in Bangalore after an awesome IO experience and need to get a ride from the airport back to the office. Will you book us an SUV? Sure, Deepika. I'm launching the Ola PWA from the home screen. It's fast, isn't it? It's asking for the browser location permission. But I'm going to go ahead and choose all the location from my saved favorites. So I'll be taking a cab from the airport. The reason I could do it so fast, because I've saved all the location as my favorites. But if you haven't, still you can go ahead and either search in the address bar for the location, or you can load it in the map and navigate through. If you have noticed, in order to save data, we load the map only when you need to. Here are the rides, Deepika. You have an SUV available in five minutes. Cool, but what kind of a ride are we going to get? Sure, have a look here. Sweet, I think extra leg room after this long flight back fits the bill. Sure. So guys, so far you've seen that our PWA is an immersive, full-page experience that's responsive to the touch, loads really fast, and supports back button navigation, much like a native app. So what do you say, guys? Shall we book a real-life cab in Bangalore? It's about 5 a.m. there. Awesome. Rathul, do the honors, please. Sure, let me try. I'm confirming the booking, Deepika. Go for it. Oops, there you have it, guys. This is a real-life booking in Bangalore that we just made. Thank you so much, Rathul. Sure. Nothing rigged here. You better cancel that booking before he gets mad and shows up. I just did it. I saved some money. Awesome. OK. So the OLA PWA is only a half meg, of which the application code is just 200 kb. So how did we build this really performant app with such a small size? Let's look at that. First, we used the Polymer framework, which leverages Chrome or other browser resources and gives us blazing fast web components, DOM and CSS encapsulation using Shadow DOM, and HTML import for a very efficient 40 kb. Next, let's talk about those fast load times. What you saw right now in the demo was the repeat cached experience of the home screen. But we have a really enviable first load time of one to three seconds, depending on the network, including low 3G, which is where our target audience lives. Let me show you how. As you can see on the left side here, we load our web components very strategically using a waterfall model so that we're only fetching those components that the user needs to see for his first interaction with our PWA. We're fetching in the background the other resources he needs to ensure that the experience stays snappy going forward. Once we've loaded all the components, using Workbox, we pre-cache all of these so that the repeat load time stays under a second. From this point on, the only server call that we are making is to fetch data, such as real-time cab availability, making a booking, et cetera. All of this stays under about 5 kb. We also leverage Lighthouse and web page test. And we are planning to integrate Lighthouse in our build, because obviously we'll add more features to the app. So here you can see our Lighthouse score. We are very, very proud of this score. We optimized for a perfect score. And we can totally relate to developers wanting to tweet and brag about theirs. So how's our PWA doing for us? Well, we've been out for about a month now. And we are seeing that our conversion or rides booked in tier two cities is comparable to our native app. But what's great to see is that in tier three cities, smaller cities, our conversion is actually 30% higher than our native app, which shows that clearly we are solving for network issues and the need for low data usage, which is inherent in these geographies. We've also seen mobile traffic increase by 68% in these cities since we launched, which shows that we are expanding our reach. But what surprised even us is that 20% of our PWA bookings comes from users who have previously uninstalled our native app. So this shows that our PWA can even be a great re-engagement tool. So there you have it, guys. Our PWA has been a win-win for our customers and for Ola. So I hope sharing our journey inspires many of you to build your own progressive web app. And the next time you're in India, remember to book your ride on Ola. Thank you. Thank you. Here you go, Rahul. Great. Thank you, Deepika and Rattle, and congratulations to the team at Ola. So folks, there you have it. Amazing momentum on the core pillars of the modern mobile web, AMP and PWAs. New APIs, unlocking new experiences, and new use cases, everything from installing web apps to your device to paying for things on the web to polished media experiences. And looking ahead, computing continues to evolve at a fast clip. And we at Google want to make sure that we can help developers take advantage of these changes, whether they're building native apps or building for the web. And just like we do with native apps, we want the web to be a great platform for future technologies as they evolve. One such future technology is VR. Virtual reality enables a creation of richly imagined worlds that you can fully immerse yourself in. And through the WebVR API, all of this expressive power is available on the web. WebVR enables companies like within to showcase these amazing VR explorations from creators around the world right in your browser. WebVR enables companies like Sketchpad to bring you these amazing stunning VR scenes to explore. They have over one and a half million of these. Now, these would be truly mind-blowing if you all had VR headsets on, but you get a sense of what is possible. WebVR is now fully supported in Chrome. And most major browser vendors have announced their support as well. And looking even further ahead, we see the advent of AR, augmented reality, a way to connect information to the physical world. So no matter how computing evolves and changes in the future, the web will always be here as a way for you to reach your users at scale. If you want to dig in more, we have a lot of great sessions on the mobile web at IO this year. And even after IO is done, come and talk to us. Tell us what you're working on. Tell us what your challenges are. We are here to help you be successful on the web. It's amazing to see how far we've come over the last 12 months. The modern mobile web is now mainstream. And I can't wait to see what happens in the next 12 months. Thank you very much.