Q: Why does my mobile phone get slow when using the original CSS3 effect in BGS?

A: Animation performance of the original CSS3 depends heavily on the device you are using.

The overall performance of the original CSS3 effect depends on serveral factors:

  • Number of images used
  • Resolution and filesize of images used
  • Type of the device used for browsing
  • The browser used

Generally speaking, the more images you are using in the original CSS3 effect, and the higher resolution and filesize the single images have, the more computing power is needed to display the animation smoothly.
Overall performance also heavily depends on the browser used.

During our tests with different device types and different browsers, we found out that best results can be achieved with desktop computers using hardware accelerated browsers, such as Chrome.

Mobile devices (especially apple devices) cannot offer the same computing power as a desktop computer.
This is why these devices can get overwhelmed by the original CSS3 effect (depends on number and size of images).

As a conclusion, we recommend using one of the JavaScript based effects if your site visitors mainly use mobile devices.