Faster loop?

[birney29]

Hi all!

I currently populate a select box using an external js file. this js loops through an object and populates the select box. My question is, is there a faster way of doing this? The drop down lists are somtimes 1000's of entrys long, so a quicker way would be brilliant.

thanks

My code is:

var GunTypedropDownObject = [{ text:"", value:"235.003000"},
       { text:"Rimfire Rifle", value:"1.003000"},
				{ text:"22 Centrefire Rifle", value:"2.003000"},
				{ text:"Centrefire Rifle", value:"3.003000"},
				{ text:"Muzzleloader", value:"4.003000"},
				{ text:"Smooth Bore Gun", value:"5.003000"},
				{ text:"Spare Barrels", value:"6.003000"},
				{ text:"Rimfire Rifle-B/Action", value:"7.003000"},
				{ text:"Rimfire Rifle-F/Block", value:"8.003000"},
				{ text:"Rimfire Rifle-L/Action", value:"9.003000"},];


	function fillGunTypeSelect() {
	
        var select = document.getElementById( 'GunType' );
        var options = select.options;
	
        options.length = 0;
	
        for( var i = 0; i < top.headerFrame.GunTypedropDownObject.length-1; i++ ) {
            options[ options.length ] = new Option(top.headerFrame.GunTypedropDownObject[i].text, top.headerFrame.GunTypedropDownObject[i].value);

        }
	
	 
    }

Kenneth Birney
User Interface Programmer
Scottish Police

 

[trollacious]

This should speed things up without breaking anything:

var gtdo=top.headerFrame.GunTypedropDownObject;
for(var gi=0;gi<gtdo.length;gi++)
{
onegtdo=gtdo[gi];
options[options.length] = new Option(onegtdo.text, onegtdo.value);
}

What this does, and xutopia tested this a week or so ago, is go directly to the object you're referencing rather than having to start at top, then find the headerFrame object, then the GunTypedropDownObject each time. With your original, the browser had to reference each step each time through the loop. Since you refer to 2 properties of each object in the array, assigning the specific object in the array to a separate variable means one less reference to the whole array itself. With thousands of objects in the array, this can add up.

If I spelled everything correctly, the code here should drop into place in your code. # (bearded smiley face)

 

[birney29]

Thanks very much for the help! Kenneth Birney
User Interface Programmer
Scottish Police

 

[trollacious]

Another way to speed things up is to &quot;unroll&quot; the loop some:

for(var gi=0;gi<gtdo.length;gi+=2)
{
onegtdo=gtdo[gi];
options[options.length] = new Option(onegtdo.text, onegtdo.value);
//this means processing the loop half as many times
if ((gi + 1) < gtdo.length)
{
onegtdo=gtdo[gi+1];
options[options.length] = new Option(onegtdo.text, onegtdo.value);
}
}

You can do this with gi += 3 (or more), but you need to always check to see if the length of the array has been reached before assigning the object to an individual variable.

 

[birney29]

Thanks for taking the time to help, im having a little problem though. i keep getting an error concerning &quot;onegtdo.text&quot; being null or not an object.

any ideas?

thanks Kenneth Birney
User Interface Programmer
Scottish Police

 

[trollacious]

Put a copy of your code for the loop here to look at. I've never set up an array of objects the way you did it in your example. The way I do it is:

function GunTypedropDownObject(text, value)
{
this.text=text;
this.value=value;
return this;
}

var gtdo=new Array(), gi=0;

gtdo[gi++]=new GunTypedropDownObject(&quot;&quot;,&quot;235.003000&quot;
gtdo[gi++]=new GunTypedropDownObject(&quot;Rimfire Rifle&quot;, &quot;1.003000&quot;
gtdo[gi++]=new GunTypedropDownObject(&quot;22 Centrefire Rifle&quot;, &quot;2.003000&quot;

etc., and then access the gtdo array elements from there.

 

[birney29]

var GunTypedropDownObject = [{ text:"", value:"235.003000"},
       { text:"Rimfire Rifle", value:"1.003000"},
				{ text:"22 Centrefire Rifle", value:"2.003000"},
				{ text:"Centrefire Rifle", value:"3.003000"},
				{ text:"Muzzleloader", value:"4.003000"},
				{ text:"Smooth Bore Gun", value:"5.003000"},
				{ text:"Spare Barrels", value:"6.003000"},
				{ text:"Rimfire Rifle-B/Action", value:"7.003000"},
				{ text:"Rimfire Rifle-F/Block", value:"8.003000"},
				{ text:"Rimfire Rifle-L/Action", value:"9.003000"},
				{ text:"Rimfire Rifle-M/Action", value:"10.003000"},
				{ text:"Rimfire Rifle-P/Action", value:"11.003000"},];




function fillGunTypeSelect() {
	
        var select = document.getElementById( 'GunType' );
        var options = select.options;
	
        options.length = 0;
        
	var gtdo=top.headerFrame.GunTypedropDownObject;
	for(var gi=0;gi<gtdo.length;gi++)
 	 {
 		 onegtdo=gtdo[gi];
 		 options[options.length] = new Option(onegtdo.text, onegtdo.value);
 	 }

    }

i do this for a couple of drop downs on the screen, but i do it exactly as above. thanks again for the help
Kenneth Birney
User Interface Programmer
Scottish Police

 

[trollacious]

The code for the loop looks fine. The very first value you have for text IS a null string, but I don't think your error message means that. You should make sure there's no comma after the last element in your array, like there is in the shortened example you posted here.

The only other thing I can think of is a possible typographical error in the array or a function. Using just this function on the page, see if you get the error. If so, comment out half the array and try again. If you still get the error, comment out half of that, and on down until you only have one element left. If that one gives an error, then comment that out and try the next one.

 

[birney29]

ill give it a try,

thanks for your help,

your a javascript guru! Kenneth Birney
User Interface Programmer
Scottish Police

 

[xutopia]

check out the faq on speeding strings up to ten times. It shows examples of unrolling that could be used here. Gary

http://www.xutopia.com

Haran