0

i am developing a webapp and it is almost finished. The problem is that there are a lot of images at the assets folder and when i am navigating the screen sometimes blinks changing the webapp background images.

Is it possible to preload all the resources or cache them in the browser in order to make the navigation smoother? Also,can i get feedback of the preload process in order to show a "loading" animation?

Thank you very much!

1 Answers1

-1

I didn't do it with images, but I'd try adding a Resolve guard to your home (default) route. Here's an example where I preload a large 45MB JSON file using the resolver https://github.com/Farata/angulartypescript/tree/master/chapter3/router-samples/src/app/resolver

In that app I use Angular Material <md-progress-bar> bar to show the progress.

Yakov Fain
  • 11,972
  • 5
  • 33
  • 38
  • The link seems to be broken. – Stef Geysels Mar 06 '18 at 09:24
  • Here's an updated one: https://github.com/Farata/angulartypescript/tree/master/code-samples/chapter4/router-advanced-samples/src/app/resolver – Yakov Fain Mar 06 '18 at 12:27
  • The link is broken again. For the love of Tim Berners-Lee just post the relevant code here. – Chris Weber Sep 19 '18 at 14:41
  • Now there are two sets of code samples. The Angular6 version of this one is here: https://github.com/Farata/angulartypescript/tree/master/code-samples/Angular6/chapter4/router-advanced-samples/src/app/resolver If you really love Tim Berners-Lee, you'll figure out the link for the Angular 5 version :) – Yakov Fain Sep 20 '18 at 18:19