0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

next/linkの<Link>が原因で無駄なレンダリングが発生していた。

Posted at

(注)ただの備忘録で何も解決してません。

Markdown記法とタイピングに慣れるためとりあえず最後まで書き切って投稿しただけなので、なんら技術的解決もしてません。

<Link>の使用でレンダリングが2回起きていた

<Link>コンポーネントを使ってルートパスへの遷移を実装していたページのconsole.log()が、リロードの度に2回呼び出されていた。解決に時間がかかったのでメモしておく。(たぶんもう一回くらいこのミスしちゃいそう)

1,<Link>の仕様

<a>タグの遷移を高速にしてくれると聞いて脳死で乱用してたが、なぜ高速なのか

遷移先のprefetch

よって今回のケースでは、ルートパスをprefetchしていた。

そして、ルートパスでも<Link>で当該ページ(/signin)への遷移を実装していた笑

そして、認可機能により、userSessionを持たない場合は/signinへの遷移を行っていた。

結果...

/signinのリロード → log出力 →  ルートprefetch(Linkによる)  → <Link href{"/signin"}>をprefetch → log出力(2回目)

なのかなと推理。 あちこち触って/signinの<Link>→<a>にするとレンダリングが1回になったからたぶんこれ...?

いや...。
書きながら思ったけど、prefetch先のLinkをprefetchしてるなら、無限ループで今PCは息してないはずなので多分この推理は間違えてる...笑

じゃあやっぱりsession管理やったりSeverActionsあたりの記述がミスってるんやろうか..?

眠気が限界なので、今日の備忘録としてこの怪文を。

始めてauth触ったことでわかってなかったとはいえ、初めにcontext作っとけばよかった。いい勉強になりそうね泣

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?