Can I cache a large .js and .css file that is loaded on my site inside a cross-domain iframe

Is it possible to set an Edge Cache TTL or some other caching mechanism for a large .js file and .css file to cache when it is served to my site via an iframe with a src that is on another domain that I only have limited control over (e.g. I cannot change cache header settings on that other domain).

So, for example, there is a file main.js that is being served through an iframe with src="some_other_domain.com" which is an iframe on “my_domain.com”

Is this possible with cloudflare? My goal is to improve Google Core Web Vitals with regard to their recommendation to “Serve static assets with an efficient cache policy”. The two files are just over 2MB and served every time the page loads, so should be good caching candidates.

You don’t need an Edge Cache TTL, as that resource will cache by default. But you’re certainly welcome to try Edge Cache TTL if you just want to try to extend its cache duration. Don’t be surprised if it gets evicted early, though.

Rule of thumb is that if the browser sees that JS or CSS file as a URL pointing to a :orange: Proxied hostname, it’ll be cached. You can verify this by checking the Network tab in your browser’s Dev Tools.

Based on your description, the answer will be “no” because it’s “some other domain” that isn’t on Cloudflare.

Thank you for the reply. Yes, you are correct the Network tab shows the following in the Response Headers:
cache-control: no-cache, must-revalidate
content-length: 1914754
content-type: application/javascript
date: Sun, 18 Apr 2021 16:27:04 GMT
expires: Fri, 01 Jan 1990 00:00:00 GMT
last-modified: Tue, 13 Apr 2021 06:17:26 GMT
pragma: no-cache

And the Request Headers are:
accept: /
accept-encoding: gzip, deflate, br
accept-language: en-US,en;q=0.9
cache-control: no-cache
pragma: no-cache

You are correct, this other domain in the iframe is not cloudflare proxied, so I was wondering if there is a way to put a “copy” of this .js file on my cloudflare edge to save the end user from having to wait for it to be downloaded with each page load. Hope that makes sense… but maybe its just not possible?

There’s no way, as the iframe src isn’t on your domain either. An iframe is a completely different website loaded into what amounts to a separate window (like Picture in Picture) in the browser.

This topic was automatically closed 5 days after the last reply. New replies are no longer allowed.