Make a video NOT slow a site down

Hi All,
I was wondering as a general rule, if you add a video to a webpage as an autoplay, how can you do this without overloading the loading speed of the site?
We are just wondering, do you embed straight from youtube, use Revolution slider in Wordpress.
Any advice on this would be great.
Thanks,
A
LVL 11
Amanda WatsonWeb DeveloperAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

 
KimputerCommented:
If you KNOW your website has limited bandwidth available, embed from another high speed site like YouTube.
The question can only be answered if you KNOW your current max bandwidth along with estimated views of the videos per time slot (hour or minutes if possible).
If you don't know, play it safe, embed YouTube.
0

Experts Exchange Solution brought to you by ConnectWise

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
 
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
To expand, it is always best to embed your video from a CDN (Content Delivery Network).  There are a lot of options such as https://www.akamai.com/uk/en/resources/video-cdn.jsp or https://aws.amazon.com/cloudfront/  If you search for video cdn you will find more choices.

The advantages of using a CDN instead of your site is not only will the video load from outside of your own server, it will load from a server nearby the viewer. When you upload your media to a CDN, they copy your media to multiple servers around the country (or globe) and part of their service is to detect where the viewer is and load the media from the server nearest the user.  

While a CDN gives you the most control over your media, it will also have a cost associated. Youtube does a great job of streaming. I live in a rural area and on a good day my home internet speed is 1.5Mbts and can be down to .5.   There are times when videos from other sites will not stream but Youtube does.  While youtube is free, you do not have full control of your media and they can place ads over it.

The other aspect to your video loading quickly is how you save it.  Sites like youtube will automatically optimize your video but doing it on your own takes some trial and error to play with size, aspect ratio, frame rate and bit rate.  You can use https://handbrake.fr/ to optimize your video and I suggest reading up on the subject as it is not a short answer.
2
 
David FavorLinux/LXD/WordPress/Hosting SavantCommented:
You can take Scott's approach + host the video on a CDN. For my hosting clients, I recommend against this, because CDNs tend to be horribly glitchy, especially CloudFlare. If you don't mind your video being missing or very slow sometimes, use a CDN.

If your site has correct expires headers set serving videos isn't an issue, because the video only downloads once, into each visitors cache + then subsequent visits (including moving from one page to another on your site), will load the video + many other assets/files from browser cache.

Use https://WebPageTest.org to ensure expires headers are correct. Change hosting if they're wrong.

I do suggest you run your video through some serious compression using latest ffmpeg. My ffmpeg version shows to be... 3.4.1 as of today.

Most background videos can be  compressed to size similar to a large jpeg.

So my guidelines to clients.

1) Self host your videos (all videos).

2) For large videos (like courseware), use PHP pseudo streaming (see GitHub for free code to do this).

3) For small videos (like backgrounds), just compress them well.

4) Make sure your site correctly runs HTTP2 + correctly sends expires headers.

This is all you require.
0
 
Scott Fell, EE MVEDeveloper & EE ModeratorCommented:
> , especially CloudFlare

Is that the free version or paid?  

If you notice, my first choice was akamai. You do want to stick with a service that is meant for media. CloudFlare has a free tier and a cheap tier. They also show their stream service is in beta. It wouldn't be my first choice for this type of thing to start with.

I differ from David, streaming yourself is not a good idea unless you have very few users that are generally in the same location and you are using a dedicated server.  My own testing was with a shared service, my dedicated service and a CDN that is meant for video.  Tests were done for users on the west and east coast of the US and Europe.  The slowest by far was hosting on a shared server with no special streaming  software. The dedicated server is based in the midwest and was micro faster than the CDN in the mid west and east coast and slightly slower than the CDN in the west coast. The CDN outperformed in Europe. But looking at the potential strain on the server that also shares resources with others I would not have allowed it.

If you have one or two videos with limited visitors, it may not make a difference as far as hosting, then it is up to how you have encoded the video to make the biggest difference.
1
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.