Reducing latency on the web with the Azure CDN- TechDays NL 2014
36
-
Upload
maarten-balliauw -
Category
Technology
-
view
1.451 -
download
0
description
Serving up content on the Internet is something our web sites do daily. But are we doing this in the fastest way possible? How are users in faraway countries experiencing our apps? Why do we have three webservers serving the same content over and over again? In this session, we’ll explore the Azure Content Delivery Network or CDN, a service which makes it easy to serve up blobs, videos and other content from servers close to our users. We’ll explore simple file serving as well as some more advanced, dynamic edge caching scenarios.
Transcript of Reducing latency on the web with the Azure CDN- TechDays NL 2014
Laat ons weten wat u vindt van deze sessie! Vul de evaluatie in via www.techdaysapp.nl en maak kans op een van de 20 prijzen*. Prijswinnaars worden bekend gemaakt via Twitter (#TechDaysNL). Gebruik hiervoor de code op uw badge.
Let us know how you feel about this session! Give your feedback via www.techdaysapp.nl and possibly win one of the 20 prizes*. Winners will be announced via Twitter (#TechDaysNL). Use your personal code on your badge.
* Over de uitslag kan niet worden gecorrespondeerd, prijzen zijn voorbeelden – All results are final, prizes are examples
Reducing latency on the web with the Azure CDNMaarten Balliauw@maartenballiauw
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
Agenda
• Why use a CDN?• The Azure CDN
• Blob containers• Cloud services
• Serving dynamic content over the CDN• Conclusions
Why use a CDN?
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
How browsers work...http://www.browserscope.org/?category=network
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
Why care? I use bundling and minification!
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/
Combine TCP slow start and fibre optics
US East – US West~90ms + TCP slow start
256 kB ~ 10 TCP roundtripsthat 90 ms becomes 900 ms...
http://www.stevesouders.com/blog/2010/07/13/velocity-tcp-and-the-lower-bound-of-web-performance/
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
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)
“The Internet sucks and so does your server.”- Andy Cross - @andybareweb
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
The Azure CDN
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
CDN locations (April 1st, 2014)
http://msdn.microsoft.com/en-US/library/azure/gg680302.aspx
How it works: no CDN
How it works: with CDN
DemoCreating a CDN endpoint
What did we just do?
•First request
•Second request (on same endpoint)yawn!
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
DemoAn application with a CDN endpoint
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
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
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
DemoUsing Cloud Services as the CDN origin
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
Servingdynamic content
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, ...
DemoServing dynamic content
Conclusions
Conclusions
• Why use a CDN?• The Azure CDN
• Blob containers• Cloud services
• Serving dynamic content over the CDN
What have we learned?
Thank you!http://blog.maartenballiauw.be@maartenballiauwhttp://amzn.to/pronuget
Laat ons weten wat u vindt van deze sessie! Vul de evaluatie in via www.techdaysapp.nl en maak kans op een van de 20 prijzen*. Prijswinnaars worden bekend gemaakt via Twitter (#TechDaysNL). Gebruik hiervoor de code op uw badge.
Let us know how you feel about this session! Give your feedback via www.techdaysapp.nl and possibly win one of the 20 prizes*. Winners will be announced via Twitter (#TechDaysNL). Use your personal code on your badge.
* Over de uitslag kan niet worden gecorrespondeerd, prijzen zijn voorbeelden – All results are final, prizes are examples
