[Vuejs]-Optimize translate animation on element with multiple child nodes

For Each node added the transition gets laggy, i do not understand why translating the parent node is affected by the number of child nodes in it.

Why wouldn’t it affect the performance? You’re rendering 10,000 elements! That’s a lot of work for the browser to do.

The best improvement of performance is if you reduce the number of rects. Why do you need so many anyway? What’s the goal? You only need a couple of more rects than can show on the page. Calculate what that number should be and only use that many ticks. Or better yet, use a repeating background image so you only need one element.