JS Questions

[NZ_Kiwis]

I'm in the design phase of a game and have a few questions around JS and specifically timers

1. If I had multiple timers running 10+ would there much drain on a users browser?
2. How many users disable JS? is there a global %?
3. Is there much difference between mobile and desktop browser performance with JS? - Does the iPhone still refresh a page each time its focused?
4. How can I prevent a timer from restarting on a page refresh? my primary language is PHP

[Bonesnap]

Coincidentally I am also more or less in the design stage of a game that has multiple timers. I'll answer the best I can.

1. In past iterations of what I am trying to do, I had at least a dozen timers on the page. There was no "slow down" in the browser. This was also a couple years ago. Modern browsers nowadays should be able to handle this pretty easily. One thing I noticed was if I let the page sit there the countdown timers would ever so slowly fall behind actual time, but the page had to be sitting there for like 15 minutes or more, which would be unusual behaviour in my context. Also my timers are more for aesthetic purposes than actual functionality.

2. Not really sure, but I think this was more of an issue in the past. JavaScript is enabled by default in all browsers and the main ones (IE, Firefox, Chrome) don't exactly make disabling it a quick step - you usually have to go through a bunch of menus or some kind of configuration to disable it, so the people who are doing that are most likely tech savvy type of users - they know what they're getting into. If they come across a site that doesn't run properly they probably know why. You can also place a disclaimer or message somewhere stating the user requires JavaScript to be enabled to use the site properly. You could probably include that in the same section as what browsers you are officially supporting.

3. Not sure about the iPhone, but desktop browsers are always going to perform better than their mobile counterparts simply because the hardware is much better. That doesn't mean performance on mobile is atrocious or anything, but I think you'll find it runs just fine. Are you doing something that's particularly JavaScript intensive?

4. You could set some kind of flag to let the timer know if it's already been triggered or something similar. If it needs to continue from where it left off then you would need to store its value somehow. Would need to know more about what you're trying to do.

[sneakyimp]

I would add:
1) ten doesn't sound like a lot, but this depends on the intervals for the timers. If they fire every minute, no problem at all. If they fire every millisecond, you could have trouble. I imagine it wouldn't be too hard to formulate a test page. Maybe toggle the color of some DIVs between two colors using timers. Create a drop down or slider or something to change the interval from say 1000ms to maybe 1ms. Should give you some idea of where things break down. This would certainly vary depending on the hardware.

2) I don't know any stats either, but would point out that there are security tools like noscript that some savvy users may utilize which would prevent JS from running. You should utilize the <noscript> tag to inform users who block your JS that it's required.

3) I would say that depends entirely on the phone or the desktop system. A latest generation, top-of-the-line Alienware gaming rig is going to be waaaay faster than iphone 3 or some of the crappier android phones. I do not know about the iphone refreshing every time. I can think of one easy test. Just load this in an iphone browser:

<?php
echo microtime(TRUE);
?>

Then switch to some other tab/window in your browser and then switch back. If the time stamp changes, then YES it probably does. You may be able to alter this behavior by sending cache headers -- but that may work against your desired behavior.

4) This is a bit of a tricky question. I could be totally wrong about this, but I think when you refresh a page that the browser will destroy/reset whatever timers might have been defined by the contents of that page and then run the JS in the page all over again. I'm not sure what functionality you are shooting for, but perhaps you can construct your page such that PHP running on your server maintains enough state to create the appropriate timer function if the page gets refreshed. E.g., if it's a countdown timer, tell the server what you are counting down to and it can construct the appropriate timer to display that countdown. Like this page: http://oldgreyhorror.com