CODEWITHSUNDEEP
facebookgwtfacebook-javascript-sdkfacebook-social-plugins
Marcelo
Marcelo

Reputation: 4608

Different ways of loading JS SDK

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?

Upvotes: 0

Views: 535

Answers (3)

Nicholas Head
Nicholas Head

Reputation: 3726

I would suggest the first method, since it will load the library asynchronously, helping to prevent 'blocking' of the rest of your page loading. For example, if you used the second method and Facebook was down or slow to respond to serving the JS file, your whole page could potentially "sit there" while it tried to download the script.

However, with that said, in my own experience I've sometimes had "weirdness" happen with the async version, and ended up using the second method (the synchronous one) and making sure it was the very last thing before my </body> on the page.

Upvotes: 1

Nitzan Tomer
Nitzan Tomer

Reputation: 164137

the difference is that the first approach is asynchronous while the later is synchronized. if you want the page to load/render faster and you can do with out the fb sdk for this purpose (showing the page) then go with the first.

Upvotes: 1

Colin Alworth
Colin Alworth

Reputation: 18331

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);
}-*/;

Upvotes: 1

Related Questions