How to leverage browser cache for video files

Hi,

I asked at other places but none could give me an answer nor googleing returns a good and satisfactory solution.

How to leverage browser caching for video files (mp4, webm etc). I have created a sub domain where I stored a video file which is being used for the background of my homepage. This is the file http://imgs.iconicwebteam.com/home-background.mp4

As you can see, the video is being fetched from a subdomain. Now, I wish to set an expiratory date to that file since I do not wish to get it downloaded again and again from the server. I have cloudflared routing my DNS. I asked them, but they do not do ( read recommend) caching for video files.

I asked my WP Fastest Cache plugin author and he said there is no need to cache such file since it a static one and static files need not to be cached.

I also thought of implementing

<IfModule mod_expires.c> ExpiresActive On ExpiresByType video/mp4 "access 1 month" ExpiresByType video/webm "access 1 month" </IfModule>

in the htacces file inside the sub domain. Am I going in the right way? Please advise any steps or is it at all needed to cache that video files.

There are different caches (server and browser) which is why the WP Fastest Cache author said it doesn’t need caching - the plugin does server-side caching to make serving the pages faster, it doesn’t deal with expires times and the browser cache.

Your .htaccess route is the correct way to go.

Now that that is out of the way…video for a page background? It might look cool but that can’t possibly be a good idea for the user experience. Assuming you are running it in a loop and have content over it the browser is going to have to do a crapton of work for every video frame and you’ll be burning your users batteries pretty hard while they’re sitting on your page.

Thank you very much pmeenan for your such a prompt reply. At least I got some answers from somewhere. Thanks for this. Also, pleased my code in the .htaccess file in the sub-domain is the correct one.

As for other concern, I really appreciate what you have said. Mine is a bit different case.

Visit this URL http://www.iconicwebteam.com/ and I hope you’d better understand my intention. This homepage is just a landing page/welcome page with very little info. Now I have put a js code there so that it auto redirects to another page http://www.iconicwebteam.com/home/ after 6 seconds. In this case, I hope the user won’t be on that page with the video background for long. Instead, they will be taken to more standard homepage which has not video at all anywhere.

Makes sense? Would love to take your experts feedback on this.

Thanks once again for your time and support.