WEBFLOW SITE SPEED: How to Optimize Videos
Вставка
- Опубліковано 3 лис 2024
- Hello there. In this video we'll talk how to optimize one of the assets that impact your Webflow site speed. And that's videos.
By default, browsers do not lazy-load videos. And when it comes to open up a page that is video-heavy, this plays a huge role on how fast your users can get started, complete a form, or download something from your Webflow site.
👇 Cloneable that shows how the solution works:
webflow.com/ma...
📄 Full Documentation & Tools Used:
thelumious.not...
Thanks Man! no one has on UA-cam, covered the webflow speed optimization like you are doing. Keep it up and waiting for more videos.
Great comment, buddy. Thanks for your support.I appreciate it.
Bro your playlist about optimizing Webflow to Google's Core Web Vital is so good! Subscribed, liked and now commented to just appreciate your work. Your are such a good story teller? The delivery and presentation is clear, generous and to the point. The value we're getting is tremendous, thank you so much. Wyatb!
Thanks a lot!
Great video Chris! Another way to host the videos could be to uploading an mp4 into Webflow's background video element, publish it, and then inspect the page and look for the mp4 link that Webflow provides.
Yep, works too only if the video is not bigger than 30 MB. But if you have small one, let's say up to 3-4 minutes long - I guess it works. I'm hosting mine from CF bc sometimes webflow have bugs with these background video components.
I'm in love with this! I can't wait to pressure test it!!
Pressure test it, buddy. This is the first version of the code so if you will find any bugs or have ideas, let me know. The code is also available on github.
Hey Chris, your channel is fire 🔥Thanks for all the optimization tips!
😂thanks man. Your comment made my day. Don't even need coffee.
Great info, subsrcibed. Wish something like this could work for CMS...Currently I have plain text fields binned to embed codes pulling vimeo direct url links.
Dear Chris, a great thanks for your tutorial.
I know it's 7 month and I don't know if you have time to answer me.
I add your component on CMS and it's work great cause the lazy load at end.
When I use on my first page on the Hero/header I got really poor performance on page speed insight.
I actually try Amazon S3 and it's same.
I try with google cloud service and it's same.
If I use the background video from Webflow it's eager load but poor performance too...
Do you have any suggestion ?
Great video man
Thanks!
How can I prevent a small window from appearing when loading a video?
Those. Now I see that a small video window appears, then it stretches to the size of the loaded video?
It doesn't look very nice, how can I avoid this?
You mean the lightbox? You have full design control over the lightbox and it's size. If you don't need the lightbox, jsut don't add the attributes. Let me know if I guessed right.