How to Implement Caching in Angular | Caching API Response in Angular | Caching Techniques
HTML-код
- Опубликовано: 17 июн 2023
- caching api response in angular | caching api requests in javascript | caching api calls | api caching best practices | caching api responses | caching api data | how to implement caching in web api | how to implement caching in rest api
Useful links:
Source Code-
github.com/dnyaneshwargiri/an...
Related Videos:
1) template driven forms vs reactive forms in angular
• Template Driven Forms ...
2) Integrating Google Sign-In into your web app
• Implement google sign ...
3) How To Install Angular on Windows
• How to Install Angular...
4) Angular folder structure | angular architecture
• Angular Folder Structu...
5) Angular components explained | what is angular component
• Angular Components Exp...
Topic Covered In This Video:
angular tutorial,
angular rxjs,
caching explained,
angular api calls,
angular performance,
caching in angular,
session storage vs local storage,
browser cache in javascript,
angular project,
angular caching,
web3 concept
angular 16 tutorial,
how to improve website performance,
http interceptors,
rxjs interview questions and answers,
rxjs operators,
google chrome,
rxjs angular tutorial,
rxjs sharereplay vs publishreplay,
rxjs sharereplay,
angular tutorial,
angular architecture,
angular tutorial for beginners,
angular 16 features,
angular 16 updates,
#angular #rxjs #webdevelopment #brogrammers #angulartutorial #javascript #http #caching #web3 #frontend #frontenddeveloper 
Наука
This video was really helpful
Love it 💙 Thank you for watching 🤞
As you have spoken about local and session storage, could you make a video to transform a simple Angular Application in a PWA?
Thank you for suggesting. I will try it.
What about service worker, can we use that for caching api data
Technically you can use service worker to add caching behaviour on API but SW is not indented primary for API caching, i mean it can do lot more than just caching like e.g. offline forms & client side load balancing. It is like overkilling caching purpose by using SW, & you mostly don't want to add a dedicated JS process thread running in your browser just to cache some data if you're application code is already capable of doing same without it.
This is great but then how do you revalidate your cached data?
Because after the first call and you set your cache then subsequent calls will get the cached data but how do you tell angular to revalidate that data?
To revalidate data we can put expiry to a data. It can be achieved in http interceptor case easily. Or you add your own expiry check logic. This can be added with help of jwt token module if you want to write 100% safe & secure validity logic.
There is something called 'If-Modfied-Since' header, we can set our expiry date on the HttpRequest.
What will be the age of cache data in first approach, like will i get the fresh response after some time or it will be cached there all the time.
Thank you for great question 🙂 I was expecting this sooner or later. The way httpinterceptor store cache is it uses browser storage. But there are cache reset and refresh method available. Usually cache is refreshed with JWT token in practical way which is more secure (based on JWT token's life httpinterceptor decides to use cache or make new hit) . Long story short it uses browser storage (not session nor cookie)
If you clear browser storage your cache is gone.
greate @@brogrammers if we want the cache to be still there after reloading a page or switching between pages then we should use localstorage as a key value pair approach. Am i right ?
You are right.