I've created a standalone web app that uses caching. It works very well if you have eithe
My issue is that some scripts that require a network connection, like google analytics, block the page from rendering until they're loaded (at least if using app cache) if you have a poor connection, then instead of the regular instant load speeds the 50kB page can take upwards of one minute to load.
Here's my .appcache file:
CACHE MANIFEST
# Cache manifest version 5.4
CACHE:
assets/js/webapp.js
src/js/master.js
src/js/master.min.js
index.html
assets/css/style.css
about/index.html
license/index.html
NETWORK:
*
Is there a way to timeout the script loading? My app is hosted with GitHub pages, so I have no control over the server. What I'd like to happen is if any scripts that require a network connection can't load in under 'x' milliseconds, then terminate the loading of those scripts.
Is there a way I can implement this with JavaScript? Or is there a kosher way of dealing with this?
The ideas I've had for fixing this include:
1) removing the offending assets
2) having a JS function that's set to run after 'x' milliseconds that will look for a 1px image that's loaded via network, and if it can't find it then terminate the other network scripts
If it helps, here's my github repo for my app
Well since nobody's replied to this, I'll post my solution that seems to work.
What I did is took the code that was affecting the page load speed (an external script) and used yepnode.js to timeout its loading if it took more than n seconds.
This way, if the connection was bad and the page's loading got blocked, yepnope would cancel the script's loading and the end result would be loading fully from the cache. (Because the script(s) were the only thing loading from the network.)