So I noticed a quirky bug, that I am not sure how to circumvent. When an IOS user puts their phone into low-power mode, videos stop loading on my Ionic application.
The videos are stored on Cloudinary and are being delivered to the device correctly, but they are not displaying. So instead of a normal video, it just displays a white background.
According to Apple docs:
In Low Power Mode, iOS conserves battery life by enacting certain energy-saving measures, such as reducing CPU and GPU performance, reducing screen brightness, and pausing discretionary and background activities.
Which an article I found states that:
Background activities and networking are paused to prevent unnecessary power drain in the background.
But I wouldn't imagine that this would affect video loading, even if they are set in normal video tags, would it?
Here is the relevant code for loading the video:
<video[muted]="true" playsinline loop preload="auto">
<source [src]="media.url" type="video/mp4">
</video>
I tried changing the preload tag to the other available attributes, but it didn't change anything. The videos still do not load.
I checked other applications (non-Ionic), such as Facebook and Instagram, and their videos appear to load just fine within the application, so I believe it has something to do with the HTML5 video tag.
According to this article
According to our testing when an iOS 11+ device is in low power mode autoplay even muted is forbidden by the OS. This does not apply to iOS 10 and below. Radiant Media Player will properly handle autoplay requests when low power mode is engaged in iOS 11+ by providing a play button to initiate playback (a user interaction will be needed in such case as autoplay would have failed).