Showing recent searches from a search API

Question

We have a web application on angular.js which is using a REST search API to search some users on the system.

/search/user?q='abc'

Now on the web application when the user comes again, we have to show the recent search results he has done in the past.

My Questions :

Can this be done in Angular.js or this has to be done through a separate backend API that shows recent searches? If it has to be backend,would be it something to be saved in databse based upon timestamp ?

Long-term storage - backend. Short-term - cache: [`localStorage` (`ngStorage`)](https://stackoverflow.com/questions/18247130/how-do-i-store-data-in-local-storage-using-angularjs) — Aleksey Solovey, Jan 08 '18 at 12:12
Can localStorage works if users moves out of the application and comes back after certain days ? — Vineet Singla, Jan 08 '18 at 12:17
@VineetSingla ["All expiration rules are left up to the user"](https://johnresig.com/blog/dom-storage/) — Aleksey Solovey, Jan 08 '18 at 12:19
@VineetSingla it's still runs in a _particular_ mobile browser — Aleksey Solovey, Jan 08 '18 at 12:20

score 0 · Answer 1 · answered Jan 11 '18 at 08:27

From my point of view, you have to work client side and rely on the web browser "storage". To do this, you have 3 choices (maybe i forget some).

Cookie storage
Session storage
Local storage

For more infos about these three, check out this answer : https://stackoverflow.com/a/19869560/2971820

But the side effect of theses techniques is that your searches are not really saved, so if the user comes on your web application by another way (eg. Android mobile app), you can't give him back his previous searches.

score 0 · Answer 2 · answered Aug 03 '19 at 20:52

TL;DR I've written a library to handle this + it's edge cases, see https://github.com/JonasBa/recent-searches#readme for usage.

While all examples are technically ok, they do not cover the edge cases of storing recent searches such as implementing expiration, ranking or limits for LocalStorage space. The major con of LocalStorage that you need to consider is that it will always be scoped to the browser and device that is doing the searches. E.g. if you search on desktop and then search on your mobile, recent searches would not show up and vice versa. Same goes for different domains, as LocalStorage is scoped per domain.

Some of the edge cases that you should think about when implementing recent searches are:

Expiration: Consider that someone searches for a query iPhone, but has looked for a query repairing iPhone 1 month ago, that repairing iPhone query is likely obsolete.

Ranking: Same goes for ranking when doing prefix search, if a user has made a query "apple television" 3h ago and a query "television cables" 8h ago, and they now search for "television", you want to probably implement a ranking system for the two.

Safely managing LocalStorage: Just writing to LocalStorage will eventually result in a massive JSON that you'll need to parse every time, thus gradually slowing down your application until you hit the storage limit and loose this functionality.

The recent-searches library helps you tackle all of the above. It will help you with all of the above issues and allow you to build recent-searches really quickly!

Showing recent searches from a search API

2 Answers2