GET /nelm.io/pierreHTTP/1.1HOST: nelm.ioHTTP/1.1 200 OKContent-Type: text/html; charset=UTF-8Last-Modified: Wed, 23 Feb 20...
GET /nelm.io/pierreHTTP/1.1HOST: nelm.ioHTTP/1.1 200 OKContent-Type: text/html; charset=UTF-8Last-Modified: Thu, 30 Sep 20...
GET /nelm.io/pierreHTTP/1.1HOST: nelm.ioHTTP/1.1 200 OKContent-Type: text/html; charset=UTF-8Last-Modified: Thu, 30 Sep 20...
GET /nelm.io/pierreHTTP/1.1HOST: nelm.ioIf-Modified-Since: Thu, 30 Sep 2011 17:00:00 GTMHTTP/1.1 304 Not ModifiedContent-T...
GET /nelm.io/pierreHTTP/1.1HOST: nelm.ioIf-Modified-Since: Thu, 30 Sep 2011 17:00:00 GTMHTTP/1.1 304 Not ModifiedContent-T...
<img src="data:image/gif;base64,R0lGODlhEAAOALMAAOazToeH     h0tLS/7LZv/0jvb29t/f3//Ub//ge8WSLf/rhf/3kdbW1mxsbP/     5UUde...
HTTP/1.1 200 OKContent-Type: application/x-javascriptLast-Modified: Wed, 23 Feb 2011 17:23:32 GTMExpires: Wed, 23 Feb 2011...
HTTP/1.1 200 OKContent-Type: application/x-javascriptLast-Modified: Thu, 30 Sep 2011 17:00:00 GTMExpires: Thu, 30 Sep 2011...
HTTP/1.1 200 OKContent-Type: application/x-javascriptLast-Modified: Thu, 30 Sep 2011 17:00:00 GTMExpires: Thu, 30 Sep 2021...
HTTP/1.1 200 OKContent-Type: application/x-javascriptLast-Modified: Thu, 30 Sep 2011 17:00:00 GTMCache-Control: max-age=31...
HTTP/1.1 200 OKContent-Type: application/x-javascriptLast-Modified: Thu, 30 Sep 2011 17:00:00 GTMCache-Control: max-age=31...
HTTP/1.1 200 OKContent-Type: application/x-javascriptLast-Modified: Thu, 30 Sep 2011 17:00:00 GTMCache-Control: max-age=31...
<FilesMatch ".(gif|jpg|js|css)">    ExpiresDefault "access plus 10 years"</FilesMatch>
GET /nelm.io/pierreHTTP/1.1HOST: nelm.ioAccept-Encoding: gzip,deflateHTTP/1.1 200 OKContent-Type: text/html; charset=UTF-8...
HTTP/1.1 200 OKContent-Type: text/html; charset=UTF-8Last-Modified: Wed, 23 Feb 2011 17:00:00 GTMContent-Length: 453Conten...
HTTP/1.1 200 OKContent-Type: text/html; charset=UTF-8Last-Modified: Thu, 30 Sep 2011 17:00:00 GTMContent-Length: 453Conten...
As of February 2010, estimates of IE6sglobal market share ranged from 10-20%.Nonetheless, IE6 continues to maintain aplura...
Vary: *Cache-Control: private
Vary: *Cache-Control: private
document.write
width: expression(document.body.clientWitdh < 600 ? “600px” : “auto”);min-width: 600px;
GET /nelm.io/foo.js    GET /nelm.io/foo.jsHOST: nelm.io          HOST: nelm.io                       If-Modified-Since: [....
GET /nelm.io/foo.js    GET /nelm.io/foo.jsHOST: nelm.io          HOST: nelm.io                       If-Modified-Since: [....
GET /nelm.io/foo.js    GET /nelm.io/foo.jsHOST: nelm.io          HOST: nelm.io                       If-None-Match: 10f24b...
GET /nelm.io/foo.js    GET /nelm.io/foo.jsHOST: nelm.io          HOST: nelm.io                       If-None-Match: 10f24b...
HTTP/1.1 200 OKETag: 10f24bc-4ab-457e1c1f
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Speedy App: Frontend Performance Considerations
Upcoming SlideShare
Loading in...5
×

Speedy App: Frontend Performance Considerations

10,024

Published on

Execution time in the backend is not all there is to the speed of a web application. In this talk, we'll look at the basic enhancements we can make to get an applications that truly feels snappy!

Published in: Technology, Education
4 Comments
28 Likes
Statistics
Notes
No Downloads
Views
Total Views
10,024
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
170
Comments
4
Likes
28
Embeds 0
No embeds

No notes for slide

Speedy App: Frontend Performance Considerations

  1. 1. GET /nelm.io/pierreHTTP/1.1HOST: nelm.ioHTTP/1.1 200 OKContent-Type: text/html; charset=UTF-8Last-Modified: Wed, 23 Feb 2011 17:00:00 GTMContent-Length: 453
  2. 2. GET /nelm.io/pierreHTTP/1.1HOST: nelm.ioHTTP/1.1 200 OKContent-Type: text/html; charset=UTF-8Last-Modified: Thu, 30 Sep 2011 17:00:00 GTMContent-Length: 453
  3. 3. GET /nelm.io/pierreHTTP/1.1HOST: nelm.ioHTTP/1.1 200 OKContent-Type: text/html; charset=UTF-8Last-Modified: Thu, 30 Sep 2011 17:00:00 GTMContent-Length: 453
  4. 4. GET /nelm.io/pierreHTTP/1.1HOST: nelm.ioIf-Modified-Since: Thu, 30 Sep 2011 17:00:00 GTMHTTP/1.1 304 Not ModifiedContent-Type: text/html; charset=UTF-8Last-Modified: Wed, 23 Feb 2011 17:00:00 GTM
  5. 5. GET /nelm.io/pierreHTTP/1.1HOST: nelm.ioIf-Modified-Since: Thu, 30 Sep 2011 17:00:00 GTMHTTP/1.1 304 Not ModifiedContent-Type: text/html; charset=UTF-8Last-Modified: Thu, 30 Sep 2011 17:00:00 GTM
  6. 6. <img src="data:image/gif;base64,R0lGODlhEAAOALMAAOazToeH h0tLS/7LZv/0jvb29t/f3//Ub//ge8WSLf/rhf/3kdbW1mxsbP/ 5UUde0ECwLJoExKcppV0aCcGCmTIHEIUEqjgaORCMxIC6e0Ccgu Ww6aFjsVMkkIr7g77ZKPJjPZqIyd7sJAgVGoEGv2xsBxqNgYPj" width="16" height="14" alt="Play">
  7. 7. HTTP/1.1 200 OKContent-Type: application/x-javascriptLast-Modified: Wed, 23 Feb 2011 17:23:32 GTMExpires: Wed, 23 Feb 2011 19:23:32 GTM
  8. 8. HTTP/1.1 200 OKContent-Type: application/x-javascriptLast-Modified: Thu, 30 Sep 2011 17:00:00 GTMExpires: Thu, 30 Sep 2011 21:00:00 GTM
  9. 9. HTTP/1.1 200 OKContent-Type: application/x-javascriptLast-Modified: Thu, 30 Sep 2011 17:00:00 GTMExpires: Thu, 30 Sep 2021 21:00:00 GTM
  10. 10. HTTP/1.1 200 OKContent-Type: application/x-javascriptLast-Modified: Thu, 30 Sep 2011 17:00:00 GTMCache-Control: max-age=315360000
  11. 11. HTTP/1.1 200 OKContent-Type: application/x-javascriptLast-Modified: Thu, 30 Sep 2011 17:00:00 GTMCache-Control: max-age=315360000
  12. 12. HTTP/1.1 200 OKContent-Type: application/x-javascriptLast-Modified: Thu, 30 Sep 2011 17:00:00 GTMCache-Control: max-age=315360000
  13. 13. <FilesMatch ".(gif|jpg|js|css)"> ExpiresDefault "access plus 10 years"</FilesMatch>
  14. 14. GET /nelm.io/pierreHTTP/1.1HOST: nelm.ioAccept-Encoding: gzip,deflateHTTP/1.1 200 OKContent-Type: text/html; charset=UTF-8Last-Modified: Thu, 30 Sep 2011 17:00:00 GTMContent-Length: 453Content-Encoding: gzip
  15. 15. HTTP/1.1 200 OKContent-Type: text/html; charset=UTF-8Last-Modified: Wed, 23 Feb 2011 17:00:00 GTMContent-Length: 453Content-Encoding: gzipVary: Accept-Encoding
  16. 16. HTTP/1.1 200 OKContent-Type: text/html; charset=UTF-8Last-Modified: Thu, 30 Sep 2011 17:00:00 GTMContent-Length: 453Content-Encoding: gzipVary: Accept-Encoding
  17. 17. As of February 2010, estimates of IE6sglobal market share ranged from 10-20%.Nonetheless, IE6 continues to maintain aplurality or even majority presence in thebrowser market of certain countries,notably China and South Korea. - Wikipedia
  18. 18. Vary: *Cache-Control: private
  19. 19. Vary: *Cache-Control: private
  20. 20. document.write
  21. 21. width: expression(document.body.clientWitdh < 600 ? “600px” : “auto”);min-width: 600px;
  22. 22. GET /nelm.io/foo.js GET /nelm.io/foo.jsHOST: nelm.io HOST: nelm.io If-Modified-Since: [...] If-None-Match: 10f24bc-4abHTTP/1.1 200 OK HTTP/1.1 304 Not ModifiedLast-Modified:[...]ETag: 10f24bc-4ab-457e1c1f
  23. 23. GET /nelm.io/foo.js GET /nelm.io/foo.jsHOST: nelm.io HOST: nelm.io If-Modified-Since: [...] If-None-Match: 10f24bc-4ab HTTP/1.1 304 Not ModifiedHTTP/1.1 200 OKETag: 10f24bc-4ab-457e1c1f
  24. 24. GET /nelm.io/foo.js GET /nelm.io/foo.jsHOST: nelm.io HOST: nelm.io If-None-Match: 10f24bc-4ab HTTP/1.1 304 Not ModifiedHTTP/1.1 200 OKETag: 10f24bc-4ab-457e1c1f
  25. 25. GET /nelm.io/foo.js GET /nelm.io/foo.jsHOST: nelm.io HOST: nelm.io If-None-Match: 10f24bc-4ab HTTP/1.1 304 Not ModifiedHTTP/1.1 200 OKETag: 10f24bc-4ab-457e1c1f
  26. 26. HTTP/1.1 200 OKETag: 10f24bc-4ab-457e1c1f
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×