Angular
---------
HTTP
2
Ahead Of Time
Overview
- HTTP/2
- Server-Sent Events
- Service Workers
History
-
Development of HTTP was initiated by Tim Berners-Lee at CERN in 1989.
-
HTTP/1.1 occurred in RFC 2068 in 1997
- SPDY (deprecated) open-specification networking protocol developed primarily at Google.
- HTTP/2 published in 2015 (developed from SPDY)
CLIENT
SERVER
HTTP/1.0 - SEQUENTIAL
Request
Response
Request
Response
CLIENT
SERVER
HTTP/1.1
Requests
Responses
HOLB
(Head of line blocking)
Parallelism is limited by the number of connections
(6 connections per origin)
The waterfall
Today's Performance Optimizations
- Concatenating
- Inlining
- Minifying
- Image Sprites
- Domain Sharding
HTTP/2
CLIENT
SERVER
HTTP/2 - MULTIPLEXING
Requests | Streams
Responses
1 TCP Connection
(per origin)
HTTP/2
- binary framing, instead of textual
- is fully multiplexed, instead of ordered and blocking
- can therefore use one connection for parallelism
- uses stateful header compression to reduce overhead (HPACK delta encoding)
- allows servers to “push” responses proactively into client caches
H2 doesn't modify app semantics of HTTP.
H2 modifies how data is formatted (framed) and transported
HTTP/2 replacement for WebSockets ?
H/2 Streams
H/2 Streams
- Prioritization (1-256)
- Dependency (another stream)
- Cancelation
H/2 Stream Prioritization
H/2 Browser Support
Coming in NodeJS 8
(mid 2017)
using nghttp2
Follow @ https://github.com/nodejs/http2
Angular 2
-----------
HTTP/2
Optimizing our apps
- Angular 2 - Server Side Rendering
- Angular 2 - Lazy Loading + HTTP/2 Server Push
- Service Worker
Service Worker
- A script that runs in the background
- Can manage services like Push Notifications, and Background Sync and can act as Network request proxy
SW Browser Support
Server-Sent Events
Server-Sent Events
- Introduced with HTML5
- One Way ( Server to Client) communication chanel
SSE Browser Support
( will be updated in future)
Debugging SW
Follow @
http://github.com/iliaidakiev/
Angular 2 Over H/2
By idakiev
