확장 프로그램 메시지 포트를 사용하는 BFCache 동작 변경사항

뒤로-앞으로 캐시 (BFCache)는 즉시 뒤로/앞으로 탐색을 사용할 수 있도록 하는 브라우저 최적화 기능입니다. 메시지 포트를 사용하는 확장 프로그램에 영향을 미칠 수 있는 Chrome BFCache가 변경됩니다. 메시지를 사용하여 콘텐츠 스크립트와 확장 프로그램 간에 통신하는 Chrome 확장 프로그램을 소유하고 있는 경우 확장 프로그램을 테스트하고 조정하는 방법을 자세히 알아보세요.

확장 프로그램 메시지 포트

확장 프로그램은 메시지 전달을 통해 콘텐츠 스크립트 또는 다른 확장 프로그램과 통신합니다. runtime.sendMessage()tabs.sendMessage()를 호출하거나 재사용 가능한 메시지 포트를 사용하여 일회성 요청을 사용하여 메시지를 보낼 수 있습니다. 포트가 활성 상태인 동안에는 콘텐츠 스크립트와 확장 프로그램 백그라운드 스크립트 모두 포트를 재사용하여 서로 메시지를 게시할 수 있습니다.

자세한 내용은 메시지 전달을 참고하세요.

뒤로-앞으로 캐시

BFCache를 사용할 수 있는 페이지에서 벗어날 때 브라우저에서는 모든 상태의 페이지가 메모리에 남아 있지만 완전히 활성 상태가 아닌 상태로 유지되도록 허용합니다. 사용자가 캐시된 페이지로의 기록 탐색 (뒤로 또는 앞으로)을 실행하면 브라우저는 BFCache에서 페이지를 복원하려고 시도합니다. 이렇게 하면 탐색 속도가 빨라지고 사용자의 탐색 환경이 개선됩니다.

페이지가 BFCache에 있는 동안에는 JavaScript 실행이 허용되지 않는 정지된 상태입니다. 즉, 수신한 메시지를 처리할 수 없습니다.

자세한 내용은 뒤로-앞으로 캐시를 참고하세요.

확장 프로그램 메시지 포트가 BFCache에 미치는 영향

간단히 말해 확장 프로그램에서 BFCache의 페이지로 메시지를 보내면 캐시 제거가 발생하고 성능에 영향을 미칠 수 있습니다.

확장 프로그램 메시지 포트가 열려 있는 페이지가 BFCache에 저장된 경우 포트는 열린 상태로 유지됩니다. 페이지가 BFCache에서 복원되면 확장 프로그램 서비스 워커가 메시지 포트의 이전 참조를 사용하여 콘텐츠 스크립트에 메시지를 게시할 수 있습니다.

그러나 페이지가 아직 BFCache에 있는 동안 확장 프로그램이 메시지 포트를 통해 메시지를 게시하려고 하면 메시지가 전송되지만 핸들러가 고정되어 완전히 전달되지는 않습니다. 메시지를 대기열에 추가하거나 삭제하는 것 모두 고유한 문제가 있기 때문에 확장 프로그램이 이 상황에 대해 추론하고 해결하기는 어렵습니다.

메시지 손실과 관련된 문제가 발생하지 않도록 Chrome의 현재 구현에서는 BFCache에서 호스트 페이지를 삭제하고 메시지를 삭제합니다. 사용자가 페이지로 돌아가면 새로 로드되어 확장 프로그램이 새 연결을 설정할 수 있습니다.

반면 이 구현은 BFCache가 적용되는 시나리오를 제한하여 특히 모든 연결에 정기적으로 메시지를 보내는 브로드캐스트 또는 하트비트 메커니즘이 포함된 확장 프로그램의 성능 향상을 제한합니다. 또한 확장 프로그램이 콘텐츠 스크립트에 메시지를 보낼 때 제거가 트리거되므로 웹 개발자는 페이지가 제거되는 것을 방지할 방법이 없습니다.

전반적인 성능을 개선하기 위해 새로운 메시지 포트 동작을 도입할 계획입니다.

새로운 동작: 페이지가 BFCache에 저장될 때 메시지 채널 닫기

Chrome 123부터 확장 프로그램 메시지 포트가 열려 있는 페이지가 BFCache에 저장되면 기본 메시지 채널이 콘텐츠 스크립트 측에서 사전에 닫힙니다. 따라서 모든 메시지 포트가 닫히고 확장 프로그램이 onDisconnect 이벤트를 수신합니다.

