Reducing latency on the web with the Azure CDN - DevSum - SWAG
-
Upload
maarten-balliauw -
Category
Technology
-
view
523 -
download
2
description
Transcript of Reducing latency on the web with the Azure CDN - DevSum - SWAG
![Page 1: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/1.jpg)
Reducing latency on the web with the Azure CDNMaarten Balliauw@maartenballiauw
![Page 2: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/2.jpg)
Who am I?
Maarten Balliauw Antwerp, Belgium Technical Evangelist, JetBrains Founder, MyGet AZUG Focus on web ASP.NET MVC, Azure, SignalR, ... MVP Azure & ASPInsider
Big passion: Azure http://blog.maartenballiauw.be @maartenballiauw Shameless self promotion: Pro NuGet - http://amzn.to/pronuget2
![Page 3: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/3.jpg)
Agenda
Why use a CDN? The Azure CDN Blob containers Cloud services
Serving dynamic content over the CDN Conclusions
![Page 4: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/4.jpg)
Why use a CDN?
![Page 5: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/5.jpg)
How browsers work...
Request fetching <html> Download CSS Download images Download JavaScript Download Google Analytics
Finite # of concurrent requests per host (and in total)!
Bundling/minification Use multiple hosts
![Page 6: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/6.jpg)
How browsers work...
Browser # connections / host
Max # connections
Chrome 32 6 10
Firefox 26 6 17
IE 9 6 35
IE 10 8 16
IE 11 13 17
Safari 7 6 17
Android 4 6 17
IEMobile 9 6 60
http://www.browserscope.org/?category=network
![Page 7: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/7.jpg)
Why care? I use bundling and minification!
![Page 8: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/8.jpg)
Speed of light and TCP don’t like each other
US East – US West = 7400 km or 25 ms at speed of light (299792,458 km/second in a vacuum) or 37 ms through fiber optics (66% of SoL, glass refraction index
1.5)
TCP request/response, ACK request/response double that 37 ms, add some compute: ~90 ms US East to West
Theoretical max. packet size is 64 kB usually +/- 1500 bytes (MTU)
TCP slow start
http://www.stevesouders.com/blog/2010/07/13/velocity-tcp-and-the-lower-bound-of-web-performance/
![Page 9: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/9.jpg)
Combine TCP slow start and fiber optics
US East – US West ~90ms + TCP slow start
256 kB ~ 10 TCP roundtrips that 90 ms becomes 900 ms...
http://www.stevesouders.com/blog/2010/07/13/velocity-tcp-and-the-lower-bound-of-web-performance/
![Page 10: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/10.jpg)
Cost of web load
Serving static files costs CPU Full IIS pipeline for a tiny static file
Serving static files costs I/O Files have to be copied from file stream to response stream Why do this? Why not let the server handle our dynamic
content?
Cookies! Request/response cycle adds the cookie Even for a 1 kB PNG
![Page 11: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/11.jpg)
So there are some problems on the Internet...
Browsers / connections Speed of light / TCP slow start Cost of web load (CPU, I/O and cookies)
![Page 12: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/12.jpg)
“The Internet sucks and so does your server.”- Andy Cross - @andybareweb
![Page 13: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/13.jpg)
Workarounds!
Browsers / connections Serve some content off a different hostname
Speed of light / TCP slow start Move content closer to the user
Cost of web load (CPU, I/O and cookies) Serve off a cookieless domain Move content off the web server and let someone else handle
it
![Page 14: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/14.jpg)
The Azure CDN
![Page 15: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/15.jpg)
The Azure CDN
Serve content from storage / cloud service Separate hostname (custom domain possible) Many locations around the globe DNS anycast to get content close to user
![Page 16: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/16.jpg)
CDN locations (April 1st, 2014)http://msdn.microsoft.com/en-US/library/azure/gg680302.aspx
![Page 17: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/17.jpg)
How it works: no CDN
![Page 18: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/18.jpg)
How it works: with CDN
![Page 19: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/19.jpg)
DemoCreating a CDN endpoint
![Page 20: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/20.jpg)
What did we just do?
First request
Second request (on same endpoint)
yawn!
![Page 21: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/21.jpg)
How to use this in real life?
Create one/more public blob containers Upload static files in there (CSS, images, scripts, ...) Update your application to the new URLs
![Page 22: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/22.jpg)
DemoAn application with a CDN endpoint
![Page 23: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/23.jpg)
How to delete content from the CDN?
Read a book or 2 and wait (7 days default...) Think about this upfront! If you know expiry, set the Cache-Control header (shorter =
more updates) If you don’t, use versioning in query strings Better: use both
![Page 24: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/24.jpg)
Versioning
Enable query strings on the CDN endpoint Use a query string with a meaningful version number CDN will keep a cache per URL per query string
/foo/bar?v=1 /foo/bar?v=2 /foo/bar?v=3
![Page 25: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/25.jpg)
Cloud services will make life easier
We had to “manually” upload content to storage
May be good, may be cumbersome, depends! Would be nice if we could “deploy and forget”
Set a cloud service as the CDN origin Will serve all content from /cdn URL Same cache-control rules as with storage
![Page 26: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/26.jpg)
DemoUsing Cloud Services as the CDN origin
![Page 27: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/27.jpg)
Best-practices for content on the CDN
Set headers! Cache-Control Content-Type Content-Encoding
Version content! HTTP compression on origin = HTTP compression on CDN
![Page 28: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/28.jpg)
Servingdynamiccontent
![Page 29: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/29.jpg)
Defining “dynamic content”
Content that is generated Parameters from query string, ASP.NET routing, ... And/or based on data
Content that refreshes, but not too often Anything > a couple of minutes
Examples Charts, images, generated documents, json, API’s, ...
![Page 30: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/30.jpg)
DemoServing dynamic content
![Page 31: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/31.jpg)
Conclusions
![Page 32: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/32.jpg)
Conclusions
Why use a CDN? The Azure CDN Blob containers Cloud services
Serving dynamic content over the CDN
What have we learned?
![Page 33: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/33.jpg)
Thank you!http://blog.maartenballiauw.be@maartenballiauwhttp://amzn.to/pronuget
![Page 34: Reducing latency on the web with the Azure CDN - DevSum - SWAG](https://reader035.fdocuments.in/reader035/viewer/2022070316/555ab728d8b42ad0538b5493/html5/thumbnails/34.jpg)