Include a javascript library for calculation

Question

I want to do something very simple in javascript. I have a main.js file which needs to call a calculation method in math.js.

If I include in index.html these two files with script tag, first math.js and then main.js, am I garanteed that math.js will have finished loaded before I can use it in main.js ?

If not, would I need to do some overkilled hack like I read here How do I include a JavaScript file in another JavaScript file? or even worse because I can't even see in that link how dependency is actually taken into account.

Update: Why can't I do like what Dashcode seems to do How can I add my library to be loaded Dashcode parts ie just use document.write('...')? Is in fact document.write robust enough on a very slow connection if the library was bigger than main.js ?

You are not guranteed that the files will finish loading before loading the next script file. I just found this, but it MAY be what you are looking for: http://requirejs.org/ — Smamatti, Mar 17 '12 at 11:12

score 4 · Accepted Answer · 2012-03-17T11:44:02.193

4

Set a variable in math.js and proove in main.js if this variable exist.

var mathLoaded = true;

in main.js:

function loaded() {
    return ((typeof mathLoaded) !== 'undefined');
}

Edit:

Now you can start an wait function, until it is loaded:

function wait() {
    if(loaded()) {
        //doSomething();
    } else {
        window.setTimeout(function() { wait(); }, 0);
    }
}

window.setTimeout(function() { wait(); }, 0);

edited Mar 17 '12 at 11:44

answered Mar 17 '12 at 11:10

And what should I do if it isn't loaded yet :) – user310291 Mar 17 '12 at 11:42
Great will try it :) Could this solution also work see my post update – user310291 Mar 17 '12 at 11:54
Note that you might rather do `setTimeout(wait, 4)` since the minimum delay is 4. – pimvdb Mar 17 '12 at 15:33
The 4 doesn't matter since it will be slower than 0 anyway. – Mar 19 '12 at 10:44

score 1 · Answer 2 · answered Mar 17 '12 at 11:11

1

you can take a look at RequireJS to make sure dependencies get loaded

also, JS gets loaded and parsed top-bottom. whichever comes first in the source gets fetched first and parsed first (but it doesn't guarantee order as servers for some files may be slow). that's why it's recommended that if you use libraries and toolkits (like jQuery and others), they should be loaded before anything else.

answered Mar 17 '12 at 11:11

Joseph

117,725
30
181
234

RequireJS seems a good solution. If there is no other solution that is lighter I think I'll have no other choice. – user310291 Mar 17 '12 at 11:43

score 1 · Answer 3 · answered Mar 17 '12 at 11:13

1

No you are not. The files can be loaded in any order. You typically want to call your initial code from the documents load event. That even it triggered once all the files needed for the page are loaded.

answered Mar 17 '12 at 11:13

Justin808

20,859
46
160
265

Really? I wonder how jQuery plugins can be loaded correctly in that case; as it's required to load them after the jQuery core. – pimvdb Mar 17 '12 at 11:14

score 1 · Answer 4 · answered Mar 17 '12 at 12:17

Why not use window.onload?

window.onload = function () {
    //your code here.
}

or get really fancy with a cross-browser addEvent function?

var libJS = {
    addEvent: function (obj, type, fn) {
        if (obj.addEventListener) {
            obj.addEventListener(type, fn, false);
            return true;
        } else if (obj.attachEvent) {
            obj['e' + type + fn] = fn;
            obj[type + fn] = function () {
                obj['e' + type + fn](window.event);
            }
            var r = obj.attachEvent('on' + type, obj[type + fn]);
            return r;
        } else {
            obj['on' + type] = fn;
            return true;
        }
    }
}

which attaches functions to events properly...

libJS.addEvent(window, 'load', someMainJsFunction); //add to window.onload

Include a javascript library for calculation

4 Answers4