 Hey folks, welcome back to the Progressive Web App Summit. I'm Rob Dodson. We're here in beautiful actually sunny Amsterdam today I'm joined with Andrew Mori. He's the director of engineering at conca conca is Nigerian e-commerce company and just give a talk here at the summit and Andrew I was kind of curious so one of the things that you really focus on in your talk is There's cost of data in emerging markets And I was wondering if you could just just talk through that a little bit I know there's a lot of folks who might be in in Western markets They don't even think about what it costs to use data on their phone But how is that different if you're in a place like like Nigeria or India or some other market? Yeah, sure. Hello So originally as a startup we we started a a response of web a response of web app that What sort of work it works well on 3g and Wi-Fi connections But as we started paying attention to our users We had a good look at our at our metrics in our CDN and we noticed a very interesting stat which said that The average transfer rate of data coming out of our CDN is exiting at about 250 kilobits per second Which is pretty slow if you think about it And then we we had to think about that and we looked we looked at our current approach to our mobile web and we noticed how big our pages were and The fact of the matter is that if you try our homepage was 2.5 megabytes at a specific point in time And if you think about how long it'll take at a rate of 250 kb per second You'd end up waiting 40 50 seconds to load the homepage and most users in the Western world would long drop off But in Africa we have a slightly different scenario. The fact isn't there isn't that much choice There isn't you can't just go to a brick-and-mortar shop. So people are pretty persistent and you know, you know respect to our users who have pushed through that but we owe them some sort of improvement and I Think one of the one of the big points that came out of our usability tests was we'd seen a user Searching for a product and as he'd seen that search result as he started scrolling. He said hey Hey, I can't actually do this. This is going to cost me too much data and And so we realized and and you know We paid attention to the market and then the fact that you know it costs quite a bit of Money to buy 10 20 megabyte bundles and we realized we actually owe it to our customers to pay attention to that And and that's that's why we chose the progressive web app and sort of system the fact that we can cash all of this data With a service worker cash and and sort of intercept that that that network request and the fact of the matter is that in Nigeria specifically in rural Nigeria There's relatively intermittent network statuses and so in terms of data and bad networks We we we had a really good match with with progressive web app and Can you tell me a little bit about sort of the the the data saving costs that you were able to achieve and and really like the The pieces of technology that that unlocked that for you So we've done up a before and after picture and we basically recorded how much data It took to complete it well the first thing was to complete the first load and we've managed to achieve a 92 percent Improvement so decreasing the amount of data it requires to load that home page and originally the first technology was simple design Optimization so you know basic things like instead of serving massive images or icons like PNG icons or whatever We've gone with SVGs and we've paid some serious attention to our design on top of the fact that we simplified it It made it made it really simple That would be the first thing the second the second way we optimized for data was I mean that first load It's not really the big part of it. It's more the second load and subsequent requests So on that first load we're using our app shell architecture to to a store all of that HTML CSS and JavaScript and then it sits there in the service worker and in the app shell and the next request to it It's not fetching it from the network. So there is no data cost and The second metric that that sort of screams is the is the amount of data it requires to perform a check out So imagine you're going to buy a product We've we've achieved an 80% reduction in data cost for that first transaction and the technology stack is quite simple It's based on service worker cache and the usage of IDB and sort of all of the underlying technologies of progressive web app And there's some other interesting things there, but that is the main the majority of it comes from that Very cool So and you mentioned so you got you mentioned kind of a web technology stack there And as we were talking an interesting point that you raised was that the engineering team that you worked on with this is not Exclusively web developers it kind of cuts across All sorts of different kind of engineering types So you talk about that a little bit because I think a lot of people when they think about Progressive web apps they see it as sort of a mutually exclusive thing where they're like well I'm gonna have to just drop my native app developers and go with this or something It's it's hard for them to choose. So so can you explain a little bit about that process? They all went through there Sure, so I think it was more about timing than anything else It wasn't an active decision to say hey, let's let's have them the native engineers build this It's more about the fact that this wasn't originally part of our roadmap We have a very serious engineering Undertaking at the moment and that's all about breaking down our monolithic application into smaller Independently deployable and scalable Microservices and that's where our efforts are at the moment so our web devs were kind of focused on other projects of rebuilding some client-side front-end components and They had been the resources had been booked out and the only available resources at the time were the native engineers who? We were struggling with our native apps in any case so that was the only team available at the time and I charged them a challenge them with you know switching from native to to web dev Which is it's a pretty different field But they seem to they seem to thrive Not only did it provide some variety People learn new skills and the new components of the web and I think they did very very well and the feedback I got from them was nothing but positive Everybody seemed to kind of grasp polymer really easily and and that sort of switch to web development quite quite easily You know all I can say is you know pay attention to To some of the documentation that that's available already on polymer and progressive web apps go into the examples Like inspect the code and that was pretty much what our team did to build this Cool So Andrew thank you so much for being with me today If you want to catch Andrew's talk you can tune into the Chrome developers YouTube channel We've got a playlist there for all the sessions of day two from the progressive web app summit Also, we're gonna include some links down in the description for the conga showcase on developers.google.com.web It covers a little bit more of the story of how they built the site and also a few more of those sort of like Stats on where they picked up in data savings and things like that again Andrew. Thank you so much for being with me today It's been great talking with you I thank you all for being with us and stay tuned for more from day two of the progressive web app summit. See ya