block by dribnet 5027818

strokes - General Update Pattern, II

Full Screen

strokes fork and port of mike’s general update pattern tutorial, II.

merge requests should go to the example in the repo


By adding a key to the data-join, letters that are already displayed are put in the update selection. Now updates can occur anywhere in the array, depending on the overlap between the old letters and the new letters. The text content only needs updating on enter because the mapping from letter to element never changes; however, the x-position of the text element must now be recomputed on update as well as enter.

It’ll be easier to see what’s going on when we add animated transitions next!

Next: Update Transitions

Previous: General Update Pattern

index.html

gup2.cljs