페이지를 이동해도 라이브 방송 재생이 이어지는 PIP 구현

다이렉트 서비스에서 라이브 방송을 보면서 다른 페이지도 둘러볼 수 있도록 PIP가 필요했습니다. 재생 요소를 페이지 화면 안에 두면, 사용자가 다른 페이지로 이동할 때 그 요소가 사라지면서 재생도 멈춥니다.

PIP는 페이지 안의 재생 요소를 직접 다루는 방식으로 만들었습니다. 라우트가 바뀌어도 재생 요소가 사라지지 않는 위치에 두는 것이 핵심이었습니다.

재생 요소를 레이아웃 최상위에 렌더링해, 라우트가 바뀌어도 해당 요소가 남아 있게 했습니다.

사용자는 라이브 방송을 작은 화면으로 띄워 둔 채 다른 페이지를 둘러볼 수 있고, 페이지를 옮겨도 재생이 이어집니다.