Visibility of elements not on stage: Does it impact performance (much)?

Hey everyone,

so I’m just wondering about something. Let’s say you have a lot of elements on your stage, which show up at some point in the timeline and then disappear again ( = moving out of bounds ). The visibility of every element can be changed with keyframes.

My question: Does it increase performance when keyframing every element that is outside of the stage to ‘hidden’?

If you are talking about regular rectangles and a couple images, it may be measurable in microseconds, but I don’t think there will be a perceptible difference. With many more images, you will likely notice a larger difference on slower devices. The rule of thumb here is don’t load stuff you won’t use – having elements off scene is a smart way to speed up their appearance (as opposed to the slower method of using an instant scene transition, where all those elements need to be instantiated).

When you set visibility to ‘hidden’, the elements are still in the DOM, just not shown. This will make the act of making them visible less resource-intensive.

I have seen some issues with a large number of visible elements off the scene slowing down scene transitions (push left / right, etc). This is likely because all elements (even off scene) need to be moved.

1 Like