[jQuery] Re: Performance Tuning Help

[Raymond]

Thanks to everyone for the suggestions. All were faster than the
original but I went with Joel's as it seems to be the quickest. Thanks
again!

[jQuery] Re: Performance Tuning Help

[Karl Swedberg]

On Jan 23, 2008, at 11:58 PM, Joel Birch wrote:



Or this (untested):

$('div.box').each(function(){
var $$ = $(this);
$$.append('' + $$.find('dd
p').html() + '');
});

Joel Birch


This looks good. I wonder if a tiny bit of performance could be  
squeezed out of changing the string concatenation to an array join  
(still untested):


$('div.box').each(function(){
var $$ = $(this);
$$.append(['',
$$.find('dd p').html(),
''].join('')
);
});

Would be interesting to see string vs. array approach tested somewhere.

--Karl
_
Karl Swedberg
www.englishrules.com
www.learningjquery.com

[jQuery] Re: Performance Tuning Help

[Shawn]

The other suggestions are good starting points.  One comment though...

doing $("div.box") needs to examine EVERY div on your page to see if it 
has the .box class.  If you can constrain that search some that could 
help improve performance.  For instance, if you only care about the 
div's in a particular area you might do $("div.box", "#myarea") - and 
exclude all div's outside that area.

The other suggestions touch on this, but doing the $("div.box:eq(...)") 
inside your loop is forcing yet another search of all the divs with the 
.box class.  You can replace that entire bit (and the count variable) 
with "this).  $(this).append(". . .");  Within an EACH loop, "this" is a 
reference to the currently matched element.

So the routine becomes
$("div.box").each(function () {
   $(this).append(
 " +
 $("dd p", this).html() +
 "");
});

//(the $(this).append() line is really one line - split for readablity)

One rule of thumb I've learned - where ever possible, use a unique ID. 
Doing a selector based on ID is S much faster than a class based 
selector.  Of course this isn't always possible though...

HTH

Shawn

Raymond wrote:
> I was wondering if anyone knows of a less processor intensive way of
> doing the following code?
> 
> I am trying to loop over all classes of a certain type on the page and
> then append some html that is contained within that particular class.
> What it is doing to the user is collapsing the search results into a
> "summary" of each as the length of the original result set can be long
> to scroll through.
> 
> var count = 0;
>   $('div.box').each(function()
>   {
>   $('div.box:eq(' + count + ')').append(' class="summary"> class="sml">' + $('div.box:eq(' + count + ') dd p').html() + ' div>');
>   count = count + 1;
>   });

[jQuery] Re: Performance Tuning Help

[besh]

Hi Raymond,

I'm not sure if this is less cpu intensive, but at least it's more
jQuery:

$('div.box').each(function() {
  var $snippet = $(this).find('dd p').html();
  $(this).append('' + $snippet +
'');
});

--
Bohdan Ganicky

On Jan 24, 12:01 am, Raymond <[EMAIL PROTECTED]>
wrote:
> I was wondering if anyone knows of a less processor intensive way of
> doing the following code?
>
> I am trying to loop over all classes of a certain type on the page and
> then append some html that is contained within that particular class.
> What it is doing to the user is collapsing the search results into a
> "summary" of each as the length of the original result set can be long
> to scroll through.
>
> var count = 0;
> $('div.box').each(function()
> {
> $('div.box:eq(' + count + ')').append(' class="summary"> class="sml">' + $('div.box:eq(' + count + ') dd p').html() + ' div>');
> count = count + 1;
> });

[jQuery] Re: Performance Tuning Help

[Joel Birch]

Or this (untested):

$('div.box').each(function(){
var $$ = $(this);
$$.append('' + $$.find('dd
p').html() + '');
});

Joel Birch

[jQuery] Re: Performance Tuning Help

[Aaron Heimlich]

Try this (untested):
$('div.box').each(function(count, box) {
$(box).append('' + $('dd p',
box).html() + '');
});

On Jan 23, 2008 5:01 PM, Raymond <[EMAIL PROTECTED]>
wrote:

>
> I was wondering if anyone knows of a less processor intensive way of
> doing the following code?
>
> I am trying to loop over all classes of a certain type on the page and
> then append some html that is contained within that particular class.
> What it is doing to the user is collapsing the search results into a
> "summary" of each as the length of the original result set can be long
> to scroll through.
>
> var count = 0;
>$('div.box').each(function()
>{
>$('div.box:eq(' + count + ')').append(' class="summary"> class="sml">' + $('div.box:eq(' + count + ') dd p').html() + ' div>');
>count = count + 1;
>});
>



-- 
Aaron Heimlich
Web Developer
[EMAIL PROTECTED]
http://aheimlich.freepgs.com