Em uma página da web eu tenho uma lista bastante grande de itens (digamos, cartões de produto, cada um contém imagem e texto) - cerca de 1000 deles. Eu quero filtrar essa lista no cliente (apenas os itens, que não são filtrados devem ser mostrados), mas há um problema de desempenho de processamento. Eu aplico um filtro muito estreito e apenas 10-20 itens permanecem, então cancele-o (para que todos os itens tenham que ser mostrados novamente), e o navegador (Chrome em uma máquina muito boa) desliga por um segundo ou dois.

Eu renderizo novamente a lista usando a seguinte rotina:

<code>for (var i = 0, l = this.entries.length; i < l; i++) {
    $(this.cls_prefix + this.entries[i].id).css("display", this.entries[i].id in dict ? "block" : "none")
}
</code>

dict é o hash dos ids dos itens permitidos

Esta função em si é executada instantaneamente, é renderização que desliga. Existe um método de renderização mais ideal do que alterar a propriedade "display" dos elementos DOM?

Obrigado por suas respostas antecipadamente.