a태그와 router-link 차이(spa)

✅ router-link

• spa 구현 가능
  : 브라우저를 새로고침 하지 않고도 다른 페이지로 이동됨.
  : 주소 이동시 페이지 전체를 새로 로드하는게 아니라,
   가상돔을 통해 바뀐 부분을 확인해서 그 부분만 서버로부터 받아와 리렌더링 하게 된다.

• 사용
  : app 내부 페이지 간의 전환을 관리하는데 사용하는게 좋음

• 구현 예제
  : 처음 렌더시에 html,css,js파일을 다 다운한 뒤 '/list' 페이지로 바뀌었을 땐 다른 부분만 새로 받아와 렌더해준다.

 

✅ a 태그

• spa 구현 불가
  : 주소가 이동되면 페이지 전체를 다시 불러와서 처음부터 다시 렌더링 해야한다.
  
• 사용
  : 외부 URL로 이동시 사용하는게 좋음 
• 구현 예제
  : 처음 렌더시에 html,css,js파일을 다 다운, '/test' 페이지로 바뀌었을 때도 아예 새로 html,css,js 전체를 로드한다.