Caching on the web
0 likes•400 views
Caching is an important technique for improving performance on the web. It allows frequently requested resources like documents, images, and scripts to be stored locally for faster retrieval. Caching can occur at various levels including in the browser, network through CDNs, on servers through tools like Nginx, and within applications using memoization and cache stores. Defining appropriate caching policies and strategies using HTTP headers is key to an efficient caching implementation.
Caching on the web
- 4. Cache is a hardware or software component that stores data so future requests for that data can be served faster - Wikipedia
- 5. Caching and RAM is the answer to everything - about Flickr Architecture
- 6. Caching is one of the secrets of high scalability and performance
- 7. Where could cache be present on the web? • Browser • Network • Server • Application
- 9. Caching would be useless if it did not significantly improve performance - HTTP/1.1 specification
- 10. The user might reuse assets during navigation
- 11. • Documents • Images • Scripts and CSS • Asynchronous Requests What could be cached?
- 12. HTTP headers have the responsibility to define if a response could be cached and for how long
- 13. GET /main.css HTTP/1.1 Host: jcemer.com
- 14. GET /main.css HTTP/1.1 Host: jcemer.com HTTP/1.1 200 Date: Tue, 13 Sep 2016 13:32:50 GMT Cache-Control: max-age=604800 <Response Data>
- 15. allows the response to be stored in cache Cache-Control: max-age=604800 Response header
- 16. CSS is requested once during navigation 😄 😄
- 17. The browser requests it again only if the cache expires or if the user force refreshes the page
- 18. allow to add more info about the resource Last-Modified: Mon, 12 Sep 2016 22:06:39 GMT Etag: W/"337e7-8HrLmYe6UGIUDolQeGLoyw" Response headers
- 19. GET /main.css HTTP/1.1 Host: jcemer.com HTTP/1.1 200 OK Date: Tue, 13 Sep 2016 13:32:50 GMT Last-Modified: Mon, 12 Sep 2016 15:23:17 GMT Cache-Control: max-age=604800 new
- 20. allow reuse the cached resource if it didn’t change If-Modified-Since: Mon, 12 Sep 2016 15:23:17 GMT If-Match: W/"337e7-8HrLmYe6UGIUDolQeGLoyw" Request headers
- 21. GET /main.css HTTP/1.1 Host: jcemer.com If-Modified-Since: Mon, 12 Sep 2016 15:23:17 GMT
- 22. GET /main.css HTTP/1.1 Host: jcemer.com If-Modified-Since: Mon, 12 Sep 2016 15:23:17 GMT HTTP/1.1 304 Not Modified Date: Tue, 13 Sep 2016 13:32:50 GMT Cache-Control: max-age=604800 HTTP/1.1 200 OK Date: Tue, 13 Sep 2016 13:32:50 GMT Last-Modified: Mon, 12 Sep 2016 15:23:17 GMT <Response Data> <No Response Data>
- 23. A Website with the HTTP headers wisely defined will provide a better experience for the users
- 24. Networkcaching
- 25. Content Delivery Network (CDN) is a globally distributed network of proxy servers - Wikipedia
- 26. allows proxy servers to cache the content Cache-control: public
- 27. Servercaching
- 28. Finally, the control is all on your hand, developer!
- 29. Cache server
- 30. The cache server stay between the user and the application or other servers
- 31. • Shared documents • Images • Scripts and CSS • Asynchronous Requests What could be cached?
- 32. • Varnish • Squid • nginx Tools https://varnish-cache.org http://www.squid-cache.org https://www.nginx.com
- 33. location / { proxy_pass http://otherserver; } the nginx intermediates the client request’s
- 35. proxy_cache_path /path/to/cache; location / { proxy_pass http://otherserver; proxy_cache cache; } caching!
- 37. The proxy caches content relying only on the application HTTP headers
- 38. t1 t2 t1 request at a different time
- 39. 😓 … t1 t1 t1 x3
- 40. proxy_cache_lock on; proxy_cache_lock_timeout 180; allow the proxy to delegate only the first of similar requests at a time
- 41. t1 t1 😄x1
- 42. All clients are waiting until receive the response when the first request returns
- 43. What happen in case of failures? 🤒
- 44. allows to delivery expired content in case of failure proxy_cache_use_stale timeout error http_500;
- 45. 😄 🤒
- 46. The proxy could improve the fault tolerance of the application
- 47. proxy_cache_use_stale updating; delivers expired content for the subsequent similar requests
- 48. Appcaching
- 49. Caching on the app reduces the time of specific operations
- 50. • Complex computations • Data shared across requests What could be cached?
- 51. def price @price ||= Price.new(unit_price, category) end
- 52. Memoization stores the results to avoid future calculations
- 53. A global code memoization is going to last in-memory during all the application execution cycle
- 54. $price = Price.new(unit_price, category) 😓
- 55. cache.fetch("cat#{cat_id}", expires_in: 1.minute) do CatagoryTax.new(cat_id) end http://api.rubyonrails.org/classes/ActiveSupport/Cache/Store.html ActiveSupport::Cache::Store
- 56. Rails Caching API allows store and reuse data during an amount of time across requests
- 57. https://github.com/ptarjan/node-cache/issues/77 😓
- 58. 🔥
- 59. Rails Memory Caching wisely prunes the cached data when it exceeds the allotted memory size
- 60. One of the ways to scale an application is through adding more application instances (scale horizontally) 😓
- 63. Never assumes that anything cached in memory or on disk will be available on a future request https://12factor.net/processes
- 64. Any storage could be used to share cache data between instances but the Key-value Storages are the most common
- 65. • Redis • Memcached Key-value Storages http://redis.io http://memcached.org
- 67. These tools have different policies to prune the amount of cached data
- 68. Cache Storages might also be fault tolerable with replication and persistence http://redis.io/topics/persistence http://redis.io/topics/replication http://redis.io/topics/sentinel
- 70. Race condition happens when different application instances fetch for a not cached data at the same time 😓
- 71. expired data! 😁
- 72. cache.fetch(key, race_condition_ttl: 10.seconds) do heavy_db_computation end http://api.rubyonrails.org/classes/ActiveSupport/Cache/Store.html ActiveSupport::Cache::Store
- 73. 😁 😳
- 74. It is difficult to completely eliminate cache updating race conditions issues with multiple application instances
- 75. A solution for that is to update the cache data outside the application flow and just consume cached data on the application
- 76. 1. Obey the HTTP headers
- 78. 3. Measure the miss/hits of the caching strategy
- 79. 4. Evaluate carefully the caching strategy options
- 80. Thanks!@jcemer