Different ways of loading JS SDK

Question

The "official" way of loading the SDK, suggested by FB's documentation, is this:

<script>(function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=APP_ID";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>

However, I've already seen it done like this:

<script src="http://connect.facebook.net/en_US/all.js"></script>
...
FB.init(APP_ID, true, true, true);

What's the difference (in practice) between those two?

I'm writing a GWT application that uses social plugins. What would be the best way to load it?

Answer 1

I've not worked directly with the facebook api, though I've written lots of GWT, integrated with page-level JavaScript

Take a look at the ScriptInjector class - one method lets you inject a string, the other lets you injects a script from url and get a callback when it is loaded.

Another thought: JSNI allows you to call javascript from within your Java app. If you can include that script tag on page load, you could call that FB.init from a Java method:

private native void nativeFbInit(String appId) /*-{
    $wnd.FB.init(appId, true, true, true);
}-*/;