L e a r n i n g H T T P/2 A PRACTICAL GUIDE FOR BEGINNERS Stephen Ludin & Javier Garza Learning HTTP/2 A Practical Guide for Beginners Stephen Ludin and Javier Garza Beijing Boston Farnham Sebastopol Tokyo Learning HTTP/2 by Stephen Ludin and Javier Garza Copyright © 2017 Stephen Ludin, Javier Garza. All rights reserved. Printed in the United States of America. Published by O’Reilly Media, Inc., 1005 Gravenstein Highway North, Sebastopol, CA 95472. O’Reilly books may be purchased for educational, business, or sales promotional use. Online editions are also available for most titles (http://oreilly.com/safari). For more information, contact our corporate/insti‐ tutional sales department: 800-998-9938 or [email protected]. Acquisitions Editor: Brian Anderson Indexer: Wendy Catalano Editors: Virginia Wilson and Dawn Schanafelt Interior Designer: David Futato Production Editor: Shiny Kalapurakkel Cover Designer: Karen Montgomery Copyeditor: Kim Cofer Illustrator: Rebecca Demarest Proofreader: Sonia Saruba June 2017: First Edition Revision History for the First Edition 2017-05-14: First Release 2017-10-27: Second Release See http://oreilly.com/catalog/errata.csp?isbn=9781491962442 for release details. The O’Reilly logo is a registered trademark of O’Reilly Media, Inc. Learning HTTP/2, the cover image, and related trade dress are trademarks of O’Reilly Media, Inc. While the publisher and the authors have used good faith efforts to ensure that the information and instructions contained in this work are accurate, the publisher and the authors disclaim all responsibility for errors or omissions, including without limitation responsibility for damages resulting from the use of or reliance on this work. Use of the information and instructions contained in this work is at your own risk. If any code samples or other technology this work contains or describes is subject to open source licenses or the intellectual property rights of others, it is your responsibility to ensure that your use thereof complies with such licenses and/or rights. 978-1-491-96244-2 [LSI] Table of Contents Preface. vii Foreword. xiii 1. The Evolution of HTTP. 1 HTTP/0.9 and 1.0 2 HTTP/1.1 3 Beyond 1.1 4 SPDY 4 HTTP/2 4 2. HTTP/2 Quick Start. 7 Up and Running 7 Get a Certificate 8 Use an Online Generator 8 Self Signed 8 Let’s Encrypt 8 Get and Run Your First HTTP/2 Server 9 Pick a Browser 10 3. How and Why We Hack the Web. 11 Performance Challenges Today 11 The Anatomy of a Web Page Request 11 Critical Performance 14 The Problems with HTTP/1 16 Web Performance Techniques 21 Best Practices for Web Performance 22 Anti-Patterns 30 iii Summary 31 4. Transition to HTTP/2. 33 Browser Support 33 Moving to TLS 34 Undoing HTTP 1.1 “Optimizations” 36 Third Parties 38 Supporting Older Clients 38 Summary 39 5. The HTTP/2 Protocol. 41 Layers of HTTP/2 41 The Connection 42 Frames 44 Streams 47 Messages 48 Flow Control 51 Priority 52 Server Push 53 Pushing an Object 53 Choosing What to Push 55 Header Compression (HPACK) 56 On the Wire 58 A Simple GET 58 Summary 63 6. HTTP/2 Performance. 65 Client Implementations 65 Latency 67 Packet Loss 70 Server Push 72 Time to First Byte (TTFB) 74 Third Parties 76 HTTP/2 Anti-Patterns 81 Domain Sharding 81 Inlining 82 Concatenating 82 Cookie-less Domains 82 Spriting 82 Prefetch 83 Real-World Performance 83 Performance Measurement Methodology 84 iv | Table of Contents Study 1: www.facebook.com 84 Study 2: www.yahoo.com 86 Summary 89 7. HTTP/2 Implementations. 91 Desktop Web Browsers 91 TLS Only 91 Disabling HTTP/2 92 Support for HTTP/2 Server Push 92 Connection Coalescing 92 HTTP/2 Debugging Tools 92 Beta Channel 93 Mobile 93 Mobile App Support 93 Servers, Proxies, and Caches 94 Content Delivery Networks (CDNs) 95 Summary 95 8. Debugging h2. 97 Web Browser Developer Tools 97 Chrome Developer Tools 97 Firefox Developer Tools 104 Debugging h2 on iOS Using Charles Proxy 106 Debugging h2 on Android 108 WebPagetest 109 OpenSSL 109 OpenSSL Commands 110 nghttp2 110 Using nghttp 110 curl 112 Using curl 112 h2i 114 Wireshark 115 Summary 116 9. What Is Next?. 117 TCP or UDP? 117 QUIC 118 TLS 1.3 119 HTTP/3? 120 Summary 120 Table of Contents | v A. HTTP/2 Frames. 121 B. Tools Reference. 131 Index. 133 vi | Table of Contents Preface HTTP/2, also called h2 for simplicity, is a major revision of the HTTP network proto‐ col used by the World Wide Web, meant to improve the perceived performance of loading web content. Since HTTP/1.1 (h1) was approved in 1999, the web has changed significantly from mostly text-based web pages that weighed a few kilobytes and included less than 10 objects, to today’s media-rich websites that weigh on average over 2 megabytes,1 and include an average of 140 objects. However, the HTTP protocol used to deliver the web content did not change in the intervening years, making room for a new industry of Web Performance experts who specialize in coming up with workarounds to help the aging protocol load web pages faster. People’s expectations for performance have changed too—while in the late ’90s people were willing to wait up to seven seconds for a page to load, a 2009 study by Forrester Research found that online shoppers expected pages to load under two seconds, with a large share of users abandoning sites where pages take over three seconds to load. A recent study by Google showed that a even a delay of 400 milliseconds (the blink of an eye) will cause people to search less. That’s why h2 was created—a protocol that can better handle today’s complex pages without sacrificing speed. HTTP/2’s adoption has been increasing2 as more website administrators realize they can improve the perceived performance of their websites with little effort. We all use h2 every day—it powers some of the most popular sites like Facebook, Twitter, Google, and Wikipedia—but many people don’t know about it. Our goal is to educate you on h2 and its performance benefits, so you can get the most out of it. 1 http://bit.ly/2oEc8sA 2 http://bit.ly/2pNKiL4 vii Who Should Read This Book Regardless of your role, if you find yourself responsible for any part of the life cycle of a website, this book will be useful for you. It is intended for people building or run‐ ning websites, and in general anybody considering implementing h2, or looking to understand how it works. We expect you to be familiar with web browsers, web servers, websites, and the basics of the HTTP protocol. What This Book Isn’t The goal of this book is to teach you h2 and help you make the most out of the new version of the HTTP protocol. It is not a comprehensive guide for all h2 clients, servers, debug tools, performance benchmarking, etc. This book is intended for peo‐ ple not familiar with HTTP/2, but even experts may still find it to be a convenient resource. Recommended Resources h2book.com is the companion website of this book, where you will find some of the examples referenced in later chapters. In addition, we recommend the following books: • High Performance Websites, by Steve Souders (O’Reilly): Essential knowledge for frontend engineers • Even Faster Websites, by Steve Souders (O’Reilly): Performance best practices for web developers • High Performance Browser Networking, by Ilya Grigorik (O’Reilly): Hands-on overview about the various types of networks, transport protocols, application protocols, and APIs available in the browser • Using WebPageTest, by Rick Viscomi, Andy Davies, and Marcel Duran (O’Reilly): Learn basic and advanced uses of WebPagetest, a free performance measurement tool for optimizing websites • High Performance Mobile Web, by Maximiliano Firtman (O’Reilly): Optimize the performance of your mobile websites and webapps • http2 explained, by Daniel Stenberg viii | Preface Conventions Used in This Book The following typographical conventions are used in this book: Italic Indicates new terms, URLs, email addresses, filenames, and file extensions. Constant width Used for program listings, as well as within paragraphs to refer to program ele‐ ments such as variable or function names, databases, data types, environment variables, statements, and keywords. Constant width bold Shows commands or other text that should be typed literally by the user. Constant width italic Shows text that should be replaced with user-supplied values or by values deter‐ mined by context. This icon signifies a tip, suggestion, or general note. This icon indicates a warning or caution. Using Code Examples Supplemental material (code examples, exercises, etc.) is available for download at https://github.com/oreillymedia/learning-http2. This book is here to help you get your job done. In general, if example code is offered with this book, you may use it in your programs and documentation. You do not need to contact us for permission unless you’re reproducing a significant portion of the code. For example, writing a program that uses several chunks of code from this book does not require permission. Selling or distributing a CD-ROM of examples from O’Reilly books does require permission. Answering a question by citing this book and quoting example code does not require permission. Incorporating a signifi‐ cant amount of example code from this book into your product’s documentation does require permission. Preface | ix We appreciate, but do not require, attribution. An attribution usually includes the title, author, publisher, and ISBN.