이벤트 기반 백그라운드 스크립트로 이전

비영구 백그라운드 스크립트를 구현하면 확장 프로그램의 리소스 비용이 크게 줄어듭니다. 대부분의 확장 프로그램 기능은 이벤트 기반 백그라운드 스크립트에서 지원될 수 있습니다. 확장 프로그램은 지속적으로 시스템 리소스를 사용하고 저전력 기기에 부담을 줄 수 있으므로 드문 경우에만 백그라운드가 유지되어야 합니다.

영구 백그라운드 스크립트를 이벤트 기반 비영구 모델로 이전하여 확장 프로그램의 성능을 개선합니다. 기본적으로 "persistent"는 true로 설정됩니다.

지속성을 false로 지정

확장 프로그램 manifest 파일에서 "background" 키를 찾은 다음 "persistent" 필드를 false로 추가하거나 업데이트합니다.

{
  "name": "My extension",
  ...
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  ...
}

HTML 파일을 사용하는 백그라운드 스크립트에도 동일하게 적용됩니다.

{
  "name": "My extension",
  ...
  "background": {
    "page": "background.html",
    "persistent": false
  },
  ...
}

노출 이벤트 리스너

중요한 이벤트가 트리거될 때 백그라운드 스크립트를 활성화하려면 리스너가 최상위 수준에 있어야 합니다. 등록된 리스너를 동기 패턴으로 재구성해야 할 수 있습니다. 아래와 같이 리스너를 구성하면 동기식으로 등록되지 않으므로 호출할 수 없습니다.

chrome.storage.local.get('runtimeEvents', function (events) {
  for (let event of events)
    chrome.runtime[event].addListener(listener);
});

대신 리스너를 최상위 수준에서 중첩되지 않도록 유지합니다.

chrome.runtime.onStartup.addListener(function() {
  // run startup function
})

저장소의 상태 변경 기록

storage API를 사용하여 상태와 값을 설정하고 반환합니다. local.set를 사용하여 로컬 머신에서 업데이트합니다.

  chrome.storage.local.set({ variable: variableInformation });

local.get를 사용하여 해당 변수의 값을 가져옵니다.

chrome.storage.local.get(['variable'], function(result) {
  let awesomeVariable = result.variable;
  // Do something with awesomeVariable
});

타이머를 알람으로 변환

window.setTimeout() 또는 window.setInterval()와 같은 DOM 기반 타이머는 이벤트 페이지가 비활성 상태일 때 트리거되는 경우 지속적이지 않은 백그라운드 스크립트에서 적용되지 않습니다.

let timeout = 1000 * 60 * 3;  // 3 minutes in milliseconds
window.setTimeout(function() {
  alert('Hello, world!');
}, timeout);

대신 alarms API를 사용하세요.

chrome.alarms.create({delayInMinutes: 3.0})

그런 다음 리스너를 추가합니다.

chrome.alarms.onAlarm.addListener(function() {
  alert("Hello, world!")
});

백그라운드 스크립트 함수 호출 업데이트

extension.getBackgroundPage를 사용하여 백그라운드 페이지에서 함수를 호출하는 경우 runtime.getBackgroundPage로 업데이트합니다. 새로운 메서드는 비영구 스크립트를 반환하기 전에 활성화합니다.

function backgroundFunction() {
  alert('Background, reporting for duty!')
}

document.getElementById('target').addEventListener('click', function(){
  chrome.extension.getBackgroundPage().backgroundFunction();
});

이 메서드는 백그라운드 스크립트가 비활성 상태인 경우 작동하지 않습니다. 비활성 상태는 영구 스크립트가 아닌 스크립트의 기본 상태입니다. 최신 메서드에는 백그라운드 스크립트가 로드되었는지 확인하는 콜백 함수가 포함되어 있습니다.

document.getElementById('target').addEventListener('click', function() {
  chrome.runtime.getBackgroundPage(function(backgroundPage){
    backgroundPage.backgroundFunction()
  })
});