diff --git a/www/docs.md b/www/docs.md index 7a34ea44..cfb41f72 100644 --- a/www/docs.md +++ b/www/docs.md @@ -39,6 +39,7 @@ customClasses: wide-content * [debugging](#debugging) * [hyperscript](#hyperscript) * [3rd party integration](#3rd-party) +* [caching](#caching) * [security](#security) * [configuring](#config) @@ -1288,6 +1289,29 @@ example uses Alpine's `$watch` function to look for a change of value that would ``` +## [Caching](#caching) + +htmx works with standard [HTTP caching](https://developer.mozilla.org/en-US/docs/Web/HTTP/Caching) +mechanisms out of the box. + +If your server adds the +[`Last-Modified`](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Last-Modified) +HTTP response header to the response for a given URL, the browser will automatically add the +[`If-Modified-Since`](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/If-Modified-Since) +request HTTP header to the next requests to the same URL. Be mindful that if +your server can render different content for the same URL depending on some other +headers, you need to use the [`Vary`](https://developer.mozilla.org/en-US/docs/Web/HTTP/Caching#vary) +response HTTP header. For example, if your server renders the full HTML when the +`HX-Request` header is missing or `false`, and it renders a fragment of that HTML +when `HX-Request: true`, you need to add `Vary: HX-Request`. That causes the cache to be +keyed based on a composite of the response URL and the `HX-Request` request header — +rather than being based just on the response URL. + +htmx also works with [`ETag`](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/ETag) +as expected. Be mindful that if your server can render different content for the same +URL (for example, depending on the value of the `HX-Request` header), the server needs +to generate a different `ETag` for each content. + ## [Security](#security) htmx allows you to define logic directly in your DOM. This has a number of advantages, the