How to update after the js interface returns a large amount of data cache?

there is a page that requests an interface
API to return a large amount of data
this data will be updated irregularly (once every 10 days every half a month)
how can this data be stored locally?
after the local cache, after the next interface data update, I need to request the interface cache again.
how do I know when to re-request the interface?

the main purpose is to reduce unnecessary requests and waste resources


on the browser side, larger data can be stored in localStorage. There are several ways to request data:

  • the first is to request each time to verify the version number (or update the timestamp);
  • the second is a scheduled request (no matter whether it is updated or not, it is requested every 20 days);
  • the third advantage that you can use a websocket, is that if there is an update in the background, the new data will be returned, but the talent is overqualified!
  • fourth, add a button [refresh] to the page, depending on the mood.

so what is the purpose of local storage? To avoid data reparsing? Or the backend does not want to query the data every time (affecting server performance), so just select the model according to the responsibilities of the front and back end. Personally, cache optimization is a better solution for the backend, just like requesting APP updates. If a timestamp or false is returned, it means that there is no new data at the backend. If it is new data, replace the data in the local localStorage directly.


you can learn about http negotiation cache and set Last-Modified or Etag.
Link description

Link description


as far as I understand it, you want to say that the data is too large. After one request, it exists locally, and you don't have to request it next time you come in.
then save it with localstorage, but if you need to tell you when the interface data is updated, you will not know locally. If you do not want to request the big data API, it is recommended to ask the backend for an API to check whether the data is updated. Request the API that detects updates every time you enter the page, and then request the big data API if there is an update, and then update the local data


when storing the interface data into the [current time + update frequency] = validity returned by the server, and then determine whether the current time exceeds the validity period for each visit, so as to pull the local cache or re-request?


is cached in indexDB or localstorage, depending on your convenient access and data size, the localstorage cannot hold the data if the data is too large.
the rendered page first gets the data from the local cache and sends the request at the same time.
when the request returns, it determines whether the data is consistent, and if it is inconsistent, update the page again and update the cache.
if the returned data structure itself can be easily compared to know whether to update, then it's best to compare hash. Adding hash, to each storage will consume a little bit of performance

.
Menu