Lazy Loading for Lightning Components

Clash Royale CLAN TAG#URR8PPP

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty margin-bottom:0;

up vote
1
down vote

favorite

Need some advise. Following is the code for lightning app, where all components are included. I am running out of various governor limits when they execute together. Hence, I am planning to make their context separate. What would be the best solution to invoke/execute each lightning components in separate context by keeping all of them single app? Thanks in advance!

<aura:application extends="force:slds">
 <c:ComponentOne />
 <c:ComponentTwo />
 <c:ComponentThree />
 <c:ComponentFour />
 <c:ComponentFive />
 <c:ComponentSix />
 .
 .
 .
</aura:application>

lightning-components lightning lightning-experience lightning-apps

share|improve this question

edited 4 hours ago

asked 5 hours ago

Devendra

4,1591320

• 
  
  
  

  
  

  
  
  
  
  
  

  
  Can you clarify what do you refer by this -- I am planning to make their context separate, as how are you planning to separate the context? I would imagine using aura:if here to load the other components only when required should be your approach.
  – Jayant Das
  5 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  Not sure what you are doing in each of them but when u talk about lazyloading compoents you use aura:If as the the child dom would not be loaded in the first place. More on Best Practices for Conditional Markup
  – codeyinthecloud
  5 hours ago
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  @JayantDas I would like to load all components in single app, hence I can't use aura:if . Assuming I have VF page and different VF components, I would have used <apex:actionFunction> inside each VF component to perform lazy loading. Similarly, I am looking for a solution in case of lightning component.
  – Devendra
  5 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  I would like to load all components in single app, hence I can't use aura:if -- you can still use aura:if to load all components in single app. Based on what you have in your snippet in your question, you just surround other components which you want to lazy load in an aura:if and load only based on the condition.
  – Jayant Das
  5 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  @Devendra IF you are talking about loading one component after other you will have to implement some sort of custom time based mechanaism either by aura:if or $A.createcomponent by loading them dynamically in javascript either approach would not load the dom so all the onload functionalities(such as server calls which i why your'e probably talking about governer limits) are held untill they render. One other way would be to trigger $A.createComponent on after render of each component
  – codeyinthecloud
  4 hours ago
  
  

  
  
  
  

 | 
show 5 more comments

up vote
1
down vote

favorite

Need some advise. Following is the code for lightning app, where all components are included. I am running out of various governor limits when they execute together. Hence, I am planning to make their context separate. What would be the best solution to invoke/execute each lightning components in separate context by keeping all of them single app? Thanks in advance!

<aura:application extends="force:slds">
 <c:ComponentOne />
 <c:ComponentTwo />
 <c:ComponentThree />
 <c:ComponentFour />
 <c:ComponentFive />
 <c:ComponentSix />
 .
 .
 .
</aura:application>

lightning-components lightning lightning-experience lightning-apps

share|improve this question

edited 4 hours ago

asked 5 hours ago

Devendra

4,1591320

• 
  
  
  

  
  

  
  
  
  
  
  

  
  Can you clarify what do you refer by this -- I am planning to make their context separate, as how are you planning to separate the context? I would imagine using aura:if here to load the other components only when required should be your approach.
  – Jayant Das
  5 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  Not sure what you are doing in each of them but when u talk about lazyloading compoents you use aura:If as the the child dom would not be loaded in the first place. More on Best Practices for Conditional Markup
  – codeyinthecloud
  5 hours ago
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  @JayantDas I would like to load all components in single app, hence I can't use aura:if . Assuming I have VF page and different VF components, I would have used <apex:actionFunction> inside each VF component to perform lazy loading. Similarly, I am looking for a solution in case of lightning component.
  – Devendra
  5 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  I would like to load all components in single app, hence I can't use aura:if -- you can still use aura:if to load all components in single app. Based on what you have in your snippet in your question, you just surround other components which you want to lazy load in an aura:if and load only based on the condition.
  – Jayant Das
  5 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  @Devendra IF you are talking about loading one component after other you will have to implement some sort of custom time based mechanaism either by aura:if or $A.createcomponent by loading them dynamically in javascript either approach would not load the dom so all the onload functionalities(such as server calls which i why your'e probably talking about governer limits) are held untill they render. One other way would be to trigger $A.createComponent on after render of each component
  – codeyinthecloud
  4 hours ago
  
  

  
  
  
  

 | 
show 5 more comments

up vote
1
down vote

favorite

up vote
1
down vote

favorite

Need some advise. Following is the code for lightning app, where all components are included. I am running out of various governor limits when they execute together. Hence, I am planning to make their context separate. What would be the best solution to invoke/execute each lightning components in separate context by keeping all of them single app? Thanks in advance!

<aura:application extends="force:slds">
 <c:ComponentOne />
 <c:ComponentTwo />
 <c:ComponentThree />
 <c:ComponentFour />
 <c:ComponentFive />
 <c:ComponentSix />
 .
 .
 .
</aura:application>

lightning-components lightning lightning-experience lightning-apps

share|improve this question

edited 4 hours ago

asked 5 hours ago

Devendra

4,1591320

Need some advise. Following is the code for lightning app, where all components are included. I am running out of various governor limits when they execute together. Hence, I am planning to make their context separate. What would be the best solution to invoke/execute each lightning components in separate context by keeping all of them single app? Thanks in advance!

<aura:application extends="force:slds">
 <c:ComponentOne />
 <c:ComponentTwo />
 <c:ComponentThree />
 <c:ComponentFour />
 <c:ComponentFive />
 <c:ComponentSix />
 .
 .
 .
</aura:application>

lightning-components lightning lightning-experience lightning-apps

lightning-components lightning lightning-experience lightning-apps

share|improve this question

edited 4 hours ago

asked 5 hours ago

Devendra

4,1591320

share|improve this question

edited 4 hours ago

asked 5 hours ago

Devendra

4,1591320

share|improve this question

share|improve this question

edited 4 hours ago

edited 4 hours ago

edited 4 hours ago

asked 5 hours ago

Devendra

4,1591320

asked 5 hours ago

Devendra

4,1591320

asked 5 hours ago

Devendra

4,1591320

4,1591320

• 
  
  
  

  
  

  
  
  
  
  
  

  
  Can you clarify what do you refer by this -- I am planning to make their context separate, as how are you planning to separate the context? I would imagine using aura:if here to load the other components only when required should be your approach.
  – Jayant Das
  5 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  Not sure what you are doing in each of them but when u talk about lazyloading compoents you use aura:If as the the child dom would not be loaded in the first place. More on Best Practices for Conditional Markup
  – codeyinthecloud
  5 hours ago
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  @JayantDas I would like to load all components in single app, hence I can't use aura:if . Assuming I have VF page and different VF components, I would have used <apex:actionFunction> inside each VF component to perform lazy loading. Similarly, I am looking for a solution in case of lightning component.
  – Devendra
  5 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  I would like to load all components in single app, hence I can't use aura:if -- you can still use aura:if to load all components in single app. Based on what you have in your snippet in your question, you just surround other components which you want to lazy load in an aura:if and load only based on the condition.
  – Jayant Das
  5 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  @Devendra IF you are talking about loading one component after other you will have to implement some sort of custom time based mechanaism either by aura:if or $A.createcomponent by loading them dynamically in javascript either approach would not load the dom so all the onload functionalities(such as server calls which i why your'e probably talking about governer limits) are held untill they render. One other way would be to trigger $A.createComponent on after render of each component
  – codeyinthecloud
  4 hours ago
  
  

  
  
  
  

 | 
show 5 more comments

• 
  
  
  

  
  

  
  
  
  
  
  

  
  Can you clarify what do you refer by this -- I am planning to make their context separate, as how are you planning to separate the context? I would imagine using aura:if here to load the other components only when required should be your approach.
  – Jayant Das
  5 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  Not sure what you are doing in each of them but when u talk about lazyloading compoents you use aura:If as the the child dom would not be loaded in the first place. More on Best Practices for Conditional Markup
  – codeyinthecloud
  5 hours ago
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  @JayantDas I would like to load all components in single app, hence I can't use aura:if . Assuming I have VF page and different VF components, I would have used <apex:actionFunction> inside each VF component to perform lazy loading. Similarly, I am looking for a solution in case of lightning component.
  – Devendra
  5 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  I would like to load all components in single app, hence I can't use aura:if -- you can still use aura:if to load all components in single app. Based on what you have in your snippet in your question, you just surround other components which you want to lazy load in an aura:if and load only based on the condition.
  – Jayant Das
  5 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  @Devendra IF you are talking about loading one component after other you will have to implement some sort of custom time based mechanaism either by aura:if or $A.createcomponent by loading them dynamically in javascript either approach would not load the dom so all the onload functionalities(such as server calls which i why your'e probably talking about governer limits) are held untill they render. One other way would be to trigger $A.createComponent on after render of each component
  – codeyinthecloud
  4 hours ago
  
  

  
  
  
  

Can you clarify what do you refer by this -- I am planning to make their context separate, as how are you planning to separate the context? I would imagine using aura:if here to load the other components only when required should be your approach.
– Jayant Das
5 hours ago

Can you clarify what do you refer by this -- I am planning to make their context separate, as how are you planning to separate the context? I would imagine using aura:if here to load the other components only when required should be your approach.
– Jayant Das
5 hours ago

Not sure what you are doing in each of them but when u talk about lazyloading compoents you use aura:If as the the child dom would not be loaded in the first place. More on Best Practices for Conditional Markup
– codeyinthecloud
5 hours ago

Not sure what you are doing in each of them but when u talk about lazyloading compoents you use aura:If as the the child dom would not be loaded in the first place. More on Best Practices for Conditional Markup
– codeyinthecloud
5 hours ago

@JayantDas I would like to load all components in single app, hence I can't use aura:if . Assuming I have VF page and different VF components, I would have used <apex:actionFunction> inside each VF component to perform lazy loading. Similarly, I am looking for a solution in case of lightning component.
– Devendra
5 hours ago

@JayantDas I would like to load all components in single app, hence I can't use aura:if . Assuming I have VF page and different VF components, I would have used <apex:actionFunction> inside each VF component to perform lazy loading. Similarly, I am looking for a solution in case of lightning component.
– Devendra
5 hours ago

I would like to load all components in single app, hence I can't use aura:if -- you can still use aura:if to load all components in single app. Based on what you have in your snippet in your question, you just surround other components which you want to lazy load in an aura:if and load only based on the condition.
– Jayant Das
5 hours ago

I would like to load all components in single app, hence I can't use aura:if -- you can still use aura:if to load all components in single app. Based on what you have in your snippet in your question, you just surround other components which you want to lazy load in an aura:if and load only based on the condition.
– Jayant Das
5 hours ago

@Devendra IF you are talking about loading one component after other you will have to implement some sort of custom time based mechanaism either by aura:if or $A.createcomponent by loading them dynamically in javascript either approach would not load the dom so all the onload functionalities(such as server calls which i why your'e probably talking about governer limits) are held untill they render. One other way would be to trigger $A.createComponent on after render of each component
– codeyinthecloud
4 hours ago

@Devendra IF you are talking about loading one component after other you will have to implement some sort of custom time based mechanaism either by aura:if or $A.createcomponent by loading them dynamically in javascript either approach would not load the dom so all the onload functionalities(such as server calls which i why your'e probably talking about governer limits) are held untill they render. One other way would be to trigger $A.createComponent on after render of each component
– codeyinthecloud
4 hours ago

 | 
show 5 more comments

2 Answers
2

active

oldest

votes

up vote
3
down vote

I thing you can do to make context different is use action.setBackground() action. So action call that is making use of most of apex limit can be used as background action.

Another solution can be using aura:if or dynamically creating components using $A.createcomponent.

Least preferred solution can be using enqueueAction

https://medium.com/manj-force/did-a-enqueueaction-action-grouped-your-actions-f33ce710f0e3

share|improve this answer

answered 4 hours ago

Manjot Singh

1,828521

• 
  
  
  

  
  

  
  
  
  
  
  

  
  +1 from me nice that you made me recall about the background actions!
  – codeyinthecloud
  4 hours ago
  

  
  
  
  


• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  Background actions do not guarantee separate execution contexts, though, only that they are separate from foreground actions. But it can definitely alleviate problems.
  – sfdcfox
  4 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  Yes all the background actions can be grouped again that's why I asked that only API call that is consuming more limits should be background action.
  – Manjot Singh
  3 hours ago
  

  
  
  
  

add a comment | 

up vote
0
down vote

Just to get the flow you are looking for you have an app container loading multiple child and you wanted to load one child after the other child to make sure the server calls on each child wont throw you into risk of governor limits.

There are couple of ways you could try this. But the idea here is to delay server calls(Run them in some kind of series setup rather than parallel)

1. Use aura:if or $A.CreateComponent and implement some sort of time lag mechsnism(this would still will not guarantee proper series mechanism as its hard to caluculate the time)


2. Use the aura:if or $A.CreateComponent and fire an event from the first component success response of server call that will reach to the app and load the second component and so on until you load the subsequent components


3. Use $A.CreateComponent and fire afterRender event in the first loaded component and capture it in the parent to load the next one and so on.


4. Like @manjotsingh suggested Background Actions can be preffered too!

Note: This is theoretical

share|improve this answer

edited 4 hours ago

answered 4 hours ago

codeyinthecloud

1,628217

add a comment | 

Your Answer

StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "459"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);

else
createEditor();

);

function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
convertImagesToLinks: false,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: null,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);



);

 

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name Email

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fsalesforce.stackexchange.com%2fquestions%2f237955%2flazy-loading-for-lightning-components%23new-answer', 'question_page');

);

Post as a guest

Name Email

2 Answers
2

active

oldest

votes

2 Answers
2

active

oldest

votes

active

oldest

votes

active

oldest

votes

up vote
3
down vote

I thing you can do to make context different is use action.setBackground() action. So action call that is making use of most of apex limit can be used as background action.

Another solution can be using aura:if or dynamically creating components using $A.createcomponent.

Least preferred solution can be using enqueueAction

https://medium.com/manj-force/did-a-enqueueaction-action-grouped-your-actions-f33ce710f0e3

share|improve this answer

answered 4 hours ago

Manjot Singh

1,828521

• 
  
  
  

  
  

  
  
  
  
  
  

  
  +1 from me nice that you made me recall about the background actions!
  – codeyinthecloud
  4 hours ago
  

  
  
  
  


• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  Background actions do not guarantee separate execution contexts, though, only that they are separate from foreground actions. But it can definitely alleviate problems.
  – sfdcfox
  4 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  Yes all the background actions can be grouped again that's why I asked that only API call that is consuming more limits should be background action.
  – Manjot Singh
  3 hours ago
  

  
  
  
  

add a comment | 

up vote
3
down vote

I thing you can do to make context different is use action.setBackground() action. So action call that is making use of most of apex limit can be used as background action.

Another solution can be using aura:if or dynamically creating components using $A.createcomponent.

Least preferred solution can be using enqueueAction

https://medium.com/manj-force/did-a-enqueueaction-action-grouped-your-actions-f33ce710f0e3

share|improve this answer

answered 4 hours ago

Manjot Singh

1,828521

• 
  
  
  

  
  

  
  
  
  
  
  

  
  +1 from me nice that you made me recall about the background actions!
  – codeyinthecloud
  4 hours ago
  

  
  
  
  


• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  Background actions do not guarantee separate execution contexts, though, only that they are separate from foreground actions. But it can definitely alleviate problems.
  – sfdcfox
  4 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  Yes all the background actions can be grouped again that's why I asked that only API call that is consuming more limits should be background action.
  – Manjot Singh
  3 hours ago
  

  
  
  
  

add a comment | 

up vote
3
down vote

up vote
3
down vote

I thing you can do to make context different is use action.setBackground() action. So action call that is making use of most of apex limit can be used as background action.

Another solution can be using aura:if or dynamically creating components using $A.createcomponent.

Least preferred solution can be using enqueueAction

https://medium.com/manj-force/did-a-enqueueaction-action-grouped-your-actions-f33ce710f0e3

share|improve this answer

answered 4 hours ago

Manjot Singh

1,828521

I thing you can do to make context different is use action.setBackground() action. So action call that is making use of most of apex limit can be used as background action.

Another solution can be using aura:if or dynamically creating components using $A.createcomponent.

Least preferred solution can be using enqueueAction

https://medium.com/manj-force/did-a-enqueueaction-action-grouped-your-actions-f33ce710f0e3

share|improve this answer

answered 4 hours ago

Manjot Singh

1,828521

share|improve this answer

share|improve this answer

answered 4 hours ago

Manjot Singh

1,828521

answered 4 hours ago

Manjot Singh

1,828521

answered 4 hours ago

Manjot Singh

1,828521

1,828521

• 
  
  
  

  
  

  
  
  
  
  
  

  
  +1 from me nice that you made me recall about the background actions!
  – codeyinthecloud
  4 hours ago
  

  
  
  
  


• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  Background actions do not guarantee separate execution contexts, though, only that they are separate from foreground actions. But it can definitely alleviate problems.
  – sfdcfox
  4 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  Yes all the background actions can be grouped again that's why I asked that only API call that is consuming more limits should be background action.
  – Manjot Singh
  3 hours ago
  

  
  
  
  

add a comment | 

• 
  
  
  

  
  

  
  
  
  
  
  

  
  +1 from me nice that you made me recall about the background actions!
  – codeyinthecloud
  4 hours ago
  

  
  
  
  


• 
  
  
  

  
  1
  

  
  
  
  
  
  

  
  Background actions do not guarantee separate execution contexts, though, only that they are separate from foreground actions. But it can definitely alleviate problems.
  – sfdcfox
  4 hours ago
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  Yes all the background actions can be grouped again that's why I asked that only API call that is consuming more limits should be background action.
  – Manjot Singh
  3 hours ago
  

  
  
  
  

+1 from me nice that you made me recall about the background actions!
– codeyinthecloud
4 hours ago

+1 from me nice that you made me recall about the background actions!
– codeyinthecloud
4 hours ago

1

1

Background actions do not guarantee separate execution contexts, though, only that they are separate from foreground actions. But it can definitely alleviate problems.
– sfdcfox
4 hours ago

Background actions do not guarantee separate execution contexts, though, only that they are separate from foreground actions. But it can definitely alleviate problems.
– sfdcfox
4 hours ago

Yes all the background actions can be grouped again that's why I asked that only API call that is consuming more limits should be background action.
– Manjot Singh
3 hours ago

Yes all the background actions can be grouped again that's why I asked that only API call that is consuming more limits should be background action.
– Manjot Singh
3 hours ago

add a comment | 

up vote
0
down vote

Just to get the flow you are looking for you have an app container loading multiple child and you wanted to load one child after the other child to make sure the server calls on each child wont throw you into risk of governor limits.

There are couple of ways you could try this. But the idea here is to delay server calls(Run them in some kind of series setup rather than parallel)

1. Use aura:if or $A.CreateComponent and implement some sort of time lag mechsnism(this would still will not guarantee proper series mechanism as its hard to caluculate the time)


2. Use the aura:if or $A.CreateComponent and fire an event from the first component success response of server call that will reach to the app and load the second component and so on until you load the subsequent components


3. Use $A.CreateComponent and fire afterRender event in the first loaded component and capture it in the parent to load the next one and so on.


4. Like @manjotsingh suggested Background Actions can be preffered too!

Note: This is theoretical

share|improve this answer

edited 4 hours ago

answered 4 hours ago

codeyinthecloud

1,628217

add a comment | 

up vote
0
down vote

Just to get the flow you are looking for you have an app container loading multiple child and you wanted to load one child after the other child to make sure the server calls on each child wont throw you into risk of governor limits.

There are couple of ways you could try this. But the idea here is to delay server calls(Run them in some kind of series setup rather than parallel)

1. Use aura:if or $A.CreateComponent and implement some sort of time lag mechsnism(this would still will not guarantee proper series mechanism as its hard to caluculate the time)


2. Use the aura:if or $A.CreateComponent and fire an event from the first component success response of server call that will reach to the app and load the second component and so on until you load the subsequent components


3. Use $A.CreateComponent and fire afterRender event in the first loaded component and capture it in the parent to load the next one and so on.


4. Like @manjotsingh suggested Background Actions can be preffered too!

Note: This is theoretical

share|improve this answer

edited 4 hours ago

answered 4 hours ago

codeyinthecloud

1,628217

add a comment | 

up vote
0
down vote

up vote
0
down vote

Just to get the flow you are looking for you have an app container loading multiple child and you wanted to load one child after the other child to make sure the server calls on each child wont throw you into risk of governor limits.

There are couple of ways you could try this. But the idea here is to delay server calls(Run them in some kind of series setup rather than parallel)

1. Use aura:if or $A.CreateComponent and implement some sort of time lag mechsnism(this would still will not guarantee proper series mechanism as its hard to caluculate the time)


2. Use the aura:if or $A.CreateComponent and fire an event from the first component success response of server call that will reach to the app and load the second component and so on until you load the subsequent components


3. Use $A.CreateComponent and fire afterRender event in the first loaded component and capture it in the parent to load the next one and so on.


4. Like @manjotsingh suggested Background Actions can be preffered too!

Note: This is theoretical

share|improve this answer

edited 4 hours ago

answered 4 hours ago

codeyinthecloud

1,628217

Just to get the flow you are looking for you have an app container loading multiple child and you wanted to load one child after the other child to make sure the server calls on each child wont throw you into risk of governor limits.

There are couple of ways you could try this. But the idea here is to delay server calls(Run them in some kind of series setup rather than parallel)

1. Use aura:if or $A.CreateComponent and implement some sort of time lag mechsnism(this would still will not guarantee proper series mechanism as its hard to caluculate the time)


2. Use the aura:if or $A.CreateComponent and fire an event from the first component success response of server call that will reach to the app and load the second component and so on until you load the subsequent components


3. Use $A.CreateComponent and fire afterRender event in the first loaded component and capture it in the parent to load the next one and so on.


4. Like @manjotsingh suggested Background Actions can be preffered too!

Note: This is theoretical

share|improve this answer

edited 4 hours ago

answered 4 hours ago

codeyinthecloud

1,628217

share|improve this answer

share|improve this answer

edited 4 hours ago

edited 4 hours ago

edited 4 hours ago

answered 4 hours ago

codeyinthecloud

1,628217

answered 4 hours ago

codeyinthecloud

1,628217

answered 4 hours ago

codeyinthecloud

1,628217

1,628217

add a comment | 

add a comment | 

 

draft saved

draft discarded

 

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name Email

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fsalesforce.stackexchange.com%2fquestions%2f237955%2flazy-loading-for-lightning-components%23new-answer', 'question_page');

);

Post as a guest

Name Email

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name Email

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name Email

Sign up or log in

StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Sign up using Google

Sign up using Facebook

Sign up using Email and Password

Post as a guest

Name Email

Name Email

Name

Email

Name Email

Name

Email