ย้ายข้อมูลไปยังสคริปต์พื้นหลังที่ขับเคลื่อนด้วยเหตุการณ์

การใช้สคริปต์พื้นหลังที่ไม่คงอยู่จะช่วยลดต้นทุนทรัพยากรของส่วนขยายลงอย่างมาก ฟังก์ชันการทำงานส่วนใหญ่ของส่วนขยายสามารถรองรับได้ด้วยสคริปต์พื้นหลังที่อิงตามเหตุการณ์ ส่วนขยายควรมีพื้นหลังที่คงอยู่เฉพาะในสถานการณ์ที่พบได้น้อยเท่านั้น เนื่องจากส่วนขยายดังกล่าวจะใช้ทรัพยากรของระบบอย่างต่อเนื่องและอาจทำให้เกิดภาระกับอุปกรณ์ที่มีกำลังไฟต่ำ

ปรับปรุงประสิทธิภาพของส่วนขยายโดยการย้ายข้อมูลสคริปต์พื้นหลังที่คงอยู่ไปยังโมเดลที่ไม่คงอยู่ที่อิงตามเหตุการณ์ ระบบจะตั้งค่า "persistent" เป็น "จริง" โดยค่าเริ่มต้น

กำหนดให้การคงอยู่เป็น "เท็จ"

ค้นหาคีย์ "background" ในไฟล์ Manifest ของส่วนขยาย แล้วเพิ่มหรืออัปเดตฟิลด์ "persistent" เป็น "เท็จ"

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

หลักการเดียวกันนี้ใช้กับสคริปต์พื้นหลังที่ต้องอาศัยไฟล์ HTML

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

Listener เหตุการณ์ระดับบนสุด

Listener ต้องอยู่ที่ระดับบนสุดเพื่อเปิดใช้งานสคริปต์พื้นหลังหากมีการทริกเกอร์เหตุการณ์สำคัญ คุณอาจต้องปรับโครงสร้าง Listener ที่ลงทะเบียนไว้ให้เป็นรูปแบบซิงโครนัส การจัดโครงสร้าง Listener ดังที่แสดงด้านล่างจะไม่อนุญาตให้เรียกใช้ Listener เนื่องจากไม่ได้ลงทะเบียนแบบซิงโครนัส

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

แต่ให้เก็บ 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
});

เปลี่ยนตัวจับเวลาเป็นนาฬิกาปลุก

ระบบจะไม่สนใจตัวจับเวลาที่อิงตาม DOM เช่น window.setTimeout() หรือ window.setInterval() ในสคริปต์พื้นหลังที่ไม่คงอยู่หากตัวจับเวลาดังกล่าวทริกเกอร์เมื่อหน้าเหตุการณ์ไม่ได้ใช้งาน

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

แต่ให้ใช้ Alarms API แทน

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

จากนั้นเพิ่ม Listener

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();
});

วิธีการนี้จะใช้ไม่ได้หากสคริปต์พื้นหลังไม่ได้ใช้งาน ซึ่งเป็นสถานะเริ่มต้นสำหรับสคริปต์ที่ไม่คงอยู่ วิธีการใหม่มีฟังก์ชัน Callback เพื่อให้แน่ใจว่าสคริปต์พื้นหลังโหลดแล้ว

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