Speeding up Teaser Component

[knicksak2]

I am currently in the process of implementing a rotating banner on the homepage for the site I am working on. I do this by using the teaser component which has 4 segments that it can choose from to display the banner at random, which will eventually be changed to targeting. The only problem is it takes around a second to load after the page has loaded and that is a long time to be without a Hero Image. I was wondering if there was anyway to speed up how the teaser works either by caching or something else. If there isn't then i was wondering if there was a better way to do this. Thank you very much.

[Peter_Puzanovs · Accepted solution]

Rewrite teaser component for this particular scenario it should be fairly simple.

[knicksak2]

I am not sure how to go about doing what you suggest.  Could provide a bit more details or a link to assist?

[Peter_Puzanovs]

Get default experience as <noscript> content via sling:include(to dispay when no JS available or target type can't be detected). Load content via AJAX when you detect your target type. Store loaded content from AJAX on local storage.

As a starting point look at:

local:4503/crx/de/index.jsp#/crx.default/jcr%3aroot/libs/cq/personalization/components/campaignpage/teaser.jsp