As angular 17 doesnt have module, how we can handle lazy load module routing ? all the components are stand alone does it impact performance of existing application after migrating to 17 ? any idea?
I have major issue with timing in angular I have a dialog with a form and need to fetch the data for that form before it's opened wondering if this will help.
I thought it would be a nice alternative to bypass the ssr but after testing I don't see any improvement yet. I peppered my components with @defer blocks in the hope of reducing Initial Chunk Files but quite the opposite happened. The more @defer I put, the more the main.js file gains in size. It's still very useful for displaying skeletons.
Hi, Thanks for the explanation. I have a couple of questions: 1 - Is it possible to revert back to the original state when the condition is undone. For eg - the view is rendered when the code enters the viewport but when the user scrolls up and the the code is removed from the viewport, the view stays 2 - in case the view doesn't get rendered for some reason, can we re-render them somehow?
How about when you have 2 defer inside the same template. Will create two chunks i assume, but how does it know what placeholder/loading/error to use? Great video!
In a scenario where multiple @defer directives are used, each @defer should have a corresponding @placeholder block immediately following it. The @placeholder block that follows a @defer block is the placeholder for that specific deferred content. eg. @defer(on viewport) {
Simao answer is perfect. You create multiple @defer with multiple @placeholder blocks for each of them. It will create separate chunks for every defer.
WATCH NEXT: Angular Interview Questions and Answers - Dominate Your Next Interview - ua-cam.com/video/5A_YKlVWMPo/v-deo.htmlsi=2DCn7yspEAAJ2H6l
Thanks!
Thank you so much for your support. It means a lot to me!
¡Gracias!
Thank you so much for your support. It means a lot to me!
Good overview! Thank you!
Glad it was helpful!
Nice video! I take it at 8:50, the Load button does nothing if you press the Show button first because the Show button did the loading instead?
Yes
Very powerful feature. Thanks for the explanation
Glad it was helpful!
So in a master detail you can lazy losd details bit by using defer a d button click. Insa e
As angular 17 doesnt have module, how we can handle lazy load module routing ? all the components are stand alone does it impact performance of existing application after migrating to 17 ? any idea?
I already covered that
ua-cam.com/video/NFJbXP6Ci98/v-deo.htmlsi=dXl2xXJGoOik9ZB9
I have major issue with timing in angular I have a dialog with a form and need to fetch the data for that form before it's opened wondering if this will help.
Kind of. But you can do the same without defer.
@@MonsterlessonsAcademy I figured it out with subscribe but all these new things I haven't applied yet, and it's scary
I thought it would be a nice alternative to bypass the ssr but after testing I don't see any improvement yet. I peppered my components with @defer blocks in the hope of reducing Initial Chunk Files but quite the opposite happened. The more @defer I put, the more the main.js file gains in size. It's still very useful for displaying skeletons.
I didn't try defer with ssr yet
Thanks for the explanation
You are welcome!
Very good explaination
Thanks!
Hi,
Thanks for the explanation. I have a couple of questions:
1 - Is it possible to revert back to the original state when the condition is undone. For eg - the view is rendered when the code enters the viewport but when the user scrolls up and the the code is removed from the viewport, the view stays
2 - in case the view doesn't get rendered for some reason, can we re-render them somehow?
I didn't try this cases
@derfer combined with ssr.. does that even make sense?
I didn't try that yet but no? because on backend we want to get the full prepared page. so all defered blocks should just be skipped
@@MonsterlessonsAcademy yeah agree
How about when you have 2 defer inside the same template. Will create two chunks i assume, but how does it know what placeholder/loading/error to use?
Great video!
In a scenario where multiple @defer directives are used, each @defer should have a corresponding @placeholder block immediately following it. The @placeholder block that follows a @defer block is the placeholder for that specific deferred content.
eg.
@defer(on viewport) {
}
@placeholder {
Loading some component...
}
@loading {
...
}
@error{
error
}
@defer(on viewport) {
}
@placeholder {
Loading another component...
}
@loading {
...
}
@error{
error
}
@@Simao-xk1ye
i think he meant this
@defer(on viewport) {
@defer(on viewport) {
}
@placeholder {
Loading another component...
}
@loading {
loading
}
@error{
error
}
}
@placeholder {
Loading component...
}
@loading {
loading
}
@error{
error
}
will this work ?
Simao answer is perfect. You create multiple @defer with multiple @placeholder blocks for each of them. It will create separate chunks for every defer.
great job, thanks!
Glad you liked it!
Спасибо большое!
I like u video so much!
Glad to hear that!
Your speech making the lesson a little more difficult to understand
this is crazy..
Yeap!
string replace @if (condition) -> @defer(when condition; prefetch on idle) 😂
I don't think it's a good idea to pack each small if condition in additional chunk