I think that depends on the code’s best practice.
A few months ago I made a pipe for a very heavy search that sometimes searches up to 50,000 different data sheets in a single search and sometimes took a maximum of 5.6 seconds to perform the exact search on this large amount of data.
This is the code of the pipe i created.
import { Pipe, PipeTransform } from '@angular/core';
import * as _ from 'lodash';
@Pipe({
name: 'filter'
})
export class FilterPipe implements PipeTransform {
transform(items: any[], searchText: string): any[] {
let data: any[] = [];
var chars = {
"á": "a", "é": "e", "í": "i", "ó": "o", "ú": "u",
"à": "a", "è": "e", "ì": "i", "ò": "o", "ù": "u",
"Á": "A", "É": "E", "Í": "I", "Ó": "O", "Ú": "U",
"À": "A", "È": "E", "Ì": "I", "Ò": "O", "Ù": "U"
}
var remplazador = /[áàéèíìóòúùñ]/ig;
if (!items) {
return [];
}
if (!searchText) {
return items;
}
let comparador = String(searchText).replace(remplazador, function(valor) { return chars[valor] })
comparador = comparador.replace(/[^0-9A-Za-z]/g, '')
comparador = comparador.toLowerCase()
items.forEach(i => {
Object.keys(i).forEach(async function(k, v) {
let posicion = String(i[k]).replace(remplazador, function(valor) { return chars[valor] })
posicion = posicion.replace(/[^0-9A-Za-z]/g, '')
if (await _.includes(String(posicion).toLowerCase(), comparador)) {
if (!data.includes(i)) {
data.push(i)
}
}
});
if (i["atributos"]) {
try {
i["atributos"].forEach(j => {
Object.keys(j).forEach(async function(k, v) {
let posicion = String(j[k]).replace(remplazador, function(valor) { return chars[valor] })
posicion = posicion.replace(/[^0-9A-Za-z]/g, '')
if (await _.includes(String(posicion).toLowerCase(), comparador)) {
if (!data.includes(j)) {
data.push(i)
}
}
});
})
} catch (e) { }
}
})
return data
}
}
The pipeline is about results with many more than 5 levels within itself and is searched by all types of cemeteries that each one has inside, it is also worth mentioning that the variables are Spanish as it is done in this language by practice for my other co-workers who do not have much knowledge or are not very familiar with the keys to data arrangements in English
Maybe you can read it and try to understand it and you will see that the performance is very good
And this is used in an ngFor that changes dynamically according to the text that is entered in the search bar and the filter pipe is activated.