Lighting Best Practices

There are multiple consideration need to be taken while developing lighting components . Before developing any lighting component design it in the better way . To explain the best  we need to understand DTO (Data Transfer Object ). It is same as class or wrapper class.
For better understanding please watch the video
 

                                                            Design Picture 


Best Tips To improve lighting Performance :
1. Signal Server call


2.  Use Lighting Data services  where ever it is possible .
3.  Use Storable action
     
  var action = component.get("c.getAll");
                action.setStorable(); 
         action.setParams({
           "boatId":boat.Id
         });
          $A.enqueueAction(action);
When an action is marked as storable, the framework automatically returns the response from the client cache (if available) so that the data is immediately available to the component for display or processing. The framework might then call the server method in the background, and if the response is different, invoke the action callback function a second time.

In recent releases Apex method will support same functionality 
@AuraEnabled(cacheable=true)
public static list<BoatReview__c> getAll(Id accountId) {
    return [SELECT Id,Name,Comment__c,Rating__c,LastModifiedDate,CreatedDate,CreatedBy.Name,CreatedBy.SmallPhotoUrl,CreatedBy.CompanyName FROM BoatReview__c WHERE Boat__c=:boatId];
}
4. Custom cache
5. lazy loading
6. Conditional rendering
7. Better design of events
8. Limit use of external java script Libraries
9. Lower size images
10. Use unbound expression if possible  

No comments:

Post a Comment