Historically, detecting visibility of an element in a web page, in this case a media player, has been a difficult task for which solutions have been unreliable and prone to causing the browser and the sites the user is accessing to become sluggish. Playing video on a web page is never not-taxing: it affects load page performance, consumes more client-bandwidth, drains battery life faster ... Thus the need to detect when a video player comes into view (e.g. becomes visible to the viewer) is important to increase viewer experience and reduce resources usage.
Thanks to the Intersection Observer API, detecting when an element becomes visible is now reliable and affordable on a resource point of view. With Radiant Media Player 4.7.1, we have built support for the Intersection Observer API directly into player. Enabling it can be done in a snap.
The Intersection Observer API is available in most modern browsers (it is to be noticed though that support is still not available in macOS/iOS Safari as of January 2019) and also works when the player is used through an iframe.
Enables visibility detection and once the player becomes visible request autoplay. On mobile devices and latest macOS Safari only muted autoplay will be available. Default: false.
Enables visibility detection and once the player becomes visible request play (autoplay on first visibility) - when player is not visible anymore pause player allowing for less resources usage. Default: false.
The threshold upon which the player is considered visible in the viewport. By default the player is considered visible when half (e.g. 0.5) of its surface is visible. Default: 0.5.
See Radiant Media Player viewable feature at work here.