It would be nice if someone can shed a new idea on the below situation and sorry if it has been asked before. I could not find similar situation.
I have a dynamically generated page which I don't have control of. I need to add multiple iframes in it and load highcharts. Code for test.html:
<html>
<html>
<head>
<script src=".8.2/jquery.min.js"></script>
<script src=".js"></script>
<script src=".js"></script>
</head>
<body>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
<script>
....
code for all.html:
<html>
<iframe id="one" src="test.html"></iframe>
<iframe id="two" src="test.html"></iframe>
</html>
Questions:
1- In general, if a
<script src="some.js" />
is added to the html but never used in the page, will it download on the user web-browser?
2- If I add <script src="some.js" /> in different iframes on the same main page, will it download for each of the iframes or it would detect that it has already been loaded?
3- how can I solve the issue of not putting the <script src> on the main page but preventing the download on all iframes and download for the first only? iframes are constructed dynamically and it will be difficult to put a flag to check if it has already been loaded for any of the iframes.
I need to prevent loading on user side twice... meaning not to download the file on user browser twice. However, using above iframes, i want it to execute twice .. yes.
Many thanks!
It would be nice if someone can shed a new idea on the below situation and sorry if it has been asked before. I could not find similar situation.
I have a dynamically generated page which I don't have control of. I need to add multiple iframes in it and load highcharts. Code for test.html:
<html>
<html>
<head>
<script src="http://ajax.googleapis./ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="http://code.highcharts./highcharts.js"></script>
<script src="http://code.highcharts./modules/exporting.js"></script>
</head>
<body>
<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
<script>
....
code for all.html:
<html>
<iframe id="one" src="test.html"></iframe>
<iframe id="two" src="test.html"></iframe>
</html>
Questions:
1- In general, if a
<script src="some.js" />
is added to the html but never used in the page, will it download on the user web-browser?
2- If I add <script src="some.js" /> in different iframes on the same main page, will it download for each of the iframes or it would detect that it has already been loaded?
3- how can I solve the issue of not putting the <script src> on the main page but preventing the download on all iframes and download for the first only? iframes are constructed dynamically and it will be difficult to put a flag to check if it has already been loaded for any of the iframes.
I need to prevent loading on user side twice... meaning not to download the file on user browser twice. However, using above iframes, i want it to execute twice .. yes.
Many thanks!
Share Improve this question edited Aug 31, 2013 at 15:41 user2735719 asked Aug 31, 2013 at 15:11 user2735719user2735719 151 silver badge7 bronze badges 6- if I've understood your question correctly, you get all this behaviour for free assuming the browser has caching switched on. The scripts will need to be executed separately in each iframe, but they should only be downloaded once. Use the network tab in a browser debugger to observe this. – Frances McMullin Commented Aug 31, 2013 at 15:17
- yeah but I saw this article and it sounds it is not doing it.blog.develop./blogs/bid/232857/… – user2735719 Commented Aug 31, 2013 at 15:25
- Also, if it does not load twice, how the charts would be added onLoad? I tested the above example and charts appear onLoad for both iframes.. Kind of puzzled. – user2735719 Commented Aug 31, 2013 at 15:26
- you need to understand the difference between loading and executing, do you want to avoid executing twice? – Frances McMullin Commented Aug 31, 2013 at 15:28
- Sorry for my modest knowledge. I need to prevent loading on user side twice... meaning not to download the file on user browser twice. However, using above iframes, i want it to execute twice .. yes. – user2735719 Commented Aug 31, 2013 at 15:37
3 Answers
Reset to default 4Answering your questions in order...
There is no such thing as a script tag being "used" on the page, if the script tag is present in the html, that file will be downloaded (or retrieved from the cache) and executed.
If you have multiple script tags pointing to the same URL, the file will be downloaded only once (and then cached), but it will be executed multiple times (once for each script tag).
It's still not clear if you understand the difference between loading and executing a script. If you only want to avoid loading repeatedly, relax, the browser has that covered. If you want to avoid executing repeatedly, you're going to need to write code for that logic, set a flag in your script and only run if it hasn't been set yet. So, some.js might have :
if(!window.scriptHasRun) { window.scriptHasRun = true; // do something useful here, just once. }
I think the question is more related to the fact that Highcharts throws an error if it is executed a second time.
His top level page includes the highcharts library, therefore, when the iFrame navigates to a new page which also includes the library, an error is thrown and the charts fail...
1- Whatever is on the html page will load at least once, unless you prevent it with some code.
2- Caching only works automatically for images, the rest will probably will load again if it's ajax or whatever, also it depends on the script of course.
3- you can use local cache feature of html5, pretty easy to implement, if you are working with json objects, just line them up and iterate on wherever you want.