How to call the component Models asynchronously

[kbitra1998]

Hello, in the component, I'm having trouble with Models calls. This page is taking an extremely long time to render.
I've made a page with five components, let's call them C1,C2,C3,C4,C5, and we've used C2 four times and C4 ten times.
The page's components are arranged in the following order: C1,C2,C2,C2,C2,C3,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,C4,
I've set a timer in the logs. I have observed page is rendering order of the components.
C1-300ms, C2-400ms, C2-400ms, C2-300ms, C2-300ms, C3-400ms, C4-400ms, C4-400ms, C4-400ms, C4-400ms, C4-400ms, C4-400ms, C4-400ms, C4-400ms, C4-400ms, C4-400ms, C4-400 C4-400ms C4-400ms C4-400ms C4-400ms C4-400ms Finally, C4-400ms and C5-100ms are used.
As a result, it will take at least 10-15 seconds for the page to render.
How to call C1,C2,C3,C4,C5 components at the same time, rather than in the order they appear on the page?

[SantoshSai]

Hi @kbitra1998 

you may take a look at Sling Model Caching. This does exactly what you want, as long as it is adaptable from Resource.

https://sling.apache.org/documentation/bundles/models.html#caching

You only have to specify cache=true in the Model-annotation.

@Model(adaptable = SlingHttpServletRequest.class, cache = true)
public class ModelClass {
   ...
}

Hope that helps!

Regards,
Santosh

[RajaShankar]

Hi @SantoshSai 

It was a good pointer for caching the Adapted resource for all instance. But i have a doubt in this as mentioned by @kbitra1998  they are trying to use same component in multiple instance within same page exampleC1,C2,C2,C2 .If i cache the Sling model will it not return same attributes/values as that of first instance of C2 even for second and third case. LEt say if C2 first instance as a text value "This is text component1" in this case second and third instance also will get same value right."assert object1 == object2;"

Please clarify.

Regards,

Rajashankar.R

[SantoshSai]

@RajaShankar 
No, Have a loot at below use case and result.

@Model(adaptables = Resource.class, cache = true)
public class HelloWorldModel {
private String message;
..............
}

[kbitra1998]

@SantoshSai , @RajaShankar 

For all C2 components on the page, I'm getting the same value. @RajaShankar I believe you are correct, however @SantoshSai  How did you come up with the various values for the same component?

Could you please assist me in this issue?

If possible, a sample of the model's code would be very appreciated.

[SantoshSai]

@kbitra1998 

package com.demo.core.models;

import com.day.cq.wcm.api.Page;
import com.day.cq.wcm.api.PageManager;
import org.apache.sling.api.resource.Resource;
import org.apache.sling.api.resource.ResourceResolver;
import org.apache.sling.models.annotations.Default;
import org.apache.sling.models.annotations.Model;
import org.apache.sling.models.annotations.injectorspecific.InjectionStrategy;
import org.apache.sling.models.annotations.injectorspecific.OSGiService;
import org.apache.sling.models.annotations.injectorspecific.SlingObject;
import org.apache.sling.models.annotations.injectorspecific.ValueMapValue;
import org.apache.sling.settings.SlingSettingsService;

import javax.annotation.PostConstruct;
import java.util.Optional;

import static org.apache.sling.api.resource.ResourceResolver.PROPERTY_RESOURCE_TYPE;

@Model(adaptables = Resource.class, cache = true)
public class HelloWorldModel {

    @ValueMapValue(name=PROPERTY_RESOURCE_TYPE, injectionStrategy=InjectionStrategy.OPTIONAL)
    @Default(values="No resourceType")
    protected String resourceType;

    @OSGiService
    private SlingSettingsService settings;
    @SlingObject
    private Resource currentResource;
    @SlingObject
    private ResourceResolver resourceResolver;

    private String message;

    @PostConstruct
    protected void init() {
        PageManager pageManager = resourceResolver.adaptTo(PageManager.class);
        String currentPagePath = Optional.ofNullable(pageManager)
                .map(pm -> pm.getContainingPage(currentResource))
                .map(Page::getPath).orElse("");

        message = "Hello World!\n"
            + "Resource type is: " + resourceType + "\n"
            + "Current page is:  " + currentPagePath + "\n"
            + "This is instance: " + settings.getSlingId() + "\n";
    }

    public String getMessage() {
        return message;
    }
}

I have copied HelloWorld Component(helloworldb) and used it on page as below 

[kbitra1998]

@SantoshSai sorry for the delay.

Thank you for providing the code. We are calling third-party services via Models and Servlets, as well as AEM rendering.

To cache the Model's and Servlet's third-party responses, we are using the Ehcache technique.

[arunpatidar]

Do you mean memory cache like HTTP cache or Guava cache? If yes then make sure you have correct TTL and a way to clear cache.

[kbitra1998]

Thanks, Based on the requirements, we are experimenting with different TTL and when to clear the cache.

[arunpatidar]

Hi,

If your page are cached at dispatcher than this issue will not occurs.

I believe you are caching this page.

but if you just want to show as per type than simple javascript can do a job.