Dean Alan Hume F Addy Osmani OREWORD BY M A N N I N G Progressive Web Apps Progressive Web Apps DEAN ALAN HUME FOREWORD BY ADDY OSMANI MANNING SHELTER ISLAND For online information and ordering of this and other Manning books, please visit www.manning.com. The publisher offers discounts on this book when ordered in quantity. For more information, please contact Special Sales Department Manning Publications Co. 20 Baldwin Road PO Box 761 Shelter Island, NY 11964 Email: [email protected] ©2018 by Manning Publications Co. All rights reserved. No part of this publication may be reproduced, stored in a retrieval system, or transmitted, in any form or by means electronic, mechanical, photocopying, or otherwise, without prior written permission of the publisher. Many of the designations used by manufacturers and sellers to distinguish their products are claimed as trademarks. Where those designations appear in the book, and Manning Publications was aware of a trademark claim, the designations have been printed in initial caps or all caps. Recognizing the importance of preserving what has been written, it is Manning’s policy to have the books we publish printed on acid-free paper, and we exert our best efforts to that end. Recognizing also our responsibility to conserve the resources of our planet, Manning books are printed on paper that is at least 15 percent recycled and processed without the use of elemental chlorine. Manning Publications Co. Development editor: Jennifer Stout 20 Baldwin Road Technical development editor: Marius Butuc PO Box 761 Project editor: Janet Vail Shelter Island, NY 11964 Copyeditor: Corbin Collins Proofreader: Melody Dolab Technical proofreader: Alexey Galiullin Typesetter: Dennis Dalinnik Cover designer: Marija Tudor ISBN: 9781617294587 Printed in the United States of America 1 2 3 4 5 6 7 8 9 10 – EBM – 22 21 20 19 18 17 In memory of Frank Hume—“Keep ‘em flying” brief contents PART 1 DEFINING PROGRESSIVE WEB APPS................................1 1 ■ Understanding Progressive Web Apps 3 2 ■ First steps to building a Progressive Web App 15 PART 2 FASTER WEB APPS ........................................................29 3 ■ Caching 31 4 ■ Intercepting network requests 51 PART 3 ENGAGING WEB APPS...................................................65 5 ■ Look and feel 67 6 ■ Push notifications 81 PART 4 RESILIENT WEB APPLICATIONS .....................................97 7 ■ Offline browsing 99 8 ■ Building more resilient applications 111 9 ■ Keeping your data synchronized 120 PART 5 THE FUTURE OF PROGRESSIVE WEB APPS...................133 10 ■ Streaming data 135 11 ■ Progressive Web App Troubleshooting 147 12 ■ The future is looking good 157 vii contents foreword xv preface xvi acknowledgments xvii about this book xix PART 1 DEFINING PROGRESSIVE WEB APPS......................1 1 Understanding Progressive Web Apps 3 1.1 What’s the big deal with Progressive Web Apps? 3 1.2 PWA basics 5 Building a business case for Progressive Web Apps 6 1.3 Service Workers: The key to PWAs 8 Understanding Service Workers 8 ■ The Service Worker lifecycle 9 ■ A basic Service Worker example 10 Security considerations 12 1.4 Performance insight: Flipkart 13 1.5 Summary 14 ix