Overview

You noticed that there is a flickering effect in the Carousel images transition on your Progressive Web App (PWA) on an iOS device. This article explains why this happens and how you can solve it by using different effects and minimizing the size of the images.

Diagnosis

You noticed that there is no smooth transition from one Carousel image to another and there's a flickering effect. There appears to be a noticeable "white flash" during image transitions.

The root cause has been identified as a bug in a 3rd party plugin (cloudSlider) that the platform uses for the transitions. 

Note: Native apps and PWA on Android work as expected.

Back to the top

Solution

This library has been deprecated and as such there is no way for the bug to be fixed. Therefore the BiznessApps Engineering team is working on a replacement component. There's no specific estimation as of yet for when this will be released. Check the Release Updates to get informed about the new BiznessApps release.

Till this new component is released, you can try the following workarounds:

1. Reduce the Carousel images size. There are various image optimizers and convertors tools (Eg  Adobe Photoshop) and you can easily get your images much smaller in size without compromising the quality. Images of around 100KB can have a good quality. 

2. Try to select a different image transition option in the Create -> Design -> Carousel Images. Depending on the images you use,  you can try some other option that may yield a smoother transition. You can find more information in the Setting up Homescreen Background and Carousel Images KB article.

Back to the top

Testing

The transition from one Carousel image to another will be much smoother and there will be no flickering effect. 

Back to the top

Related Articles

• Setting up Homescreen Background and Carousel Images