VueCLI 初回アクセス時ページ遷移をすると要素の位置がズレる

Question

VueCLIとVuetifyを使ってWEBサイトを構築しています。
表現として随所にアニメーションをGSAPのスクロールトリガーを使って設定しています。

しかし、何故か初回アクセスをしてページ遷移を行うと見た目ではズレていないのですが、
DOMの位置がズレてしまっています。
下記コードとスクロールトリガーでのmarkerで、ズレていることは確認できました。

    const dom1 = document.querySelector('#hoge');
    const a = dom1.getBoundingClientRect().top + window.pageYOffset;
    console.log(a)

1度アクセスをして他のページに飛び、また戻ってくるとズレずに正常の位置に戻ってきています。
また、1pxでもリサイズをした時も要素が正常の位置に戻ります。

もし何か原因が思いつく方がいましたらご教示していただけると幸いです。

よろしくお願いいたします。

GSAP部分の記述

  methods: {
    Hoge() {
      gsap.fromTo('.js-f-fade' , 0.5 ,{opacity:0 ,y : 20,},{opacity:1, y : 0,scrollTrigger: {trigger: '.js-f-fade',start: 'center 70%' ,markers:true}});
    }
  },
  mounted() {
    gsap.registerPlugin(ScrollTrigger);
    this.$nextTick(function () {
      this.Hoge();
    });
  }