Solved

How can i defer loading of certain javascript files until everything else has loaded?

Posted on 2010-09-05
3
307 Views
Last Modified: 2013-11-19
Hi, i'm writing a text editor with a bunch of features, the problem is that the page (and hence my editor toolbar) takes some time to load due to all the javascript files it's pulling in. What i realized however is that not all files should be necessarily loaded up straight away. For example the code for the right-click context menu could be deferred, and even the spell checker (which is very large!) need not really be loaded straight away (but moments later). I'd be happy for these features be loaded AFTER everything else. So ideally wouldn't even start to load until everything else INCLUDING other javascripts resources are loaded (not just the html). In jquery i use:

$(document).ready()

.. to execute my code which initializes the toolbar functionality. Note the toolbar is actually constructed via javascript, i.e. it takes the html code and converts it into some windows tab style. As a result the toolbar can't be rendered until document.ready() gets executed (i hide the toolbar until this code is executed). Therefore that code is competing i guess with all the other javascript resources being downloaded on the page! If it was a plain html/css toolbar then obviously the toolbar would look fine immediately, if you're with me. So i ideally the javascript which constructs the toolbar should be run AFTER the html has been loaded but before certain javascript resource.

Any ideas as to how to resolve the dilema as described in this post's title? (Many thanks)
0
Comment
Question by:paddycobbett
3 Comments
 
LVL 40

Assisted Solution

by:gurvinder372
gurvinder372 earned 150 total points
ID: 33607440
you can load those javascript files using jquery'
http://api.jquery.com/jQuery.getScript/
0
 
LVL 4

Accepted Solution

by:
MichaelMH earned 350 total points
ID: 33635525
You can do it also using plain JavaScript. You just have to ensure that all the resources in which you are interested are loaded first. The you can dynamically create/insert SCRIPT tags in the body and start loading the scripts you need.
0
 
LVL 1

Author Closing Comment

by:paddycobbett
ID: 33794358
thanks  =)
0

Featured Post

Find Ransomware Secrets With All-Source Analysis

Ransomware has become a major concern for organizations; its prevalence has grown due to past successes achieved by threat actors. While each ransomware variant is different, we’ve seen some common tactics and trends used among the authors of the malware.

Join & Write a Comment

Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

759 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

21 Experts available now in Live!

Get 1:1 Help Now