Lazy Loading modules with ui-router and ocLazyLoad
We've looked at lazy loading with ocLazyLoad previously, but what if we are using ui-router and want to lazy load modules when we change states?
Hi
It would be really useful if sometimes you state the use of doing these patterns in real world. Most of the time its easy to see the practical use of your lessons directly into my work but there are times (like this lazyLoad) i do not understand the clear benefit.
Thank you so much for your to-the-point no-nonsense webcasts, I'm huge fan of Egghead since I started working on Angular @ work accidentally :) few months back
Guru
Lazy loading helps make your initial page load faster (because you load less JS/CSS/etc when you first open the website).
This is usually only applicable to really huge apps (think teams of 10+ developers working on dozens of modules).
I enjoyed the video but I would have been more excited if it were taken to the point of real world, insofar as dynamic states.
Although it is widely recognized that Lazy Loading accommodates faster loading of resources especially for those in a mobile environment, I think another, equally, if not more important benefit would be security related.
If I have resources that are available to respective roles, I do not want to download all these resources to everyone at page init. Some maybe nefarious.
That is why I like dynamic routers, ui-routers to be exact because of their nestability.
How much more attractive would a tutorial be if Lazy Loading were shown in a dynamic route environment for those of use wanting the best of both worlds, JIT resources and security !
A very useful real world pattern for this is to use Lazy Loading for Online only modules - specifically when using the appcache for web apps offline.
E.g. I am using google-maps module, which requires the google maps js file loaded prior to being configured. And importantly the google maps js file error's when app not online (so its no good as a cache file) - which means the module fails to load - so angular breaks.
Hence through lazy load my app only brings maps down if online, via a subsequent resolve. This allows our app to run in offline mode without errors. And enable google maps if online.
So I find this a very useful pattern in a Cloud API centric world....
Hope you can see the benefit in this "on-demand" approach for online resources.