How to make ajax filter for products? Where to store the current state of the filter?

Question

JavaScript

There is a product, there is a filter. With AJAX requests, everything is simple. I don’t understand where I can store the current state of the filter, if the filter is just a set of buttons, when you click on each of them, an ajax request is triggered.

I thought to store the state in a js variable or in a session. But both options are useless if the user opens the second tab of the same page, or goes to the product page and wants to return.

I think it's worth storing the state in the URL. But here I don’t know how to add new GET parameters using js (jquery). Maybe this can be done through Vue, Angular, etc. ? (sorry, I'm still a noob in these technologies). But jQuery takes precedence.

Thank you for your help!

PS The online store in this issue acts as an abstraction that allows you to understand the essence of the issue. No need to advise CMS for an online store

Answer 1

localstorage was invented for this a long time ago. you can read more here

Answer 2

I was also advised to look at the History api
https://astrio.ru/blog/History-API/