perf: prevent background from being mounted when not in use

This commit is contained in:
SethBurkart123
2024-02-09 18:22:58 +11:00
parent 410b817cca
commit 871cef91cb
9 changed files with 53 additions and 10 deletions
+7 -1
View File
@@ -1,7 +1,13 @@
import backgroundPage from 'url:./background/background.html'
import browser from 'webextension-polyfill';
import { SettingsState } from '../../types/storage';
export async function appendBackgroundToUI() {
console.log('Starting appendBackgroundToUI...');
const settings = await browser.storage.local.get() as SettingsState;
console.log(settings.theme);
if (settings.theme == '') return;
const parent = document.getElementById('container');
+2 -2
View File
@@ -23,7 +23,7 @@
<body>
<!-- Container for the media -->
<div id="media-container"></div>
<script src="background.ts"></script>
<script src="./background.ts"></script>
</body>
</html>
+4 -4
View File
@@ -19,7 +19,7 @@ const openDB = (): Promise<IDBDatabase> => {
request.onsuccess = () => resolve(request.result);
request.onupgradeneeded = (event: IDBVersionChangeEvent) => {
// @ts-expect-error
// @ts-expect-error - The event type is not recognized by TypeScript
event?.target?.result.createObjectStore('backgrounds', { keyPath: 'id' });
};
});
@@ -27,7 +27,9 @@ const openDB = (): Promise<IDBDatabase> => {
const readData = async (): Promise<Data | null> => {
const selectedBackground = localStorage.getItem('selectedBackground');
if (!selectedBackground) {
//const selectedBackground = localStorage.getItem('selectedBackground');
if (!selectedBackground || selectedBackground === '') {
return null;
}
@@ -46,8 +48,6 @@ const updateBackground = async (): Promise<void> => {
try {
const data = await readData();
if (!data) {
console.log('No data found in IndexedDB.');
const container = document.getElementById('media-container');
const currentMedia = container?.querySelector('.current-media');
if (currentMedia) {