router.push와 Link

router.push, Link, a태그에 대해 좀 더 명확히 구분하고자 간단하게 정리해놓는다.

router.push와 Link 모두 페이지를 이동시키는 동작은 동일하다.

하지만, router.push의 경우 seo에 포함되지 않기 때문에 크롤러가 페이지 이동을 감지할 수 없다. 주로 사용하는 곳은 이벤트 핸들러에서 어떠한 동작을 한 후에 페이지를 이동시켜야 하는 경우에 사용한다. 기본적으로 다른 페이지로 가기 위해서 사용하지 마라.

Link는 a태그가 가지고 있는 페이지를 리로드하는 것을 막으면서 페이지를 이동시켜 준다. 크롤러는 Link태그를 다른 페이지로 이동시키는 태그로 보기 때문에 seo에 좋다.

a태그 또한 seo에 좋은 것은 맞다. 하지만, 브라우저 리로드를 일으킨다. 만약 기존 상태를 가지고 있는 상태에서 페이지 이동을 해야 하는 경우 상태를 보존하지 못할 수 있다. 그리고 사용자 경험 또한 좋지 않다. SPA의 장점을 잃어버리면서 화면이 깜빡인다.