Help trying to optimize a jQuery filter
Hello,
I created a similar post into jQuery plugins forum, but I noticed that I'm not using Metadata plugin I was thinking I was using, so I left the data here just in case someone could help me:
I'm traversing 3000 dom elements in a very complex web page (it's a very big form). The elements are TRs of tables, and I need to show or hide them following some rules. This is a typical element I need to show or hide:
- <tr dim="{ta_1,en_G,re_V,se_3,tsk}" id_col="GVNSEG_WINNAT_NOM" style="display: none;">
bla bla bla bla
- </tr>
When I need to show a group of elements, I made the following:
- var selectorSeccionesActivadas = '[dim*=se_3],[dim*=se_5],[dim*=se_6],[dim*=se_9]'; // This is runtime generated
- var tabCache = $(tabCacheGet(tabNumActual));
- tabTempShow = $(tabCache).filter('[dim*=en_'+goEnv+'][dim*=re_'+goRed+']'+hiddenSelector+',' +
'[dim*=en_G][dim*=re_G]'+hiddenSelector+',' + '[dim*=en_'+goEnv+'][dim*=re_G]'+hiddenSelector+',' + '[dim*=en_G][dim*=re_'+goRed+']'+hiddenSelector ).filter(selectorSeccionesActivadas).filter(':not([dim*=adv])').show();
The filter to hide elements is similar to that one. As you can see, I save to cache the filter of the first parameter of the "dim" selector:
- function tabCacheGet(tabNum) {
- if ( cacheTab[tabNum] != null) {
- return cacheTab[tabNum];
- } else {
- return cacheTab[tabNum] = $(trCacheGet()).filter('[dim*=ta_'+tabNum+',]');
- }
- }
So when I need to show a set of elements, I run on the cached "ta" parameter, and then I filter the next parameters. What I found is that Firefox runs this very-fast (almost real-time), but IE7 is slower, showing up the "this script is taking up too much time. Do you want to stop it?" message.
When I run the non-cached version of the filter, the hide/show lasts for 4 or 5 seconds. When the first parameter of the filter has been cached, the other filtering lasts for only 0,4 seconds. This last measure is faster enought, but the former is non-aceptable.
I left attached a run on the Firebug profiler, showing that functions that takes up the CPU.
Do you guys know a way of speeding up the filtering? I'm planning on simplifying some of the jQuery functions appearing on the top of the report of the profiling, but I'm completely clueless about jQuery, so I'm not too confident on getting the desired result without breaking something.
Thanks a lot in advance,
Luis Miguel