Cache Background Videos

Hompage hero slider has 4 short background vids ~20s & 20MB each. I want each cached so hompage reloads FASTER! Caching just the first and delaying the other 3 would be great too. Perhaps this was a bad idea in the past because videos were too large to cache, but I’m guessing it is fine in 2019? Research shows it may be more than giving them a class with a few lines of code, but many forum responses I searched were old.

https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fwongwebworks.com

The videos already cached. Webflow hosting is very very fast. Anyway, your videos are not 20mb (But 1-4mb after compression).

image

Inspect --> Get cache data.

disk cache:

Inspect Guide (Very long):

Compress images + Anyway google-speed test “not friendly” for videos above fold (Get low score on mobile). The reality is matter (The site fast or not on mobile).

1 Like

Thank you. 6 seconds isn’t bad for all the stuff I have, but I want ~3 secs. I haven’t actually optimized much yet, but I noticed that all the site speed checkers are saying my images aren’t automatically compressed enough or lacking jpeg 2000 and other formats that are faster. Perhaps that is because the speed checkers rated Webflow’s desktop rendering for images and not Webflow’s mobile rendering? Did you notice anything else strikingly bad for SEO besides just moderately big files? (and my lack of metadata). I think that delaying 3 of the 4 videos will help slightly. That can be done by giving vid #2 a 3 sec delay, vid #3 a bigger delay, and vid #4 another delay with just a couple lines of JS, correct?

Your site works for me in instant load (Desktop / mobile). No need for any custom code her - also webflow format use “poster” (Show image X until the video load).
Your videos are fine.

Again webflow use the best hosting technology out there.

Minify CSS and html to improve a little (Under setting -> hosting) + tinyjpeg big images.

image

jpeg 2000 - 99% of the sites don’t use this format yet.

SEO test is another scope

Use online test-tools (Google it).

From fast look -
Add og data + Short - “weak” titles (Example - change “About” to “about us | Company name” or other more specific text).

homepage - maybe add one section of text and image (More data for users about the company) + Its hard to know the company name (www - wong? what?)

This button not working (Add url)
image

Super great and concise help! I didn’t realize Webflow natively used posters. Your help will definitely make this a great showcase as I optimize it. I guess the speed checkers I used are a little harsh these days on some trivial things. SEO will be great soon. Check the site again in a week to see some crazy progress!

1 Like