[jQuery] Re: jquery is'nt very effective at execution

2007-06-11 Thread mathmax


It doesn't work : I write this :

input type=text name=tbxSearch id=tbxSearch class=textbox
onkeypress=return disableEnterKey(event) onkeyup=tbxValue
=this.value.toLowerCase();setTimeout('tbxSearch_keyup()',0); /


var instance_fonction = 0;
function tbxSearch_keyup()
{
instance_fonction++;
Populate(instance_fonction);
}

function Populate(instance_en_cours)
{
rowsToShow = culmsName.contains(tbxValue).parent();
rows.not(rowsToShow).each(function(){
if(instance_fonction!=instance_en_cours)
{
return false;
alert(interruption);
}
$(this).hide();
});
rowsToShow.each(function(){
if(instance_fonction!=instance_en_cours)
{
return false;
alert(interruption);
}
$(this).show();
});
}




Dan G. Switzer, II wrote:
 
 As I stated, you'll want to use a setTimeout() to trigger the population.
 This will make the execution asynchronous. 
 

-- 
View this message in context: 
http://www.nabble.com/jquery-is%27nt-very-effective-at-execution-tf3887482s15494.html#a11060848
Sent from the JQuery mailing list archive at Nabble.com.



[jQuery] Re: jquery is'nt very effective at execution

2007-06-11 Thread mathmax


yes, but why doesn't interruption work even if the callback function
fromonkeyup event is called with a setTimeout ?

Dan G. Switzer, II wrote:
 
 
function Populate(instance_en_cours)
{
  rowsToShow = culmsName.contains(tbxValue).parent();
  rows.not(rowsToShow).each(function(){
  if(instance_fonction!=instance_en_cours)
  {
  return false;
  alert(interruption);
  }
  $(this).hide();
  });
  rowsToShow.each(function(){
  if(instance_fonction!=instance_en_cours)
  {
  return false;
  alert(interruption);
  }
  $(this).show();
  });
}
 
 If I replace your Populate() with the following:
 
 var oCells = null;
 
 function Populate(instance_en_cours)
 {
   if( oCells == null ) oCells = $(td.Name); 
 
   var sCurrent = tbxValue;
   
   oCells.each(
   function (){
   var c = $(this), p = c.parent();
   
   p[0].style.display =
 (c.text().toLowerCase().indexOf(sCurrent)  - 1) ?  : none;
   }
   );
 }
 
 I get really good performance. 
 
 The biggest hit comes after the first key press when the oCells code runs.
 You could probably cache that at an earlier time. I tried doing it at
 $(document).ready() but it seems like you move those items during the
 window.onload event--so it makes the cache obsolete.
 
 -Dan
 
 
 

-- 
View this message in context: 
http://www.nabble.com/jquery-is%27nt-very-effective-at-execution-tf3887482s15494.html#a11071830
Sent from the JQuery mailing list archive at Nabble.com.



[jQuery] jquery is'nt very effective at execution

2007-06-10 Thread mathmax


http://fra.orkos.com/produits/tarifs.aspx Here  is a page which I made. This
page presents a list of products classified in a hierarchy. I have a textbox
that allows the user to filter these products. Try to type a text in this
textbox (for example the word apple) and observe the speed of filtering.
If you have a sufficient screen resolution you can also see that the
hierarchy at left hand side is filtered at the same time. The only problem
is that I need a hundred lines of script to do this... 
When I discovered jquery, I wanted immediately to remake this script to see
how shorter the script could be. I was however quickly stopped by the
performances...  http://fra.orkos.com/tests/pricelist/ Here , you can see
the same page but the research script has been replaced by two jquery lines
of code. (the script is slow and may blocks the browser during a few
seconds. Do not stop script, it will not block you a long time)

$(.Name).parents(tr).hide(); //hide all the lines
$(.Name:contains('+tbxValue+')).parents(tr).show(); //then display the
lines in which the column Name contains the text researched

You can see how this second script is slow. Moreover, I didn't mask the
empty categories or filter the hierarchy at left hand side as in the first
script...

Maybe I could increase a little the performance by writting these two lines
of code differently, but the gap of performance between those two scripts is
so huge, that I wonder if using jquery with such page is a good choice.
Could you give me your advice ?

Thank you in advance. 

-- 
View this message in context: 
http://www.nabble.com/jquery-is%27nt-very-effective-at-execution-tf3887482s15494.html#a11019741
Sent from the JQuery mailing list archive at Nabble.com.



[jQuery] jquery is slow at execution

2007-06-10 Thread mathmax


http://fra.orkos.com/produits/tarifs.aspx Here  is a page which I made. This
page presents a list of products classified in a hierarchy. I have a textbox
that allows the user to filter these products. Try to type a text in this
textbox (for example the word apple) and observe the speed of filtering.
If you have a sufficient screen resolution you can also see that the
hierarchy at left hand side is filtered at the same time. The only problem
is that I need a hundred lines of script to do this...
When I discovered jquery, I wanted immediately to remake this script to see
how shorter the script could be. I was however quickly stopped by the
performances... Here, you can see the  http://fra.orkos.com/tests/pricelist/
same page  but the research script has been replaced by two jquery lines of
code. (the script is slow and may blocks the browser during a few seconds.
Do not stop script, it will not block you a long time)

