What is the principle of filtering products on the page?

Question

Laravel

On the page, products are displayed in 10 pcs. When a price or category is set, the products are updated. At the bottom of the page is a "show more" button that loads products. I reviewed 3 options for how to do this, and each one has great difficulties:
1. Reload the entire page by sending a request to the server and save the typed parameters in the session in the field. But how to load the rest?
2. Each time send a request to the server via ajax and update. But how to control the output, because there are a lot of parameters?
3. Display all products at once upon request, but show the first 10, and hide the rest and display as needed. But then there is too much data and it will take a long time to load.
How to do it right? Explain in detail.

Answer 1

Hit the products on the pages.
First, the first 10 are displayed, so then you need to display the next 10, make a counter in javascript - put 1 in it if the first 10 are immediately loaded on the page, or 0 if the first 10 are loaded after the page is loaded.
When making an ajax request, pass a parameter in which the same counter will be the value, and immediately increment it.
On the server, multiply the passed counter by 10 and take 10 products from this position and return to the page.