H2O - making the Web faster

Copyright (C) 2015 DeNA Co.,Ltd. All Rights Reserved.

H2Omaking the Web faster

DeNA Co., Ltd.Kazuho Oku

1


Agenda

n  How H2O startedn  The Goal and Key Featuresn  Improving User Experience with HTTP/2

2 H2O -‐‑‒ making the Web faster (Jun 2 2015)


How H2O Started



About H2O

n  H2O is a HTTP server⁃  debut in late 2014⁃  supports HTTP/1 and HTTP/2⁃  known for its performance⁃  developed by DeNA Co., Ltd. and contributors

"H2O is a new blazingly fast HTTP server with http2 support that shows potential"

– http2 explained by Daniel Stenberg



Benchmark



PicoHTTPParser

n  originally written for HTTP::Parser::XS⁃  the de-‐‑‒facto HTTP parser of Plack servers

n  the core of H2O



Design philosophy of H2O

n  Do it right, from the ground upn  design wins lead to higher performance with less code


$ wc picohttpparser.[hc] 596 2077 22192 picohttpparser.c 86 495 3363 picohttpparser.h 682 2572 25555 total$ wc http_parser.[hc] 2434 7281 70424 http_parser.c 342 1567 12991 http_parser.h 2776 8848 83415 total


High-‐‑‒level architecture of H2O

n  event-‐‑‒driven⁃  can handle many connections concurrently

n  multi-‐‑‒thread⁃  states and upstream (reverse-‐‑‒proxy) connections are reused•  impossible under a multi-‐‑‒process design

n  multi-‐‑‒protocol⁃  designed for HTTP/2 and TLS



The Goal and Key Features



The goal of H2O is to provide...

n  better performance⁃  demand for handling more requests: •  IoT, micro-‐‑‒services, etc.

n  better user experience⁃  faster content delivery using HTTP/2

n  ease to use and configure⁃  TLS (OCSP stapling, record size tuning, chacha20/poly1305, ...)

⁃  dynamic reconfiguration



Key features of H2O

n  excellent protocol implementation⁃  very fast HTTP/1⁃  one of the leading implementations of HTTP/2

n  optimally configured for HTTPS⁃  enabled by default: OCSP stapling, record size tuning, chacha20/poly1305, ...

⁃  bundles libressl (hopefully lesser security issues)n  graceful restart and self upgrade via Server::Starter



Key features of H2O (cont'd)

n  state-‐‑‒of-‐‑‒art reverse proxy⁃  use of PicoHTTPParser leads to performance⁃  reuses connections with a server-‐‑‒wide connection pool

⁃  X-‐‑‒Reproxy-‐‑‒URL support•  can do both: backend-‐‑‒to-‐‑‒backend and backend-‐‑‒to-‐‑‒local

⁃  DNS lookup•  backend servers can be added / removed by updating DNS or /etc/hosts



Improving User Experience with H2O & HTTP/2



Issues of HTTP/1 fixed by HTTP/2

n  head-‐‑‒of-‐‑‒line blocking⁃  using multiple TCP connections had performance issues due to slow-‐‑‒start / too little concurrency

n  prioritized resource loading⁃  load assets that block rendering (e.g. CSS, JS) before images



Prioritization in HTTP/2

n  weight-‐‑‒based and dependency-‐‑‒based⁃  weight-‐‑‒based: 75% of bandwidth to A, 25% to B⁃  dependency-‐‑‒based: send HTML after JavaScript

n  Firefox is known for its state-‐‑‒of-‐‑‒art protocol impl.⁃  send CSS and JavaScript files in <HEAD> before HTML and/or image files

⁃  HTML is given 2.5x bandwidth above imagesn  Chrome uses weight-‐‑‒based only⁃  adapted from its SPDY implementation



The benchmark

n  test data: http2rulez.com⁃  loads 5 CSS and 8 JavaScript files in <HEAD>•  including minified jquery.js⁃  loads 18 non-‐‑‒blocking asset files (e.g. images), both small and large

n  network is given 100ms latency⁃  uses a virtual network to avoid noise

n  web browsers: Chrome 43 / Firefox 38n  servers: H2O 1.3.0-‐‑‒alpha1 / Nginx 1.9.1⁃  on Ubuntu 14.04 (on VMware fusion)



Nginx (HTTP/1.1) + Chrome


first-‐‑‒paint time: 1.83 seconds


Nginx (SPDY/3.1) + Chrome




H2O (HTTP/2) + Chrome




Why not faster with HTTP/2?

n  Because Chrome (does not) prioritize CSS / script files above images

n  upcoming version of H2O provides a configuration directive http2-‐‑‒reprioritize-‐‑‒blocking-‐‑‒assets to tackle the issue⁃  when set to ON, the server sends CSS / scripts before anything else



H2O (HTTP/2+reprioritize:ON) + Chrome




Nginx (HTTP/1.1) + Firefox




Nginx (SPDY/3.1) + Firefox




H2O (HTTP/2) + Firefox




The benchmark scores



Analysis

n  H2O (HTTP/2) is 50% faster in first-‐‑‒paint time than Nginx (HTTP/1.1) on both browsers⁃  Chrome needs the reprioritize directive set to ON

n  Nginx (SPDY/3.1) is not faster than HTTP/1.1, likely because it does not prioritize the streams⁃  on Firefox, HTTP/1.1 is faster than SPDY/3.1 since the browser delays sending requests for images until receiving all the blocking assets



Conclusion

n  H2O (and HTTP/2) provides better user experience⁃  esp. under high-‐‑‒latency network (e.g. mobile)

n  prioritization is very important in SPDY & HTTP/2⁃  benchmark your HTTP/2 server!⁃  on the client-‐‑‒side, Firefox is doing very well•  Chrome needs improvement, H2O provides a fix



What's coming to H2O

n  Version 1.3⁃  expected this week?⁃  http2-‐‑‒reprioritize-‐‑‒blocking-‐‑‒assets for better user experience on Chrome

⁃  preliminary support for FastCGIn  Version 1.4 and beyond⁃  ease-‐‑‒of-‐‑‒use features



Stay Tuned!


Technology

H2O - making the Web faster