$(.Name).parents(tr).hide(); //hide all the lines
$(.Name:contains('+tbxValue+')).parents(tr).show(); //then display the
lines in which the column Name contains the text researched

You can see how this second script is slow. Moreover, I didn't mask the
empty categories or filter the hierarchy at left hand side as in the first
script...

Maybe I could increase a little the performance by writting these two lines
of code differently, but the gap of performance between those two scripts is
so huge, that I wonder if using jquery with such page is a good choice.
Could you give me your advice ?
-- 
View this message in context: 
http://www.nabble.com/jquery-is-slow-at-execution-tf3898682s15494.html#a11052260
Sent from the JQuery mailing list archive at Nabble.com.



[jQuery] Re: jquery is slow at execution

2007-06-10 Thread mathmax


Thank you for your answer.

With your code, the script is much faster, but it however remains much much
slower than writing normal javascript
You can compare the performances, I update the script with your line of
code.



Renato Formato wrote:
 
 
 mathmax ha scritto:
 
 When I discovered jquery, I wanted immediately to remake this script to
 see
 how shorter the script could be. I was however quickly stopped by the
 performances... Here, you can see the 
 http://fra.orkos.com/tests/pricelist/
 same page  but the research script has been replaced by two jquery lines
 of
 code. (the script is slow and may blocks the browser during a few
 seconds.
 Do not stop script, it will not block you a long time)
 
 $(.Name).parents(tr).hide(); //hide all the lines
 $(.Name:contains('+tbxValue+')).parents(tr).show(); //then display
 the
 lines in which the column Name contains the text researched
 
 You can see how this second script is slow. Moreover, I didn't mask the
 empty categories or filter the hierarchy at left hand side as in the
 first
 script...
 
 Maybe I could increase a little the performance by writting these two
 lines
 of code differently, but the gap of performance between those two scripts
 is
 so huge, that I wonder if using jquery with such page is a good choice.
 Could you give me your advice ?
 
 
 This is a one line version that should be much faster.
 $('td.Name').parent().hide().end().contains(tbxValue).parent().show();
 
 The important points are:
 1) not to select elements by class only if you know all the elements 
 having that class have the same tagName.
 (td.Name and not .Name)
 
 2)don't use parents('tr') if you just nedd the parent element (the tr)
 (parent() and not parents('tr'))
 
 3)don't select the same elements multiple times, use the chain.
 $('td.Name').parent().hide().end().contains(tbxValue);
 
 and not
 
 $('td.Name').parent().hide();
 $('td.Name').contains(tbxValue);
 
 
 
 
 However, as all the td and tr elements are always the same, you could 
 store them, instead of selecting all again on each keypress.
 
 
 You could store in two global vars the elements:
 $td = $('td.Name');
 $tr = $td.parent();
 
 and write this inside your function:
 $tr.hide()
 $td.contains('a').parent().show();
 
 
 Let me know if you have any speed gain.
 
 Ciao
 Renato
 
 

-- 
View this message in context: 
http://www.nabble.com/jquery-is-slow-at-execution-tf3898682s15494.html#a11053627
Sent from the JQuery mailing list archive at Nabble.com.



[jQuery] Re: jquery is'nt very effective at execution

2007-06-10 Thread mathmax


Thank you.

Is it possible to interrupt the script each time the user enter a new letter
in the search box ?



Dan G. Switzer, II wrote:
 
 
http://fra.orkos.com/produits/tarifs.aspx Here  is a page which I made.
This
page presents a list of products classified in a hierarchy. I have a
textbox
that allows the user to filter these products. Try to type a text in this
textbox (for example the word apple) and observe the speed of filtering.
If you have a sufficient screen resolution you can also see that the
hierarchy at left hand side is filtered at the same time. The only problem
is that I need a hundred lines of script to do this...
When I discovered jquery, I wanted immediately to remake this script to
see
how shorter the script could be. I was however quickly stopped by the
performances...  http://fra.orkos.com/tests/pricelist/ Here , you can see
the same page but the research script has been replaced by two jquery
lines
of code. (the script is slow and may blocks the browser during a few
seconds. Do not stop script, it will not block you a long time)

$(.Name).parents(tr).hide(); //hide all the lines
$(.Name:contains('+tbxValue+')).parents(tr).show(); //then display
 
 I think you're going about this the wrong way. You're doing a lot of DOM
 parsing here.
 
 I'd try something like:
 
 $(.Name).each(
   function (){
   // create a pointer to the current table cell
   var oCell = $(this);
 
   // hide the parent
   oCell.parent().[oCell.text().indexOf(tbxValue)  -1 ? show
 : hide]();
   }
 );
 
 This should only parse through the tree one time deciding whether to
 hide/show each row.
 
 I choose not to use the contains() selector, because I'm not sure how will
 it performs.
 
 -Dan
 
 
 

-- 
View this message in context: 
http://www.nabble.com/jquery-is%27nt-very-effective-at-execution-tf3887482s15494.html#a11054117
Sent from the JQuery mailing list archive at Nabble.com.