### Principles of working with timelines 1. Fewer timelines are easier 2. Shorter timelines are easier 3. Sharing fewer resources is easier 4. Coordinate when resources are shared 5. Manipulate time as a first-class concept ### Both timelines share the DOM, so there are potential problems ![](https://i.imgur.com/fV2JEDQ.png) #### If the order is incorrect ![](https://i.imgur.com/ipd0VBN.png) #### The goal we want to achieve is... * Ensure that the DOM updates happen in the same order as the clicks come in #### The method we are using is... * Queues #### Why Queues can help us solve problems? * A queue is a data structure where items are removed in the same order they are added. ![](https://i.imgur.com/dsP6E13.png) #### Prevent a second timeline from running at the same time as the first ![](https://i.imgur.com/LgWN5ii.png) ![](https://i.imgur.com/90b0QDw.png) #### Making the queue skip ![](https://i.imgur.com/Y4sk5Vi.png) ![](https://i.imgur.com/VZck0HB.png)