jquery - Handling third-party javascripts quickly, so pages don't appear slow -


I'm doing some testing with today to see if my pages are slowing down loads. The short story is low, I have found that the third party scripts are getting noticeable recession in the shipment. I'm loading them all at the bottom of the page, using the async and see (see).

I believe the main reason for the recession is not only to grab the third party files, but in fact to run different scripts, especially side-by-side

I want to keep all the scripts, but I want them to be loaded behind the curtains after all the curtains are loaded. , And no noticeable display in the browser is low. For example, I would not like to "stutter" the browser or if I start loading third-party scripts, or many other small annoyances while scrolling down, then jump around.

Has anyone ever had this with a good solution? So far I'm thinking that the best option might be to load third-party scripts by using jQuery.getScript (), after all my scripts have expired (literally located below one of .js) . Even so, it can load all of them concurrently which can make the browser sluggish for one or two.

There is more information on how I am interested:

  • caught the source code of a product page, threw it into a test PHP page, So I sent a slip to an on / off flag like
    • if <
    • all the script turned off a test went
    • < Li> Run more tests, $ 1 $ ($ _REQUEST ["Allow GoogleAnalytics"]) in new tabs
    Once on a script to start
  • when Till my own Ipt all week went on, the pages seemed of less than about 1.9 seconds (the first scene) and repeat with a second sequence to load. It's okay with me.
  • After turning on the third party script, page 39

The third party script is in question:

  • Facebook Google +1 button
  • Pin
  • Google Trustworthy Store

Any of these special features Not bad at all, but they all combine and take very long, and make the browser very sluggish.

If you are simultaneously loaded, then the scripts can queue, besides this it is prepared on the load document. (I see that you are already using jQuery, so use it in the example). Example code (works locally).

  & lt; Script src = "http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" & gt; & Lt; / Script & gt; & Lt; Script & gt; Var scriptsloadload = ["http://apis.google.com/js/plusone.js", "http://connect.facebook.net/en_US/all.js#xfbml=1"]; Load functions () {var url = scripts2load.pop (); If (url) {$ .ajax ({url: url, cache: true, crossDomain: true, dataType: "script", success: loadNext}); }} $ (LoadNext) & lt; / Script & gt;  

Comments

Popular posts from this blog

c# - SignalR: "Protocol error: Unknown transport." when navigating to hub -

c# - WPF Expander overlay used in ItemsControl -

class - Kivy: how to instantiate a dynamic classes in python -