How i make Searching fast when trying to search the products using searchbar from the database

Ionic Framework ionic-v3
1

I am using ion-search bar . Searching is very slow when i am searching the products from the database because the array made from the database is big i am unable to handle this .
here is my code what i am using
//Html
<button ion-button icon-only (click)=“openSearchbar()”>

<ion-searchbar *ngIf=“isOpenSearchbar” class=“navMore” #searchBar [showCancelButton]=“true” [animated]=“true”

(ionInput)=“searchProduct($event)” (ionCancel)=“searchCancel($event)”>

tsfile
fetch function used to fetch the products from database and put the list in products array
fetchProductsFromDB() {
console.log(‘Start fetching from database’);
this.sqlite.create({
name: ‘mkauto.db’,
location: ‘default’
}).then((db: SQLiteObject) => {
db.executeSql(“SELECT * FROM products”, {})
.then((data) => {

				this.products = [];
				if (data.rows.length > 0) {
					for (let i = 0; i < data.rows.length; i++) {
						this.products.push({
							sku_desc: data.rows.item(i).sku_desc,
							product: data.rows.item(i).product,
							brand: data.rows.item(i).brand,
							for_model: data.rows.item(i).for_model,
							mrp: data.rows.item(i).mrp,
							part_code: data.rows.item(i).part_code,
						});
					}
				}
				console.log("Data from products", this.products);
				this.searchproducts = this.products;
				console.log("Search Product list", this.searchproducts);
			})
			.catch(e => { });
	}).catch(e => { });
}

//Search function
searchProduct(ev) {
try {
let value = “”;
if (ev.target.value) {
value = ev.target.value.trim();
console.log(“Value is”, value);
this.products = this.products.filter(function (product) {
return (product.product.toLowerCase().indexOf(value.toLowerCase()) > -1)
|| (product.product.indexOf(value) > -1)
|| (product.part_code.toLowerCase().indexOf(value.toLowerCase()) > -1)
|| (product.part_code.indexOf(value) > -1)
});
}
if (value === “”) {
this.products = this.searchproducts;
} else {

			this.products = this.products.filter(function (product) {
				return (product.product.toLowerCase().indexOf(value.toLowerCase()) > -1)
					|| (product.product.indexOf(value) > -1)
					|| (product.part_code.toLowerCase().indexOf(value.toLowerCase()) > -1)
					|| (product.part_code.indexOf(value) > -1)
			});
		}
	} catch (e) {
		console.log(e);
	}
}
searchCancel($event) {
	console.log("Inside cancel event");
	this.products = this.searchproducts;
	this.isOpenSearchbar = false;
	this.viewctrl.showBackButton(true);
}
openSearchbar() {
	console.log("Insode open searchbar event");
	this.isOpenSearchbar = true;
	this.viewctrl.showBackButton(false);
	setTimeout(() => {
		this.myInput.setFocus();
	}, 100);
}

I am searching the products with product name
I just want to know how i make searching fast in ionic 3

2

The number one rule of querying a database is restrict the result set to the minimum. So I’d recommend you add an SQL WHERE clause and let the database do the work of filtering the list of products and you should also limit the number of results your query can return (such as SELECT * from products WHERE product like '%chair%' LIMIT 20). After that you will have a much smaller result set to search/render.

3

but i need to search over all the products present in database if i set limiti only those products are present

4

Use a cursor and pagination.

See: