2

For a web-based media player project, I'm experimenting with some subtle background video with a simple <video> tag, positioned behind other elements on the page. This is great on desktops and smart TVs, but I have no interest in taking CPU and battery on mobile devices and laptops on battery for this feature. For those devices, a static image is fine.

Is there any standard for indicating to the browser that a particular video element can be disabled if in a resource constrained environment? Ideally, something I can indicate that the video is not critical and let the browser decide whether to display it or not, based on user preferences or device properties.

Brad
  • 146,404
  • 44
  • 300
  • 476
  • Possible duplicate of [Prevent HTML5 videos from downloading the files on mobile - videojs](https://stackoverflow.com/questions/28605591/prevent-html5-videos-from-downloading-the-files-on-mobile-videojs) – Alexandre Aimbiré Nov 26 '18 at 19:04
  • @AlexandreAimbiré Not quite the same... Mobile is one thing, but I'm more curious about any existing standards for indicating that the video is optional and letting the user agent decide, based on battery, CPU, user preference, and possibly other factors. – Brad Nov 26 '18 at 20:02
  • Check this [link][1] [1]: https://stackoverflow.com/questions/9514179/how-to-find-the-operating-system-version-using-javascript#answer-18706818 you may find you answer. – Sukhjinder Singh Dec 04 '18 at 11:39
  • How would would you define a "*resource constrained environment*"? Should a laptop with 10hrs battery life be taken differently as the same with 10min left? Should a machine running a 3d renderer and video editing and.. overall already eating 99% of CPU usage be taken differently than the same with just your web-app running? What when these factors change? To answer the question, no, there is no such standard being defined, all UAs do check is the network conditions for preloading of media. – Kaiido Dec 04 '18 at 12:16
  • @Kaiido I wouldn't define it specifically... I want the user agent to define it. I want to simply define unimportant things that the user agent can start throwing out the window when it wants to save resources. I assumed there was no standard for this, but figured I would throw it out there and ask around anyway. If you could post that as an answer, that there is no such standard, that would be great. Thanks! – Brad Dec 04 '18 at 15:22

2 Answers2

0

The answer seems to be that no, there is no standard for this today.

(If you're reading his from the future, and this has changed, please post an answer!)

Brad
  • 146,404
  • 44
  • 300
  • 476
-1

You can try to detect it with CSS and turn this off. For example:

@media (max-width: 640px) {
  video {
    display: none;
  }
}

Also you can try to detect platform using JavaScript:

navigator.platform

  • But there is no any other better way to detect if the site is displayed on mobile. You cannot check what kind of processor do the user have. You can ask for this info in some popup, but this would be useless in terms of user experience – Maciej Bledkowski Dec 04 '18 at 11:52
  • I thought I made a comment on this question earlier, but apparently not. This answer doesn't answer the question. All you're doing here is detecting width of the screen in pixels. This has nothing to do with whether or not the client has plenty of CPU capability, is on battery, etc. Additionally, your suggestion isn't even a good way to detect mobile devices. My phone's screen has more pixels on it than my laptop, for example. – Brad Dec 04 '18 at 15:28
  • To clarify my question... I'm less looking for a way to determine system capability, and more looking for a way to indicate to the browser what elements are less important, that it can throw away if it needs to save power for whatever reason. I don't think this is possible, which is why i asked the question. If the answer is, "it isn't possible today", then that's a fine answer. – Brad Dec 04 '18 at 15:29