Hej, mam tabele z duza iloscia wierszy. Tabela jest filtrowana dynamicznie i wiersze albo sa chowane albo pokazywane.
Aby schowac/pokazac wiersz dodaje pooprostu dla TR odpowiednia klase lub ja usuwam, wyglada to mniej wiecej tak


Jak widzicie uzywam do tego czystego js.
Jednak dziala to straaaaasznie wolno. Nie jest to problem warunkow bo gdy usune dodawanie/chowanie klasy to calosc wykonuje sie momentalnie. Gdy tylko przywroce te dwie linijki dodajace/usuwajace klase calosc zamula niemilosiernie.

Problem wystepuje na IE i FF. Na chrome dziala bez zarzutow.

Czy istnieje jakas inna metoda na chowanie/pokazywanie elementow by to dzialalo znosnie? Probowalem tez chowac/pokazywac bezczelnie tr ale to dziala jeszcze wolniej.

Myślę, że to nie kwestia samej metody, lecz renderingu tabeli.

Ale może tak coś się poprawi?

[HTML] pobierz, plaintext 
elTr.className=elTr.className.replace('hidden-element','');
elTr.className+=' hidden-element';
[HTML] pobierz, plaintext 

Bezczelnie, czyli poprzez style.display?

Twoje metoda przyspieszyla nieco ale mimo wszystok jeszcze wolno.

Bezczelne - tak, display

To może zamiast ukrywać:

[HTML] pobierz, plaintext 
tr.hidden-element td{
 font-size:0;
 padding:0;
}
[HTML] pobierz, plaintext 

Nie, raz ze nie dziala to szybciej to jeszcze tabela rozwalona

Nie bardzo wiem jak to mogło rozwalić tabelę, co najwyżej nie są do końca ukrywane komórki (mają bardzo małą wysokość).

Może tak:

[HTML] pobierz, plaintext 
tr.hidden-element{
  position:absolute;
  left:-10000px;
}
[HTML] pobierz, plaintext 

To i tak nie ma sensu skoro nie dziala szybciej

Edit: A nie, przepraszam, dziala szybciej
Jeszcze jakies cenne uwagi?

edit
@trueblue dzieki za wskazowki

Zamiast takiego ukrywania zawsze jest metoda z clip, która może być szybsza. Do tego można popróbować z opóźnieniem renderingu przy pomocy requestAnimationFrame.