Prevent mobile device from sleep in website - javascript

I have got a website that runs on php, javascript,and html. Im hopping there is a way to stop the mobile device (tablets, android and ios) from going to sleep.
I have done some research on this but they are not very helpful.
I have tried NoSleep.js and the answer from This answer from SO but they all seems not working, my android (ver 6.0) would still go to sleep and my iphone 6s goes to sleep too.
Any solutions?
Edit: For performance I prefer not to have an invisible video or audio playing in the background

Related

Website with Javascript bug on my Apple devices

Hello everyone (sorry my English is not perfect),
I make a website with JavaScript (jQuery) but I have one line not working on my iPhone and my iPad.
I write: window.scrollTo(0,document.body.scrollHeight);
It's better on my website but on my devices its not running.
Would you know a functional equivalent of this function?
Thanks!

Why is AngularJs a lot slower on iPad (vs desktop)?

Whenever a page goes through an actual digest (with around only 600 watchers) the page load is about 6 times slower on ipad vs desktop (calculated by using console.time).
My current research:
There is the intentional delay upon touching a button on iPad, that was fixed by using fastclick.
I don't think its due to touch event as a tried on a touch screen with a mouse and the speed is about the same (when using mouse vs touching).
Both desktop/ipad seem to be caching responses as you'd expect.
By using developer tools it seems it has to do with something in digest, I couldn't find any add ons for safari (doesn't seem to exist) to break down timing in the digest.
No problems on safari on desktop, or any other browser for that matter. Problem exists on multiple iPads.
I've heard including jQuery slows it down and tried removing it but same problem exists
I'm not looking for general ways to increase performance but to fix/troubleshoot this .. bug? I've ran out of ideas, please help! :D
Edit:
I'm not using ionic, it's web based.
Looks like I found the issue, its not angularjs but Javascript. On iPads javascript is much slower (http://ajaxian.com/archives/ipad-javascript-shockingly-slow).
Confirmed by running Google Octane (https://developers.google.com/octane/). Desktop Safari Browser: 29942, iPad Safari Browser: 6795.
This kinda sucks.
EDIT:
Tested out various iPads:
Android (Using Chrome v49 (latest)):
Galaxy tab S2 9.7: Octane Score 6901
Galaxy Tab A 8.0: Octane Score 2650
Galaxy Tab A 9.7: Octane Score 2886
Samsung Galaxy Tab: Octane Score 2622
Chromebook (Using Chrome v49 (latest)):
Lenovo Chromebook: Octane Score 8641
Ases 2in1 Touch-Screen: Octane Score 7378
HP Chromebook: Octane Score 8688
Ipad (Safari)
Ipad Pro: Octane Score 20,632
Ipad Air 2: Octane Score 10,601
Ipad Mini 4: Octane Score 9,902
As Blazemonger pointed out the article is old but the point is still true, javascript is slower on iPads/Tablets, particularly on android.
We found with about only 300 watchers the magical octane number is 10,000 (of course there are many other variables but to give someone an idea). So as long as you don't need your application to be fast on all iPads/Tablets you can rely on AngularJs (Although I guess the real problem is just heavy javascript).
When you are using ionic, you make a precompiled app in a web, so you have one more layer to process(iOs-> browser -> webApp) , in the pc the browser is just one layer( browser -> webApp)
WebApp is slower than native apps.

AppCache excruciatingly slow on iOS

I am developing a web-app utilizing Application Cache, and everything is working great on desktop browsers and on Android (even very old & slow android handsets). However downloading the appcache is taking much much much longer on iOS 6 in both Safari and Chrome.
My application cache total size is a mere 2.1Mb, and I have a pretty solid 70Mbps (download) internet connection. I would expect caching to be pretty rapid.
Here are my times so far:
Desktop Chrome: <1s (similar times for Safari & Firefox)
Android 2.3.3 Stock Browser: ~4s (similar times for Chrome & Dolphin)
Android 4.2.2 (Emulated): ~7s (running inside a PhoneGap app)
iPhone 4S 6.0 Safari: 8 minutes!!! (around the same in iOS Chrome too!!)
iPad 2 6.0 Safari: as above!!!
All of these devices are using the same wifi and internet connection, and my iPhone/iPad are otherwise functioning fine (no native apps exhibiting internet speed issues, and regular websites load just fine). There just seems to be something absolutely decimating AppCache download speed under iOS.
The window.applicationCache.status throughout this time is appCache.DOWNLOADING, and I have a progress event running counting the files as they are downloaded, so I'm certain that it is not stuck elsewhere. This just appears to be the time it takes to download. What gives?
Addendum : The iPhone also runs ridiculously hot, and the battery ticks down very quickly during this operation. It seems that something is causing the CPU to run flat-out during this download.
(Note: I can't publish a link to the web-app here as we're still in private beta, but if you would need to see it before you think you'd be able to help diagnose it, email me at the address in my profile and I'll send a link to the app).
Okay, I figured it out with the help of the iOS Emulator, and Xcode Instruments to profile it. (I'm not sure if I should add my solution into the main question, or as an answer, but I thought I'd do it this way as my question is already a little cluttered).
As it turns out, it was actually some erroneous javascript causing the issue, but apparently only on iOS.
The web-app is intended to only be a single page high (no vertical scrolling, except within specific DIVs), so in addition to the usual standard JS code for hiding the address bar...
window.addEventListener("load",function() {
// Set a timeout...
setTimeout(function(){
// Hide the address bar!
window.scrollTo(0, 1);
}, 0);
});
...I had also added in the following:
$(document).scroll(
function(e){
window.scrollTo(0, 1);
});
From looking at the profile results, I was able to see that a lot of time was being spent in scrollTo, so it immediately pointed to this as the cause. Why the scroll event was being triggered so much, I have no idea (this was occurring with no touching of the screen whatsoever).
My initial fix is to throttle that code, but I am now evaluating whether or not I even need it at all. Here is the code I have that fixes it for now (using jquery-debounce, which I was already using for something else):
$(document).scroll(
$.throttle(function(e){
window.scrollTo(0, 1);
})
, 10);
The download time of the application cache is now in line with the Android times. Phew!
The code is getting itself into an infinite loop, as the initial scrollTo function call triggers the scroll event handler, which then repeatedly re-triggers itself! My best guess is that the iOS JavaScript engine handles this infinite loop differently to the other browsers' JavaScript engines.

using javascript to play audio just on iPad

Rather than repeat a long javascript for playing audio, here is the link: webpages.charter.net/jolove/Includes/play_song.js:.
This plays for any desktop browser (Mac or Windows), but not for my iPad.
Here is the calling website: webpages.charter.net/jolove/Escort_Folder/Dedication_Poem_iOS.html
This is really bugging me, so I would definitely appreciate any help on this, any help at all.
John Love
Not sure exactly what your question is, but you can use the HTML5 <audio> tag which is supported by the iPad. Check out http://developer.apple.com/safaridemos/audio.php or just google "HTML5 audio".
I'm almost forced to conclude that iPad will not play audio files.
Here is a very fresh site, where I use
the audio. But, this time, I got a button that says "cannot play audio file". For the sake of completeness, here is the included webpages.charter.net/jolove/Escort_Folder/js/play_song.js

Play sound in mobile browser?

I want to make myself a web based stop watch for training that I can use on my Blackberry mobile browser.
The stopwatch should count 3 minutes, then ring a bell, wait 1 minute, then ring another bell and then repeat.
My problem is I can't seem to get sound to work on my blackberry browser.
I tried using <embed src="bell.wav"> which works fine in the browser of a normal computer, but it doesn't make a sound on my blackberry.
Should I build this stopwatch with Javascript and HTML or should I build it with flash?
According to the BlackBerry HTML Reference, the EMBED tag isn't supported. You might want to experiment with the OBJECT tag. One example I've seen to play embedded video in the browser is something like this:
<object height="288" width="352"
data="http://admin.example.com/_ipvideos/video_file_35.3gp"
type="video/3gpp" />
Something similar might work for simple audio files, too.
As for Flash, you're out of luck as none of the current BlackBerry browsers don't support it. If you're not having luck doing this in a webpage, you might want to bite the bullet and write a native app to do it. Or give BlackBerry Widgets a try.

Categories

Resources