I have an application that executes this piece of code (JQuery 1.4.2) in an ASPX page for each element in the HTML table (500x)
$(".ArtRow_" + artId).each(function () {
if ($(this).find(".ArtOpen_" + artId).length <= 0) return;
.... };
omitting the line with find makes this page load normally, but with the find:
- firefox & chrome: +- 3sec
- in IE9: +- 42 sec ( using 50% cpu on a dual core )
I did a profile in IE, and 95% of the time, IE is executing the function CLASS ( call stack:find.f.filter.CLASS )
I tried
- using an Id with the find
- eleminated string concatination by using a fixed class
to no avail (42s)
Anyone a clue? Thanks in advance!
edit: Im convinced now that the each is taking so long. I skipped it, because with empty code block it didn’t took 42 s to load . But with some lines of comment int it, it took again 42s, so i guess it was some kind of not very intelligent dead code detection.
on explicit request: the HTML where the ArtRow lives
<tbody>
<tr class="SB_ReceptielijstHeader">
<th>Artikel / Bestelling</th>
<th>Besteldatum</th>
<th>Pr. School</th>
<th>Pr. Levering</th>
<th class="Number">Aantal besteld</th>
<th class="Number">Aantal ontvangen</th>
</tr>
<tr class="SB_ReceptielijstArtikelHeader ArtRow_132109">
<td id="Titel_132109" class="Artikel" colspan="5">
<img src="images/SB/Icons/23-book.png" style="vertical-align:middle"> 9789030170433 - NANO 1</td>
<td class="Number ArtikelTotal">
<input type="hidden" value="132109" class="Artikel_Id">
<input type="hidden" value="" id="ArtLevLn_132109">
<input type="text" value="12" style="text-align:right" size="4" id="Aantal_132109" name="Aantal_132109" maxlength="4">
</td>
</tr>
<tr class="SB_ReceptielijstRow ArtRow_132109 ArtRowInvisible">
<td>Bestelling 81 / Lijn </td>
<td>02/07/2010</td>
<td>24,05</td>
<td>22,85</td>
<td class="ArtOpen_132109 Number">
</td>
<td id="ArtToew__132109" class="ArtToew ArtToew_132109 Number">
<div style="display:none" class="ArtBestLn">
<input type="hidden" value="">
</div>
<input type="text" style="text-align:right" size="4" id="Aantal_" name="Aantal_" maxlength="4">
</td>
</tr>
<tr class="SB_ReceptielijstArtikelHeader ArtRow_134399">
<td id="Titel_134399" class="Artikel" colspan="5">
<img src="images/SB/Icons/23-book.png" style="vertical-align:middle"> 9789045533322 - HANDELWIJS 3 INCL CDROM HERWERKT 2010</td>
<td class="Number ArtikelTotal">
<input type="hidden" value="134399" class="Artikel_Id">
<input type="hidden" value="" id="ArtLevLn_134399">
<input type="text" value="25" style="text-align:right" size="4" id="Aantal_134399" name="Aantal_134399" maxlength="4">
</td>
</tr>
<tr class="SB_ReceptielijstRow ArtRow_134399 ArtRowInvisible">
<td>Bestelling 81 / Lijn </td>
<td>02/07/2010</td>
<td>23,95</td>
<td>23,60</td>
<td class="ArtOpen_134399 Number">
</td>
<td id="ArtToew__134399" class="ArtToew ArtToew_134399 Number">
<div style="display:none" class="ArtBestLn">
<input type="hidden" value="">
</div>
<input type="text" style="text-align:right" size="4" id="Aantal_" name="Aantal_" maxlength="4">
</td>
</tr>
</tbody>
It’s slow because it’s running that code 500 times.
I assume that’s not that answer you’re looking for though, so if you could post your HTML structure, we can see if there’s a way to optimise the selectors you’ve used to make it faster.