浏览器缓存中的静态内容

Question

I am trying to update the configuration which effects the browser caching settings for static resources (js, css, images).

I have Sitecore CMS site and images uploaded in CMS, these images are cached in browser (status code = 200 (from cache), when i observed the network in Chrome browser), but my other resources like js and css which served from Website folder are not cached in browser, and the status code is 304 (which is server cache and there is a round trip required to check for any update.)

I have below config settings in web.config file:

---

    <caching>
        <profiles>
            <add extension=".jpeg" policy="CacheUntilChange" kernelCachePolicy="DontCache" />
            <add extension=".js" policy="CacheUntilChange" kernelCachePolicy="DontCache" />
            <add extension=".png" policy="CacheUntilChange" kernelCachePolicy="DontCache" />
            <add extension=".jpg" policy="CacheUntilChange" kernelCachePolicy="DontCache" />
            <add extension=".css" policy="CacheUntilChange" kernelCachePolicy="DontCache" />
            <add extension=".json" policy="CacheUntilChange" kernelCachePolicy="CacheUntilChange" duration="00:00:30" />
        </profiles>
    </caching>
    <staticContent>
        <remove fileExtension=".woff2" />
        <mimeMap fileExtension=".json" mimeType="application/json" />
        <mimeMap fileExtension=".woff2" mimeType="application/x-font-woff2" />
        <clientCache cacheControlMode="UseMaxAge" cacheControlMaxAge="30.00:00:00" />
    </staticContent>

---

Now if i remove the caching-profiles entry, then the resources are cached in browser, i can see all the css, js status code as 200 (from cache) for the subsequent request.

My question here is, what is the difference here, why browser cache didn't worked even there is a staticContent settings are added. What is the impact if I remove the existing caching-profiles settings (will it impacts server cache?).

I saw some other links , which explains static cache settings, but i want to know the impact with the changes i did (removed caching-profiles)

Please let me know your inputs.

Below are the Response header details: With caching-profiles :

Without caching-profiles :

Thanks, Sharath

Answer 1

So, it appears you are configuring IIS output cache for .jpeg , .js , ..., within the web.config system.webServer/caching node (beware, .webServer , not .web ).

Unfortunately, IIS output cache (and Asp.Net output cache too by the way) does also handle client caching, and so it interferes (badly) with your client caching settings. (It should be two separate matters in my opinion, but that is not the way IIS/Asp.Net output caches handle it.)

Your profiles do not set the location attribute , so they default to Server . With output cache semantic, this means "no client cache", thus the no-cache it adds in Cache-Control response header.

To avoid this, you may change your profile location to Any .

<profiles>
  <add extension=".jpeg" location="Any" policy="CacheUntilChange" kernelCachePolicy="DontCache" />
  <add extension=".js" location="Any" policy="CacheUntilChange" kernelCachePolicy="DontCache"  />
  <add extension=".png" location="Any" policy="CacheUntilChange" kernelCachePolicy="DontCache" />
  <add extension=".jpg" location="Any" policy="CacheUntilChange" kernelCachePolicy="DontCache" />
  <add extension=".css" location="Any" policy="CacheUntilChange" kernelCachePolicy="DontCache" />
  <add extension=".json" location="Any" policy="CacheUntilChange" kernelCachePolicy="CacheUntilChange" duration="00:00:30" />
</profiles>

But maybe should you simply not use IIS output-cache for .jpeg , .js , ...
From official IIS documentation :

Output caching is unnecessary for static files, such as HTML, JPG, or GIF files, ...

It has no benefit using IIS output cache for static files. (It may have benefits using an actual cache server such as varnish in front of your IIS, but emulating a cache server with IIS output cache has no benefit for static files.)

If you have some special cases URIs endings with static file extension but actually served dynamically by your application instead of directly corresponding to a file on disk (special case usually involving using rammfar which is a bad thing for application scalability; linked page gives some alternates by the way), better try enabling output-cache only for those URIs, by configuring it under

<configuration>
  ...
  <system.webServer>
    ... <!-- not here! -->
  </system.webServer>
  ...
  <location path="yourDynamicImagesUriBasePath">
    <system.webServer>
      <caching>
        ... <!-- move it here -->

(I am not sure it works though, better test it of course.)