Cordova iPad app - video stalling - javascript

I'm building content for an iPad app using Cordova. Since the app has already been built and is populated by a CMS, I can't add any extensions or plugins or modules or anything to it (that seems important to mention). The content I'm building is almost entirely video-driven, basically I have a bunch of <video> tags that are triggered by tap events. The videos are all loaded, as I said, from the CMS, not included with the app payload itself.
Most of the time it works fine, but occasionally a video starts playing and will stall about halfway through. My video files aren't very big, they're only about 13 seconds long, ~700kb or so each.
When a video stalls, the following error is logged to the console:
Took background task assertion (5) for playback stall
Ending background task assertion (5) for playback stall
The number in brackets will vary.
I haven't got a scooby as to what this means, and I'm pretty much a complete novice when it comes to the Xcode/Cordova world – Front-end dev is my thing, but the Cordova world is new to me. I can't figure out what's causing it, it seems to be random. I'm assuming it's possibly a bitrate/bandwidth thing, but that doesn't make sense because when a video is triggered, I'm detecting it's readystate in order to wait for it to load in before playing, so theoretically it should be fully-loaded before it starts playing.
Any solutions or tactics to try out? I'm kind of at a loss, and the internets and googles aren't being overly helpful when searching for that particular error message.

If the problem is the loading, a nice trick in Cordova is trying to set it in a (small) timeOut, so that the rest gets loaded before the video. As mentioned above, the readtyState option isn't always reliable.

Related

Why does a single Flash or video element while loading freeze the entire web page?

This happens way too often and I finally realized why... you go to a webpage, you're reading or scrolling, then suddenly it freezes and doesn't respond for several seconds... today I (consciously) noticed that it unfroze after a certain box started "playing" (video? interactive content? not sure), so I think it's either Flash or video or something similar in Javascript or something else that's waiting to load and the entire web page just freezes...
This is really terrible design/implementation/intention on a web page (though I've seen it in computer operating systems and programs/apps too), and I can't tell if this is intentional or unintentional, but
is this because of "synchronous" loading, or some quirk with internet technology, or what?
I can't figure out why these problems still prevent normal usage of our software tools in this day and age.
Subsequently I often leave the page or close the tab or app or whatever, which is completely counter-productive to I'm sure is what the original designer wants.

Angular - Why would a website take a very long time to load?

Im working on a college project thats going well apart from a problem with slowness. It seems to take forever to load.
I have a feeling that im not deploying it properly or something else is slowing it down. Its deployed to a Heroku Hobby server which $7 a month and never has to go to sleep.
How would i properly check through chrome inspect or somethign similar whats causing it to take 20 seconds to see anything?
For me, the page took 9.85s to load the DOM content and 33.91s to fully load. I should also note that I'm in Korea, so it may take slightly longer for me.
Like the others have said, you have far too many script tags. Each is making their own request and they have to wait until the previous request is finished before the next one can fire off.
To drastically speed up the time, I would suggest to concatenate and minify your scripts into as few scripts as possible. Maybe one bundle for third party scripts and another for all of your scripts. Also, cache them if you can.
The networking, and auditing tabs on Chrome DevTools (inspect) can help find your issue, which definitely seems to be the amount of scripts you have loading.
Networking
Audit

MobileSafari crashing due to excessive memory consumption

I'm currently working on an application, that utilises SoundJS. I inherited the codebase after it was found not to work correctly on an iPad - the issue being it creates a manifest of around 16 MP3 files, totalling approximately 35.7mb. This obviously causes the iPad issues, and at 16mb it crashes.
The crash log shows it's due to the Per Process Limit according to the Diagnostics and Usage Logs.
I've done some digging in to the underlying structure of SoundJS and can see it's default behaviour is to utilise WebAudio, via a XHR. This is then parsed as an ArrayBuffer (or an array of ArrayBuffers).
At the moment this means that, after preloading, we have 35.7mb of data in ArrayBuffers - not good. This is after crunching the file size down! There will only ever be one audio file playing at any one time - and this is one file per section of the app; apart from during transitions, where two may be fading in to eachother.
Is there an easy way to free the resources up from the underlying structure; i.e the ArrayBuffers? As far as I'm aware, the previous developer did try using calls to the SoundJS .removeSound() method to free up some memory, but the results weren't good.
At the moment I'm looking at creating an object acting as a registry of all the filenames, and rather than loading them through a manifest - loading them individually and removing them as soon as they are used. However, I'm expecting this to cause headaches with easing one file in to another during playback. Furthermore, I expect that may actually result in a problem akin to the Images one where MobileSafari didn't release the memory allocated to image - even after deletion. (The correct fix being to reset the 'src' attribute of the image element prior to deletion)
Does anyone know of a surefire workaround for loading such large amounts of data in a web app targeting iPad?
testing SoundJS has shown some issues with iPad not releasing the memory properly. Unfortunately from a library perspective, there isn't much we can do about it.
If you only ever play sounds 1 at a time, I would suggest loading them only as you need them and removing them after use. The biggest issue you will find with that is waiting for sound to load, so you may want to implement a smart preload of the next sound you expect to use (meaning you always have the current and the next sound loaded). In theory this can keep you below the iPad 16 mb memory limit. However, if the iPad refuses to free up the memory, you may need to introduce some form of cache busting.
Another solution would be to reduce the file size through lossy compression, which it sounds like has already been attempted.
A third option might be implementing some form of streaming audio, but this is not something SoundJS can help with.
Hope that helps.

Timer fired ad nauseam (native v8natives.js:1582)

I have a website that loads very slow. Today I have done a test with the Timeline included in the Chrome Tools for Developers and I have seen that during about 9 seconds there is a Timer firing in a JS called v8natives.js. I have checked my Wordpress plugins and none of them are loading this library. I don't know why this library is loading and what it is used for. Anyone knows something about this JS?
I have tried also deleting some Javascript calls, deactivate plugins... But nothing happens.
The website is http://www.laparabolica.es
Thanks!
Based on these results:
http://www.webpagetest.org/result/120704_SN_10Z5/1/details/
It would appear that the web server is taking a long time (11.388 seconds in this case) to respond. (See Time to First Byte). I can't see v8natives.js in this equation ( Pretty sure this is something to do with Chrome's Javascript engine).
Since it's taking 11.388 seconds to receive the first byte of your site it can't be any javascript slowing this down...

Random loss of javascript audio in Chrome

I've been developing a browser based game using html5 and canvas objects it's going well so far. However i've run across a strange issue that I believe is related to chrome. Basically, the game can play fine for a period of time (this varies, typically a few minutes) then the audio just stops playing. If you then refresh the page or go on any other page with html5 audio tags then the sounds do not play either. If I take a look at the javascript console's network tab in chrome then i can see the audio objects haven't transferred and have a type and status of 'pending'. I've never got an error like this in firefox, only chrome.
My search online for similar situations only found one link that sound similar http://www.lordofultima.com/en/forum/showthread.php?tid=52813 with users complaining about loss of sound in chrome in this game (which is also done in javascript)
Any pointers? Feel free to ask if you need more info.
Just remove id3 tag of mp3 , it's strange but works , at least i hope

Categories

Resources