목차
Turbolinks란?
Turbolinks는 웹 애플리케이션의 성능을 향상시키기 위해 사용되는 자바스크립트 라이브러리입니다. 기본적으로 Turbolinks는 전체 페이지 새로고침을 피하고, 페이지 간의 전환이 자바스크립트로 처리되도록 돕습니다. 이를 통해 사용자 경험을 향상시키고, 서버의 부하를 줄일 수 있습니다.
Turbolinks의 작동 원리
Turbolinks는 페이지 간 이동 시에 전체 HTML 코드를 다시 다운로드하는 대신에, 서버로부터 변경된 페이지의 일부분만을 받아옵니다. 이를 통해 페이지 간 전환 속도를 크게 향상시킬 수 있습니다. Turbolinks는 브라우저의 history.pushState API를 이용하여 페이지 이동을 처리하며, 페이지의 콘텐츠만 변경하는 방식으로 동작합니다.
Turbolinks의 내부 메커니즘
Turbolinks는 일련의 내부 메커니즘을 통해 동작합니다. 첫 번째로, 클릭 또는 이동한 링크를 감지하여 해당 페이지의 URL을 가져옵니다. 두 번째로, 서버로 해당 URL에 대한 XMLHttpRequest 요청을 보내고, 변경된 페이지의 일부분을 받아옵니다. 세 번째로, 받아온 내용을 현재 페이지에 적용하고, 스크롤 위치 및 상태를 변경합니다. 이렇게 변화된 페이지의 일부분만 동적으로 업데이트되므로 전체 페이지 재로딩을 피할 수 있습니다.
장단점
Turbolinks를 사용하면 사용자들이 웹 애플리케이션을 보다 빠르게 탐색할 수 있으며, 서버 부하를 줄일 수 있는 장점이 있습니다. 그러나 SPA(Single Page Application)와 달리 Turbolinks는 페이지의 로딩 시간이나 초기 로드 속도는 향상되지 않을 수 있습니다.
참고 자료
#tech #javascript