HTTP headers that make your website go faster
0 likes200 views
The document discusses the importance of web performance and caching strategies to enhance user experience by optimizing network latency. It outlines different caching types, mechanisms, cache-control directives, and their effects on data freshness and revalidation. The document emphasizes the implementation of effective caching policies for improved web acceleration through content delivery solutions.
HTTP headers that make your website go faster
- 3. WEB PERFORMANCE IS AN ESSENTIAL PART OF THE USER EXPERIENCE
- 4. SLOW~DOWN
- 9. MO' MONEY MO' SERVERS MO' PROBLEMS
- 11. OPTIMIZE
- 12. AFTER A WHILE YOU HIT THE LIMITS
- 13. CACHE
- 14. HI, I'M THIJS
- 19. WE MAKE THE WEB FASTER
- 20. WE ENHANCE DIGITAL EXPERIENCES BY LOWERING NETWORK LATENCY
- 21. WE BUILD SOFTWARE-DEFINED WEB ACCELERATION & CONTENT DELIVERY SOLUTIONS
- 22. 1.3 Tbps per server 1.17 Gbps per watt ACHIEVE GROWTH, PERFORMANCE & SUSTAINABILITY GOALS WORLD’S FASTEST EDGE CONTENT DELIVERY SOFTWARE
- 25. CACHING
- 26. WHY CACHE
- 29. LOWER LATENCY
- 30. IMPROVE QUALITY OF EXPERIENCE
- 32. DIFFERENT KINDS OF CACHING ✓ LOCAL KEY-VALUE STORE ✓ FILE CACHE ✓ DISTRIBUTE CACHE ✓ BROWSER CACHE ✓ REVERSE CACHING PROXY ✓ CONTENT DELIVERY NETWORK
- 34. USER SERVER
- 40. USER PROXY SERVER THE EDGE
- 41. USER VARNISH SERVER THE EDGE
- 42. USER VARNISH SERVER THE ORIGIN
- 45. EVERY IMPLEMENTATION HAS ITS OWN CACHE POLICY CONFIGURATION
- 46. HTTP HAS CONVENTIONAL BUILT-IN CACHING MECHANISMS
- 47. Expires: Mon, 20 Feb 2023 21:31:06 GMT
- 48. LIMITED OPTIONS
- 50. Cache-Control: private, no-cache, no-store
- 52. CACHING HOLD THE RESPONSE AND SERVE IT AGAIN UPON SUBSEQUENT REQUESTS
- 53. PRIVATE CACHE A CACHE THAT EXISTS IN THE CLIENT. E.G. A LOCAL DEVICE OR BROWSER CACHE. STORES DATA FOR A SINGLE USER.
- 54. SHARED CACHE A CACHE THAT SERVES MULTIPLE USERS. USUALLY A CACHING PROXY OR CDN. YOU SHOULD AVOID STORING PERSONALIZED DATA.
- 55. TIME TO LIVE THE AMOUNT OF SECONDS AN OBJECT IS CONSIDERED FRESH.
- 56. FRESH CONTENT CACHED OBJECT HASN'T EXPIRED YET. RESPONSE CAN BE REUSED FOR SUBSEQUENT REQUESTS.
- 57. STALE CONTENT EXPIRED CONTENT THAT SHOULD BE REVALIDATED BEFORE SERVING. IS NOT DIRECTLY REMOVED FROM THE CACHE.
- 58. REVALIDATE CONTENT ASK THE ORIGIN SERVER IF THE REQUESTED OBJECT IS STILL FRESH.
- 59. CACHE-CONTROL RESPONSE DIRECTIVES ✓ PRIVATE ✓ PUBLIC ✓ IMMUTABLE ✓ MAX-AGE ✓ S-MAXAGE ✓ NO-CACHE ✓ NO-STORE ✓ NO-TRANSFORM ✓ MUST-REVALIDATE ✓ PROXY-REVALIDATE ✓ MUST-UNDERSTAND ✓ STALE-WHILE-REVALIDATE ✓ STALE-IF-ERROR
- 61. Cache-Control: public CACHING ALLOWED, BOTH BY PRIVATE & SHARED CACHES
- 62. Cache-Control: public CACHING ALLOWED, BOTH BY PRIVATE & SHARED CACHES PROXY SERVERS BROWSER
- 65. Cache-Control: private CACHING ALLOWED, BUT ONLY BY PRIVATE CACHES
- 67. Cache-Control: private=Set-Cookie CACHING ALLOWED BY ALL CACHES, UNLESS A SET-COOKIE HEADER IS SET. THEN THE RESPONSE IS ONLY HANDLED BY PRIVATE CACHES
- 69. Cache-Control: public, max-age=100 ALL CACHES ALLOWED. CONTENT IS FRESH FOR 100 SECONDS.
- 71. Cache-Control: private, max-age=100 ONLY PRIVATE CACHES ALLOWED. CONTENT IS FRESH FOR 100 SECONDS.
- 73. Cache-Control: public, s-maxage=100 ALL CACHES ALLOWED. CONTENT IN SHARED CACHES IS FRESH FOR 100 SECONDS.
- 74. Cache-Control: public, max-age=60, s-maxage=100
- 75. Cache-Control: public, max-age=60, s-maxage=100 ALL CACHES ALLOWED. CONTENT IN PRIVATE CACHES IS FRESH FOR 60 SECONDS. CONTENT IN SHARED CACHES IS FRESH FOR 100 SECONDS.
- 76. Cache-Control: public, max-age=60 Age: 40 AGE HEADER DESCRIBES THE TIME IN SECONDS THE OBJECT WAS IN A PROXY CACHE.
- 77. Remaining TTL = TTL - Age
- 78. REVALIDATION
- 79. USER PROXY ORIGIN IS THE CONTENT STILL FRESH?
- 80. PROXY ORIGIN GET / HTTP/1.1 HTTP/1.1 200 OK
- 82. HTTP/1.1 304 Not Modified
- 83. CONDITIONAL REQUESTS HTTP/1.1 200 OK Host: localhost Etag: 7c9d70604c6061da9bb9377d3f00eb27 Content-type: text/html; charset=UTF-8 Hello world output GET / HTTP/1.1 Host: localhost
- 84. CONDITIONAL REQUESTS HTTP/1.1 304 Not Modified Host: localhost Etag: 7c9d70604c6061da9bb9377d3f00eb27 GET / HTTP/1.1 Host: localhost If-None-Match: 7c9d70604c6061da9bb9377d3f00eb27
- 85. CONDITIONAL REQUESTS HTTP/1.1 200 OK Host: localhost Last-Modified: Fri, 22 Jul 2016 10:11:16 GMT Content-type: text/html; charset=UTF-8 Hello world output GET / HTTP/1.1 Host: localhost
- 86. CONDITIONAL REQUESTS HTTP/1.1 304 Not Modified Host: localhost Last-Modified: Fri, 22 Jul 2016 10:11:16 GMT GET / HTTP/1.1 Host: localhost If-Last-Modified: Fri, 22 Jul 2016 10:11:16 GMT
- 87. VALIDATE QUICKLY
- 88. EARLY
- 91. USER PROXY ORIGIN ASYNC FETCH SEND STALE RESPONSE WHILE FETCHING
- 92. Cache-Control: public, max-age=3600, stale- while-revalidate=100
- 93. Cache-Control: public, max-age=3600, stale- while-revalidate=100 ALL CACHES ALLOWED. CONTENT IS FRESH FOR 1 HOUR. STALE CONTENT CAN BE SERVED UP TO 100 SECONDS PAST THE TTL WHILE DOING AN ASYNCHRONOUS REVALIDATION.
- 94. USER PROXY ORIGIN FETCH FAILED SEND STALE RESPONSE WHILE FETCHING FAILS
- 95. Cache-Control: public, max-age=3600, stale- if-error=86400
- 96. Cache-Control: public, max-age=3600, stale- if-error=86400 ALL CACHES ALLOWED. CONTENT IS FRESH FOR 1 HOUR. STALE CONTENT CAN BE SERVED UP TO 1 DAY PAST THE TTL WHILE THE ORIGIN IS UNREACHABLE.
- 97. Fresh = TTL > 0 Async revalidation = TTL + stale > 0 Synchronous revalidation = TTL + stale <= 0
- 98. Fresh = TTL > 0 Async revalidation = TTL + stale > 0 Synchronous revalidation = TTL + stale <= 0 REVALIDATION CAN BE DONE CONDITIONALLY
- 99. Cache-Control: public, max-age=3600, must-revalidate
- 100. Cache-Control: public, max-age=3600, must-revalidate ALL CACHES ALLOWED. CONTENT IS FRESH FOR 1 HOUR. SERVING STALE CONTENT NOT ALLOWED.
- 101. Cache-Control: public, max-age=3600, proxy-revalidate
- 102. Cache-Control: public, max-age=3600, proxy-revalidate SAME AS MUST- REVALIDATE BUT FOR PROXY SERVERS
- 103. Cache-Control: public, max-age=86400, immutable
- 104. Cache-Control: public, max-age=86400, immutable ALL CACHES ALLOWED. CONTENT IS FRESH FOR 1 DAY. CONTENT WILL NOT BE UPDATED WHILE FRESH
- 105. Cache-Control: public, max-age=86400, immutable ALL CACHES ALLOWED. CONTENT IS FRESH FOR 1 HOUR. CONTENT WILL NOT BE UPDATED WHILE FRESH USEFUL FOR BROWSER CACHING
- 106. Cache-Control: public, immutable DATA IS IMMUTABLE, ASSUME HIGH TTL IN PROXY CONTEXT
- 107. Cache-Control: public, max-age=3600, no-transform
- 108. Cache-Control: public, max-age=3600, no-transform ALL CACHES ALLOWED. CONTENT IS FRESH FOR 1 HOUR. CONTENT CANNOT BE TRANSFORMED BY INTERMEDIARY CACHES
- 109. Cache-Control: public, max-age=3600, no-transform EDGE COMPUTE
- 111. Cache-Control: no-cache STORE OBJECT IN CACHE BUT REVALIDATE BEFORE EVERY REUSE
- 112. Cache-Control: no-cache=Set-Cookie STORE OBJECT IN CACHE BUT REVALIDATE BEFORE EVERY REUSE IF THE SET-COOKIE HEADER IS SET
- 114. Cache-Control: no-store DON'T STORE OBJECT IN THE CACHE
- 115. Cache-Control: private, no-cache, no-store TYPICAL ONE
- 116. CACHE VARIATIONS
- 118. ‣ http://test.com/ -Accept-Language: fr -Accept-Language: nl -Accept-Language: en GET / HTTP/1.1 Host: test.com Accept-Language: fr GET / HTTP/1.1 Host: test.com Accept-Language: en
- 120. SURROGATES
- 121. THE EDGE
- 123. USER EDGE ORIGIN THE EDGE IS NO LONGER IN THE ORIGIN DATA CENTER
- 124. USER EDGE ORIGIN THE EDGE MOVES CLOSER TO THE END USER
- 125. USER EDGE ORIGIN MULTIPLE EDGES USER EDGE
- 131. SURROGATE CAPABILITY
- 135. Surrogate-Control: max-age=60, max- age=86400;varnish, max-age=3600;cdn, content="ESI/1.0";varnish
- 137. PERSONAL DATA
- 139. AJAX
- 142. ESI ✓ PLACEHOLDER ✓ PARSED BY EDGE CACHE (VARNISH) ✓ OUTPUT IS A COMPOSITION OF BLOCKS ✓ STATE PER BLOCK ✓ TTL PER BLOCK
- 143. EDGE Surrogate-Capability: key="ESI/1.0" Surrogate-Control: content="ESI/1.0" <esi:include src="/header" /> ORIGIN Parse ESI placeholders EDGE
- 144. <!DOCTYPE html> <html> <body> <esi:include src="/header" /> <p>Welcome</p> </body> </html>
- 145. <!DOCTYPE html> <html> <body> <p>The current time is 21:07:53.</p> <p>Welcome</p> </body> </html>
- 146. THIS IS JUST THE TIP OF THE ICEBERG
- 147. EVERY IMPLEMENTATION HAS ITS OWN CACHE POLICY CONFIGURATION REMEMBER THIS ONE?