I've read blog React Admin 3.3: Faster Navigation And Reduced Footprint Thanks To Application Cache but still do not understand know create real cache without need to full update list.
For several list resources which changed rarely I want to cache response in IndexedDb.
Logic for updating and optimistic rendering should be following (if previous version of list already in cache):
Each entry in list have timestamp field last_updated.
When opening list for cached resource my dataprovider return current list version from IndexedDb.
Ideally during this loading spinner should continue to rotating (I do not sure if it is possible since I've resolved Promise during previous step)
At same time during step 2 data provider asynchroniously launch fetch new data from API like "Give me new entries updated after timestampN, where timestampN most newest timestamp in cache.
After receiving data from API cache will be updated and data provider should notify react-admin somehow that cached data changed and it need to re-render data table.
Finally loading spinner stopped.
Mostly I do not know how to achive step 5 since it is most important here.
Can someone help with ideas how to implement such or similar application cache?
Related
As of now, my app contains an array and the user can manipulate the order of items in it by dispatching actions. I'm using redux persist and even if I directly change the array elements by editing the source file, the array does not update unless I clear the app cache.
What are my options to update this kind of persistent data after I publish it to the store without forcing users to clear the cache?
What are you looking for is migrations.
How it works:
Load user's previous state from local storage on app start
Update fields you need
Here is a setup example
I'm using Nuxt 2.15 with target: "static" and hosting on a shared hosting "hostinger". I fetch the data from an external API using axios and Vuex state management and here comes the problem where the app doesn't load the new data it gets from the API.
How can I make the app rerenders its data and output the newly updated data it gets from fetching the API?
I assume you are using nuxtServerInit or asyncData for getting the data from API. This used with static mode means that data is get only during generation. Which is great for not too often updated content because it doesn't have to connect to server every time it's faster.
Depend on your needs you can:
Get data from API in mounted() hook this will get data from API every time the page is loaded BUT it also means that it could be loaded with some delay and it probably wouldn't be indexed by search engines
You can go with universal mode (https://nuxtjs.org/docs/configuration-glossary/configuration-mode/) and start your site on node.js server which will use up-to-date data from API each time user will open your site.
EDIT: as #kissu corrected me in comment this one is deprecated, please use this one: target:'server' instead of target:'static', which is default so you can just remove this line (https://nuxtjs.org/docs/configuration-glossary/configuration-target/ )
We are trying to build custom stock levels based on the Warehouse, a user selected. Until the user does not have a selected Warehouse, the stock level should be 0.
Now we are experiencing weird behaviour, where it still shows a Stock Level of 0, even though the user has selected a store with valid stock level for that product.
After some researching, we found several places in the java code, where calls like e.g. getProduct are being cached for 120 seconds or more. I guess this is done due to performance improvements..?
This cache control and max age for these calls even seems to persist over fresh incognito windows in e.g. google chrome.. Sometimes the getProduct call is not even executed (Not listed in the network tab) and only get's executed after several hard refresh reloads (but still gives back the cached and therefore wrong response).
Sometimes it seems, that the cache persists for even longer than this 120 seconds, we haven't figured out yet, why..
This page explains how the caching can be implemented, but it does not say, how the server side caching works: https://help.sap.com/viewer/9d346683b0084da2938be8a285c0c27a/1905/en-US/8b711228866910149500b73575cb386e.html
My Questions around it:
How does the Server side caching work, how can it be invalidated (besides turning off the whole feature)
How should dynamic Product information be handled? Should the whole cache be disabled or rather a custom OCC endpoint be used to get the stock level?
In the mean time we partially figured out, how we guess it works:
Server side Caching is done via EHCache, the time to live is defined in ehcache.xml
we needed to enhance the cache for productCode to also contain the selected store
Besides "fixing" the server side caching, we still have the problem, the the data is getting cached in the browser (we assume via Etag header, which is based on the response body). As the response body does not know anything about the selected store (sent via http header), it doesn't change, and therefore the data is not requested again after selecting the store..
Any idea on how include the information from the http header into the Etag value?
I am setting up a custom widget in Sitefinity 13 that retrieves data from an external source and caches that data on the server-side. I need the widget data to refresh the data on whatever page it is on once that cache timeout is over, but it appears that the Sitefinity page caching mechanism will cache the rendered results of a page and won't make the call to my custom widget's controller to see if we need to update the data. I've looked into the built-in Sitefinity cache dependency functionality, like IHasCacheDependency and SubscribeCacheDependency, but that appears to be geared toward watching when a page, widget, or other item is updated through Sitefinity's mechanisms (e.g. update version of page is published). I don't see a way using that functionality to accomplish my goal.
Am I missing something with the built-in cache dependency module? What options do I have?
You have a few options:
Instead of getting the data from your controller, you can get it via javascript call. That call can be either towards the external source or, if that's not feasible, towards a proxy api controller on your site, which in turn requests the external api. This way the page will be cached, but the JS script will run and will not be dependent on the page cache at all.
Create a new page cache profile in the settings, that has no sliding expiration and lasts exactly the time you need, e.g. 5 minutes. Then set that profile as cache profile of your page. This way page cache will be invalidated exactly when you need it (time-wise).
How to refresh the interface after you add a strip of data to the backend database in Vue.js?
I mean, if I add a item data to the database. there are two case for refresh the interface.
refresh the list api to get the page data.
append the added item data to local list.
what is the best way to do this?
I think both the solutions are valid it depends on what kind of write operation we are planning to do. Given that you do all the validations on the front-end which leaves lesser chance for errors on the backend. I do the following based on the use case.
Add/Update the item locally and then based on the response from the server I remove it again in case of an error. This is an optimistic technique used by a lot of websites and worls really well for CRUD kind of operations.
Let's say that your new operating is going to creaate a new user in a 3rd party api. So doing an optimistic thing might not be the best. So what I do is make the request, show a toast/alert that the request is happening, and then use sockets or long polling to get the changes. When the request is finally done show the data. In the meanwhile you can insert a dummy item showing loading.