Thanks a million Mike!

I hated that code but wasn't sure how to make it better... :)

So just to clear things up, you prefer using document.write() to
insert <script> tags instead of appending the elements to the DOM:

  var finan = document.createElement('script');
          finan.type = 'text/javascript';
                finan.src = 'http://www.mydomain.com/js/mts_finan.js';
          head.appendChild(finan);

i guess its more efficient because you don't have to access the
document object, but any other particular reasons?

Awesome, one huge problem out of the way!

We're currently at a point where our server isn't exactly being
overloaded so i think its safe to host jquery.min on google code and
the plugin (yet to be minified) and custom code possibly combined in 1
file, since there won't be a lot of custom code to begin with.

Also, to satisfy your curiosity, the whole purpose of using the
mts_load.js function is because this code is a part of a banner we're
planning to distribute and host in numerous websites, so a lot of them
won't want scripts other than their own embedded directly, so we found
that calling one simple function (mts_load) that would to all the
dirty work was acceptable with them :)

On Aug 31, 6:59 pm, "Michael Geary" <[EMAIL PROTECTED]> wrote:
> Holy moly, that is complicated! No, you don't need to do any of that.
>
> Even if it were the right approach, it's poorly coded, with the same
> ten-line function duplicated three times, and a completely hard-coded,
> non-generalized way of handing the load sequencing. (What do you do if you
> need to add *another* .js file, or two or three? Add another special load
> function for each one, and another nested callback at the end?)
>
> My apologies to the developer who coded this - it's nothing personal -
> please don't shoot the messenger!
>
> Assuming that you want to keep the mts_loader.js file, then all you need to
> do is change it to:
>
> == mts_loader.js ==
>
>     function script( url ) {
>         document.write(
>             '<script type="text/javascript" src="', url, '">',
>             '<\/script>'
>         );
>     }
>
>     script(
> 'http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js');
>     script( 'http://www.mydomain.com/js/jquery.simplemodal-1.1.1.js');
>     script( 'http://www.mydomain.com/js/mts_finan.js');
>
> == end mts_loader.js ==
>
> That's it! That's the whole thing.
>
> The complicated sequencing logic is made unnecessary by using simple
> <script> tags and document.write. They automatically get executed in the
> order they are written to the document.
>
> It will also cut at least .9 seconds off your page load time, since the
> existing code waits at least .3 seconds after loading each file.
>
> Now, the question of *where* host your .js files and whether to combine them
> is separate from the question of *how* to load them. Let's cover the "where"
> separately, since it is independent of the loading technique.
>
> -Mike
>
> > From: Alex Weber
>
> > Thanks for the reply Mike, here goes: (the ==pagename.ext==
> > denotes a new file - sure there are better ways of doing this
> > but i hope its
> > legible)
>
> > ==index.html==
>
> > <script type="text/javascript"
> > src="http://www.mydomain.com/js/mts_loader.js";></script>
>
> > ==mts_loader.js==
>
> > var mts_finan_times, mts_finan_timeout, mts_finan_loaded,
> > mts_finan_callback;
>
> > function mts_finan_waitFor(loaded, callback) {
> >    mts_finan_timeout = 300;
> >    mts_finan_times = 40;
> >    mts_finan_loaded = loaded;
> >    mts_finan_callback = callback;
> >   mts_finan_wait();
> > }
>
> > function mts_finan_wait(){
> >    if(mts_finan_times > 0){
> >            if(!mts_finan_loaded()){
> >                    mts_finan_times -= 1;
> >                    setTimeout('mts_finan_wait()',
> > mts_finan_timeout);
> >            } else {
> >                    mts_finan_callback();
> >            }
> >    }
> > }
>
> > function mts_finan_loadJQuery(){
> >    if(!window.jQuery){
> >            var head;
> >            head = document.getElementsByTagName('head')[0];
> >      if (!head) { return; }
>
> >      var jquery = document.createElement('script');
> >      jquery.type = 'text/javascript';
> >            jquery.src =
> > 'http://www.mydomain.com/js/jquery-1.2.6.pack.js';
> >      head.appendChild(jquery);
> >    }
> > }
>
> > function mts_finan_loadModal(){
> >    if(window.jQuery && !window.jQuery.modal){
> >            var head;
> >            head = document.getElementsByTagName('head')[0];
> >      if (!head) { return; }
>
> >            var modal = document.createElement('script');
> >      modal.type = 'text/javascript';
> >            modal.src = 'http://www.mydomain.com/js/
> > jquery.simplemodal-1.1.1.js';
> >      head.appendChild(modal);
> >    }
> > }
>
> > function mts_finan_laod(){
> >    if(window.jQuery && window.jQuery.modal){
> >            var head;
> >            head = document.getElementsByTagName('head')[0];
> >      if (!head) { return; }
>
> >            var finan = document.createElement('script');
> >      finan.type = 'text/javascript';
> >            finan.src = 'http://www.mydomain.com/js/mts_finan.js';
> >      head.appendChild(finan);
> >    }
> > }
>
> > (function init(){
> >    mts_finan_loadJQuery();
> >    mts_finan_waitFor(
> >            function(){
> >                    return !!(window.jQuery);
> >            },
> >            function(){
> >                    mts_finan_loadModal();
> >                    mts_finan_waitFor(
> >                            function(){
> >                                    return !!(window.jQuery.modal);
> >                            },
> >                            function(){
> >                                    mts_finan_laod();
> >                            }
> >                    );
> >            });
> > })();
>
> > ==mts_finan.js==
>
> > // here i assume everything is loaded and fire off the modal
> > window with content.  no big secret here.
>
> > so basically, i inherited this code and don't like it one bit
> > but the guy who developed it insists its the best way to do this.
>
> > my proposed changes (based on feedback ive received) are:
>
> > 1) use minified jquery and plugins instead of packed for
> > 2) use google code or some other proper hosting service to
> > host jquery and plugins
> > 3) gotta work on mts_loader.js
>
> > see what i mean now?
>
> > it checks for the existence of jquery and once its there
> > loads the plugins and tests if its there and only then does
> > it load my file
> > (mts_finan.js)
>
> > hope this explains more than confuses! thanks! :)
>
> > -Alex
>
> > On Aug 30, 2:15 pm, "Michael Geary" <[EMAIL PROTECTED]> wrote:
> > > > From: Alex Weber
>
> > > > Currently what I'm doing is:
>
> > > > 1) Call function 1, checks for jQuery and if not then loads the
> > > > library and recursively checks until its available.
> > > > 2) Once its available, a second function is called and
> > does the same
> > > > thing to load a plugin
> > > > 3) Ditto for my custom .js file
>
> > > You really need to post a link to a test page that illustrates your
> > > loading technique. Or at least, post a complete HTML+JS
> > example with
> > > real code in a message here.
>
> > > From your description, it's anyone's guess what you're
> > actually doing.
> > > Does "loads" mean "document.write() a script tag", or "create a
> > > dynamic script element", or what? Does "recursively" mean
> > repeated calls to setTimeout?
> > > (BTW, that may look recursive, but it isn't.) Does "checks" mean...
> > > Well, you get the idea.
>
> > > My guess was that you're using dynamic script elements to
> > load the .js
> > > files, and watching for certain symbols becoming defined on
> > repeated
> > > setTimeout calls. But that is such a complicated solution
> > that I have
> > > to think I guessed wrong.
>
> > > > I don't like this because of the excessive opening and closing of
> > > > connections required... is combining libraries + custom
> > code into 1
> > > > file a terrible pratice?
>
> > > Of course not! Who ever said combining .js files was a
> > terrible practice?
> > > The fewer the files you download, the better. Combine all
> > of your .js
> > > files into a single file, with the likely exception of
> > jquery.min.js
> > > since you can let Google pay for that one.
>
> > > > Any other decent way to get by this step-by-step
> > rudimentary approach?
>
> > > Well, tell us in painstaking detail exactly what you need to
> > > accomplish. Is this just an HTML page that needs to load
> > some .js files? Like, "Hello?
> > > Script tags?" Since you currently have a more complicated method,
> > > there must have been some reasons you chose that - something that a
> > > plain script tag wouldn't accomplish?
>
> > > BTW, if you do use Amazon S3 as I suggested, there is one wrinkle:
> > > They don't GZip your files for you - you have to take care of that
> > > yourself. But forget that for the moment and let's make sure the
> > > problem you're trying to solve is clearly explained.
>
> > > So post your current code and your requirements, and let's take it
> > > from there.
>
> > > -Mike

Reply via email to