Javascript 每个会话播放一次动画

我目前正在与gsap一起制作动画。我正在我的页面上实现它，但我只希望它在每个会话中播放一次。我计划使用cookie或会话存储，但还没有在动画之类的东西上使用它们。我也搜索过网络，没有发现任何相关信息。如何在javascript中实现这一点

let clicker=document.getElementById（'clicker'）；
var ballMotion=gsap.timeline（）；
棒球运动
.from（“.logo”，{持续时间：3，底部：'-170vh'，ease:“power2.inOut”}，）
.from（“.ball”，{duration:3，bottom:'-167vh'，ease:“power2.inOut”，onComplete:function（）{
clicker.addEventListener（“单击”，resumeTL）；
}}, "-=3")
.to（'.flex按钮'，{opacity:1}，）
.to（'.form wrapper'，{opacity:1}，）
.addPause（）
.to（'.flex按钮'，{持续时间：0.1，不透明度：0，zIndex:-100}，）
.to（'.form wrapper'，{duration:0.1，不透明性：0，zIndex:-99}，）
.to（“.ball”，{duration:1，borderRadius:'50%”，transform:'scale（100）”，ease:'circ.inOut'，onComplete:function（）{
让loadWrapper=document.querySelector（'.loadWrapper'）；
loadWrapper.classList.add（'load-wrapper-finished'）；
}}, "+=0",);
函数resumeTL（）{
clicker.removeEventListener（“单击”，resumeTL）；
$（“.logo”）.explode（{“minWidth”：3，“maxWidth”：10，“radius”：700，“minRadius”：10，“release”：true，“fadeTime”：10，“recycle”：false，“RecycledLay”：500，“explodeTime”：1000，“round”：false，“minAngle”：0，“maxAngle”：360，“gravity”：2，“groundDistance”：1500}）；
ballMotion.resume（）；
}

人们会建议为保存动画和动画的div设置一个存储会话吗？