0

I was wondering if this is something normally done or possible (I am a novice) suppose you have kind of a heavy javascripted site. A web app page basically. What if part of the page is a mailbox... and the user doesn't necessarily use it right away. Could you possibly download the javascript that the mailbox requires after the page has loaded or maybe even as they need to use the mailbox? I saw this from another question:

$.getScript("my_lovely_script.js", function(){

alert("Script loaded and executed.");
user229044
  • 232,980
  • 40
  • 330
  • 338
NoTiG
  • 121
  • 1
  • 9

3 Answers3

3

Yes, you can load non-essential scripts "later" to avoid processing them before displaying the initial page.

There are several approaches:

  1. You can mark the script tag as defer or async (see MDN for details) so the browser will load it asynchronously and not hold up page display for the loading or running of the script.
  2. You can load it dynamically only as needed.
  3. Load scripts at the end of the <body> right before the </body> tag so the page can display before they are loaded.

Before you proceed down this path, I would highly suggest that you measure the loading resources of your page and find out where the time is really going. Premature optimization before you've measured where the time is actually going is rarely the most effective way to improve things. The Chrome debugger can show you a lot of data about resource load times.

Also, remember that a design that optimizes for effective caching can be highly effective since one your scripts are loaded for the first page on your site, they will be cached for all future pages and will load very, very quickly from the browser disk or memory cache.

jfriend00
  • 683,504
  • 96
  • 985
  • 979
  • @NullPointer - I added a link to where MDN discusses async and defer. You can Google for "script defer async" to find other articles. – jfriend00 Nov 01 '12 at 03:25
  • 1
    @NullPointer - I also added info about measure your performance before deciding what to optimize and about making sure you are taking maximum advantage of browser caching. – jfriend00 Nov 01 '12 at 03:28
0

Yes, this is possible and is done.

You can add script tags to the document when ever you want. You can also use a utility like LabJs to help you do it.

http://labjs.com/

Mike M
  • 212
  • 3
  • 11
0

Yes you can delay loading of your scripts, however what you should probably do is go to something like https://developers.google.com/speed/pagespeed/ and see what's taking so long and optimize on that. It's very possible that you'll see more overall performance by employing techniques such as loading from multiple domains simultaneously, and using tools like https://github.com/mishoo/UglifyJS2 to combine, compress, and minify your js code

hexist
  • 5,151
  • 26
  • 33