채널이 폐쇄되었으므로 BFCache에 있는 동안에는 메시지가 페이지로 전송되지 않습니다. 따라서 확장 프로그램으로 인해 페이지가 삭제되지는 않습니다.

BFCache에서 페이지가 복원된 후에도 닫힌 메시지 채널은 다시 열리지 않습니다. 확장 프로그램 작성자는 다음 예와 같이 페이지 수명 주기 이벤트를 수신 대기하고 BFCache에서 페이지가 복원될 때 새 연결을 설정하는 것이 좋습니다.

// content script

let port;

window.addEventListener('pageshow', (event) => {
  if (event.persisted) {
    // The page is restored from BFCache, set up a new connection.
    port = chrome.runtime.connect();
  }
});

여러 브라우저 담당자가 전한 WECG 대화에 관해 자세히 알아보세요 (문제 474).

영향을 받는지 여부는 어떻게 확인하나요?

새로운 동작은 Chrome 123에서 플래그 뒤에 제공되므로 코드를 테스트할 수 있습니다. 자세한 내용은 일정을 참고하세요. 확장 프로그램을 테스트하려면 다음 단계를 따르세요. 확장 프로그램의 어떤 기능이 문제를 일으킬지 예측하기 어려울 수 있으므로 일정 기간 동안 Chrome을 사용 설정한 상태로 Chrome을 실행하는 것이 좋습니다.

  1. Chrome 버전이 123 이상인지 확인합니다. 더 쉽게 테스트할 수 있도록 추가 경고가 있는 Chrome Canary를 사용하는 것이 좋습니다.
  2. 다음 플래그로 Chrome을 실행합니다.

    --disable-features=DisconnectExtensionMessagePortWhenPageEntersBFCache
    
  3. 확장 프로그램을 실행하지 않고 BFCache를 사용할 수 있는 페이지 (예: https://example.com/과 같은 간단한 사이트)로 이동합니다. BFCache 튜토리얼에 따라 BFCache에서 복원되었는지 확인하세요.

  4. 확장 프로그램을 설치 및 사용 설정한 다음 BFCache 자격요건을 다시 테스트합니다. 수동으로 이동하여 확장 프로그램에서 BFCached 페이지에 메시지를 게시할 때까지 기다렸다가 다시 돌아갈 수 있습니다.

  5. 제거로 인해 BFCache가 아닌 페이지를 새로 로드해야 했고 복원을 방해하는 문제가 'ExtensionSentMessageToCachedFrame'인 경우 확장 프로그램이 이 변경사항의 영향을 받을 수 있습니다.

    Chrome Canary 124.0.6315.0 이상에서는 페이지에 다음과 같은 경고도 표시됩니다.

    페이지가 BFCache에서 복원되지 않으면 경고가 표시됩니다.
    페이지가 BFCache에서 복원되지 않으면 표시되는 경고

확장 프로그램이 BFCache 페이지에 메시지를 게시하는 것이 확인되면 다음 단계에 따라 실험을 강제로 사용 설정하고 로직이 중단되는지 관찰할 수 있습니다.

  1. 다음 플래그로 Chrome을 실행합니다.

    --enable-features=DisconnectExtensionMessagePortWhenPageEntersBFCache
    
  2. 'ExtensionSentMessageToCachedFrame'으로 인해 BFCache에서 복원되지 않은 페이지로 이동합니다.

  3. 페이지에서 나갔다가 돌아오기 이제 페이지가 복원되지만 콘텐츠 스크립트와 서비스 워커 간의 메시지 채널 연결이 해제됩니다.

  4. 확장 프로그램이 여전히 평소와 같이 작동하는지 테스트합니다. 그렇지 않은 경우 이전 섹션에 설명된 대로 수동으로 다시 연결해야 합니다.

출시 일정

Chrome 123부터 새로운 동작을 점진적으로 확대할 계획입니다. 세부 계획은 다음과 같습니다.

날짜 계획된 주요 기록
2월 15일 Chrome Canary 및 Dev에서 새로운 동작에 관한 실험을 시작합니다.
3월 1일 Chrome 베타에서 새 동작에 대한 실험을 시작합니다.
3월 18일 Chrome 안정화 버전에서 사용자의 4%에게 새로운 동작을 제공합니다.
3월 25일 Chrome 안정화 버전에서 사용자의 50%에게 새로운 동작을 적용합니다.
4월 2일 실험이 종료되고 새 동작이 기본값으로 설정됩니다.