From 1ca6aed3c40e99eee42f25c8f95836561a4e7fa9 Mon Sep 17 00:00:00 2001 From: Crystian Date: Mon, 15 Jan 2024 13:19:42 +0100 Subject: [PATCH 01/10] multigpu support :) --- general/gpu.py | 7 +- server/monitor.py | 20 +--- web/monitor.js | 208 ++++++++++++++++++++++++----------- web/monitor.ts | 243 +++++++++++++++++++++++++---------------- web/monitor.types.d.ts | 3 +- 5 files changed, 306 insertions(+), 175 deletions(-) diff --git a/general/gpu.py b/general/gpu.py index 0c7c55e..8f0aa20 100644 --- a/general/gpu.py +++ b/general/gpu.py @@ -93,13 +93,14 @@ class CGPUInfo: deviceHandle = pynvml.nvmlDeviceGetHandleByIndex(deviceIndex) # GPU Utilization - # if self.switchGPU and self.gpusUtilization[deviceIndex]: - if self.switchGPU: + if self.switchGPU and self.gpusUtilization[deviceIndex]: + print('switchGPU', deviceIndex) utilization = pynvml.nvmlDeviceGetUtilizationRates(deviceHandle) gpuUtilization = utilization.gpu # VRAM - if self.switchVRAM: + if self.switchVRAM and self.gpusVRAM[deviceIndex]: + print('switchVRAM', deviceIndex) # Torch or pynvml?, pynvml is more accurate with the system, torch is more accurate with comfyUI memory = pynvml.nvmlDeviceGetMemoryInfo(deviceHandle) vramUsed = memory.used diff --git a/server/monitor.py b/server/monitor.py index 5ccb35e..97c4f70 100644 --- a/server/monitor.py +++ b/server/monitor.py @@ -28,13 +28,6 @@ async def newSettings(request): cmonitor.hardwareInfo.switchCPU = switchCPU - if 'switchGPU' in settings is not None: - switchGPU = settings['switchGPU'] - if type(switchGPU) is not bool: - raise Exception('switchGPU must be an boolean.') - - cmonitor.hardwareInfo.switchGPU = switchGPU - if 'switchHDD' in settings is not None: switchHDD = settings['switchHDD'] if type(switchHDD) is not bool: @@ -49,13 +42,6 @@ async def newSettings(request): cmonitor.hardwareInfo.switchRAM = switchRAM - if 'switchVRAM' in settings is not None: - switchVRAM = settings['switchVRAM'] - if type(switchVRAM) is not bool: - raise Exception('switchVRAM must be an boolean.') - - cmonitor.hardwareInfo.switchVRAM = switchVRAM - if 'whichHDD' in settings is not None: whichHDD = settings['whichHDD'] if type(whichHDD) is not str: @@ -122,6 +108,12 @@ async def getGPUs(request): cmonitor.hardwareInfo.GPUInfo.gpusUtilization[int(index)] = settings['utilization'] + if 'vram' in settings is not None: + if type(settings['vram']) is not bool: + raise Exception('vram must be an boolean.') + + cmonitor.hardwareInfo.GPUInfo.gpusVRAM[int(index)] = settings['vram'] + return web.Response(status=200) except Exception as e: logger.error(e) diff --git a/web/monitor.js b/web/monitor.js index 36d6a75..12db684 100644 --- a/web/monitor.js +++ b/web/monitor.js @@ -51,6 +51,18 @@ class CrystoolsMonitor { writable: true, value: '/' }); + Object.defineProperty(this, "monitorGPUSettings", { + enumerable: true, + configurable: true, + writable: true, + value: [] + }); + Object.defineProperty(this, "monitorVRAMSettings", { + enumerable: true, + configurable: true, + writable: true, + value: [] + }); Object.defineProperty(this, "monitorCPUElement", { enumerable: true, configurable: true, @@ -104,7 +116,7 @@ class CrystoolsMonitor { name: this.menuPrefix + '[menu] Display partition disk monitor (HDD)', type: 'boolean', label: 'HDD', - tooltip: `Drive: ${app.ui.settings.getSettingValue(this.idWhichHDD, this.defaultWhichHDD)}`, + title: `Drive: ${app.ui.settings.getSettingValue(this.idWhichHDD, this.defaultWhichHDD)}`, defaultValue: true, htmlMonitorRef: undefined, htmlMonitorSliderRef: undefined, @@ -118,50 +130,6 @@ class CrystoolsMonitor { }, } }); - Object.defineProperty(this, "monitorGPUElement", { - enumerable: true, - configurable: true, - writable: true, - value: { - id: 'Crystools.switchGPU', - name: this.menuPrefix + '[menu] Display GPU monitor', - type: 'boolean', - label: 'GPU', - defaultValue: true, - htmlMonitorRef: undefined, - htmlMonitorSliderRef: undefined, - htmlMonitorLabelRef: undefined, - cssColor: '#0C86F4', - onChange: async (value) => { - this.updateWidget(this.monitorGPUElement); - await this.updateServer({ - switchGPU: value, - }); - }, - } - }); - Object.defineProperty(this, "monitorVRAMElement", { - enumerable: true, - configurable: true, - writable: true, - value: { - id: 'Crystools.switchVRAM', - name: this.menuPrefix + '[menu] Display Video RAM monitor', - type: 'boolean', - label: 'VRAM', - defaultValue: true, - htmlMonitorRef: undefined, - htmlMonitorSliderRef: undefined, - htmlMonitorLabelRef: undefined, - cssColor: '#176EC7', - onChange: async (value) => { - this.updateWidget(this.monitorVRAMElement); - await this.updateServer({ - switchVRAM: value, - }); - }, - } - }); Object.defineProperty(this, "createSettings", { enumerable: true, configurable: true, @@ -169,8 +137,6 @@ class CrystoolsMonitor { value: () => { app.ui.settings.addSetting(this.monitorCPUElement); app.ui.settings.addSetting(this.monitorRAMElement); - app.ui.settings.addSetting(this.monitorGPUElement); - app.ui.settings.addSetting(this.monitorVRAMElement); app.ui.settings.addSetting(this.monitorHDDElement); app.ui.settings.addSetting({ id: this.idInputRate, @@ -246,6 +212,65 @@ class CrystoolsMonitor { }, }); }); + void this.getGPUsFromServer().then((gpus) => { + console.log(gpus); + let moreThanOneGPU = false; + if (gpus.length > 1) { + moreThanOneGPU = true; + } + gpus?.forEach(({ name, index }) => { + if (name === undefined || index === undefined) { + console.warn('getGPUsFromServer: name or index undefined', name, index); + return; + } + let label = 'GPU'; + let labelVRAM = 'VRAM'; + if (moreThanOneGPU) { + label = 'GPU ' + index; + labelVRAM = 'VRAM' + index; + } + const monitorGPUNElement = { + id: 'Crystools.switchGPU' + index, + name: this.menuPrefix + `[menu] Display GPU monitor\r\n[${index}] ${name}`, + type: 'boolean', + label, + title: `${index}: ${name}`, + defaultValue: true, + htmlMonitorRef: undefined, + htmlMonitorSliderRef: undefined, + htmlMonitorLabelRef: undefined, + cssColor: '#0C86F4', + onChange: async (value) => { + this.updateWidget(monitorGPUNElement); + void await this.updateServerGPU(index, { + utilization: value + }); + }, + }; + const monitorVRAMNElement = { + id: 'Crystools.switchVRAM' + index, + name: this.menuPrefix + `[menu] Display GPU VRAM monitor\r\n[${index}] ${name}`, + type: 'boolean', + label: labelVRAM, + title: `${index}: ${name}`, + defaultValue: true, + htmlMonitorRef: undefined, + htmlMonitorSliderRef: undefined, + htmlMonitorLabelRef: undefined, + cssColor: '#176EC7', + onChange: async (value) => { + this.updateWidget(monitorVRAMNElement); + void await this.updateServerGPU(index, { + vram: value + }); + }, + }; + this.monitorGPUSettings[index] = monitorGPUNElement; + this.monitorVRAMSettings[index] = monitorVRAMNElement; + app.ui.settings.addSetting(this.monitorGPUSettings[index]); + app.ui.settings.addSetting(this.monitorVRAMSettings[index]); + }); + }); } }); Object.defineProperty(this, "updateServer", { @@ -264,6 +289,23 @@ class CrystoolsMonitor { throw new Error(resp.statusText); } }); + Object.defineProperty(this, "updateServerGPU", { + enumerable: true, + configurable: true, + writable: true, + value: async (index, data) => { + console.log('updateServerGPU', index, data); + const resp = await api.fetchApi(`/crystools/monitor/GPU/${index}`, { + method: 'PATCH', + body: JSON.stringify(data), + cache: 'no-store', + }); + if (resp.status === 200) { + return await resp.text(); + } + throw new Error(resp.statusText); + } + }); Object.defineProperty(this, "getHDDsFromServer", { enumerable: true, configurable: true, @@ -272,6 +314,14 @@ class CrystoolsMonitor { return this.getDataFromServer('HDD'); } }); + Object.defineProperty(this, "getGPUsFromServer", { + enumerable: true, + configurable: true, + writable: true, + value: async () => { + return this.getDataFromServer('GPU'); + } + }); Object.defineProperty(this, "getDataFromServer", { enumerable: true, configurable: true, @@ -294,9 +344,13 @@ class CrystoolsMonitor { value: () => { this.updateWidget(this.monitorCPUElement); this.updateWidget(this.monitorRAMElement); - this.updateWidget(this.monitorGPUElement); - this.updateWidget(this.monitorVRAMElement); this.updateWidget(this.monitorHDDElement); + this.monitorGPUSettings.forEach((monitorSettings) => { + monitorSettings && this.updateWidget(monitorSettings); + }); + this.monitorVRAMSettings.forEach((monitorSettings) => { + monitorSettings && this.updateWidget(monitorSettings); + }); } }); Object.defineProperty(this, "updateWidget", { @@ -315,6 +369,7 @@ class CrystoolsMonitor { configurable: true, writable: true, value: (data) => { + console.log('updateAllMonitors', data); this.updateMonitor(this.monitorCPUElement, data.cpu_utilization); this.updateMonitor(this.monitorRAMElement, data.ram_used_percent); this.updateMonitor(this.monitorHDDElement, data.hdd_used_percent); @@ -322,13 +377,32 @@ class CrystoolsMonitor { console.warn('UpdateAllMonitors: no GPU data'); return; } - const gpu = data.gpus[0] ? data.gpus[0] : { - gpu_utilization: 0, vram_used_percent: 0, - }; - const gpu_utilization = gpu.gpu_utilization; - const vram_used_percent = gpu.vram_used_percent; - this.updateMonitor(this.monitorGPUElement, gpu_utilization); - this.updateMonitor(this.monitorVRAMElement, vram_used_percent); + this.monitorGPUSettings.forEach((monitorSettings, index) => { + if (data.gpus[index]) { + const gpu = data.gpus[index]; + if (gpu === undefined) { + console.error('UpdateAllMonitors: no GPU data for index', index); + return; + } + this.updateMonitor(monitorSettings, gpu.gpu_utilization); + } + else { + console.error('UpdateAllMonitors: no GPU data for index', index); + } + }); + this.monitorVRAMSettings.forEach((monitorSettings, index) => { + if (data.gpus[index]) { + const gpu = data.gpus[index]; + if (gpu === undefined) { + console.error('UpdateAllMonitors: no GPU VRAM data for index', index); + return; + } + this.updateMonitor(monitorSettings, gpu.vram_used_percent); + } + else { + console.error('UpdateAllMonitors: no GPU VRAM data for index', index); + } + }); } }); Object.defineProperty(this, "updateMonitor", { @@ -341,9 +415,6 @@ class CrystoolsMonitor { } monitorSettings.htmlMonitorLabelRef.innerHTML = `${Math.floor(percent)}%`; monitorSettings.htmlMonitorSliderRef.style.width = monitorSettings.htmlMonitorLabelRef.innerHTML; - if (monitorSettings.tooltip) { - monitorSettings.htmlMonitorLabelRef.title = monitorSettings.tooltip; - } } }); Object.defineProperty(this, "updateAllAnimationDuration", { @@ -353,9 +424,13 @@ class CrystoolsMonitor { value: (value) => { this.updatedAnimationDuration(this.monitorCPUElement, value); this.updatedAnimationDuration(this.monitorRAMElement, value); - this.updatedAnimationDuration(this.monitorGPUElement, value); - this.updatedAnimationDuration(this.monitorVRAMElement, value); this.updatedAnimationDuration(this.monitorHDDElement, value); + this.monitorGPUSettings.forEach((monitorSettings) => { + monitorSettings && this.updatedAnimationDuration(monitorSettings, value); + }); + this.monitorVRAMSettings.forEach((monitorSettings) => { + monitorSettings && this.updatedAnimationDuration(monitorSettings, value); + }); } }); Object.defineProperty(this, "updatedAnimationDuration", { @@ -384,6 +459,9 @@ class CrystoolsMonitor { htmlMain.style.alignItems = 'center'; htmlMain.style.flexDirection = 'row'; monitorSettings.htmlMonitorRef = htmlMain; + if (monitorSettings.title) { + htmlMain.title = monitorSettings.title; + } const htmlMonitorText = document.createElement('div'); htmlMonitorText.style.width = '35px'; htmlMonitorText.style.fontSize = '10px'; @@ -448,8 +526,12 @@ class CrystoolsMonitor { ctoolsRoot.append(htmlContainer); htmlContainer.append(this.createMonitor(this.monitorCPUElement)); htmlContainer.append(this.createMonitor(this.monitorRAMElement)); - htmlContainer.append(this.createMonitor(this.monitorGPUElement)); - htmlContainer.append(this.createMonitor(this.monitorVRAMElement)); + this.monitorGPUSettings.forEach((monitorSettings) => { + monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); + }); + this.monitorVRAMSettings.forEach((monitorSettings) => { + monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); + }); htmlContainer.append(this.createMonitor(this.monitorHDDElement)); const currentRate = parseFloat(app.ui.settings.getSettingValue(this.idInputRate, this.defaultRate)); this.updateAllAnimationDuration(currentRate); diff --git a/web/monitor.ts b/web/monitor.ts index 5a15897..23f45a9 100644 --- a/web/monitor.ts +++ b/web/monitor.ts @@ -12,6 +12,8 @@ class CrystoolsMonitor { defaultRate = .5; idWhichHDD = 'Crystools.whichHDD'; defaultWhichHDD = '/'; + monitorGPUSettings: TMonitorSettings[] = []; + monitorVRAMSettings: TMonitorSettings[] = []; // CPU Variables monitorCPUElement: TMonitorSettings = { @@ -57,7 +59,7 @@ class CrystoolsMonitor { name: this.menuPrefix + '[menu] Display partition disk monitor (HDD)', type: 'boolean', label: 'HDD', - tooltip: `Drive: ${app.ui.settings.getSettingValue(this.idWhichHDD, this.defaultWhichHDD)}`, + title: `Drive: ${app.ui.settings.getSettingValue(this.idWhichHDD, this.defaultWhichHDD)}`, defaultValue: true, htmlMonitorRef: undefined, htmlMonitorSliderRef: undefined, @@ -71,44 +73,6 @@ class CrystoolsMonitor { }, }; - // GPU Variables - monitorGPUElement: TMonitorSettings = { - id: 'Crystools.switchGPU', - name: this.menuPrefix + '[menu] Display GPU monitor', - type: 'boolean', - label: 'GPU', - defaultValue: true, - htmlMonitorRef: undefined, - htmlMonitorSliderRef: undefined, - htmlMonitorLabelRef: undefined, - cssColor: '#0C86F4', - onChange: async(value: boolean) => { - this.updateWidget(this.monitorGPUElement); - await this.updateServer({ - switchGPU: value, - }); - }, - }; - - // VRAM Variables - monitorVRAMElement: TMonitorSettings = { - id: 'Crystools.switchVRAM', - name: this.menuPrefix + '[menu] Display Video RAM monitor', - type: 'boolean', - label: 'VRAM', - defaultValue: true, - htmlMonitorRef: undefined, - htmlMonitorSliderRef: undefined, - htmlMonitorLabelRef: undefined, - cssColor: '#176EC7', - onChange: async(value: boolean) => { - this.updateWidget(this.monitorVRAMElement); - await this.updateServer({ - switchVRAM: value, - }); - }, - }; - constructor() { this.createSettings(); } @@ -116,8 +80,6 @@ class CrystoolsMonitor { createSettings = (): void => { app.ui.settings.addSetting(this.monitorCPUElement); app.ui.settings.addSetting(this.monitorRAMElement); - app.ui.settings.addSetting(this.monitorGPUElement); - app.ui.settings.addSetting(this.monitorVRAMElement); app.ui.settings.addSetting(this.monitorHDDElement); app.ui.settings.addSetting({ @@ -199,27 +161,77 @@ class CrystoolsMonitor { }); }); + void this.getGPUsFromServer().then((gpus: TGpuName[]): void => { + console.log(gpus); + let moreThanOneGPU = false; + if (gpus.length > 1) { + moreThanOneGPU = true; + } - // void this.getGPUsFromServer().then((gpus: TGpuName[]): void => { - // console.log(gpus); - // gpus?.forEach(({ - // name, index - // }) => { - // const id = this.idSwitchGPU + index; - // app.ui.settings.addSetting({ - // id, - // name: this.menuPrefix + `[menu] Display GPU monitor\r\n[${index}] ${name}`, - // type: 'boolean', - // defaultValue: this.defaultSwitchGPU, - // onChange: async(value: boolean)=> { - // // this.updateWidget(value, this.htmlMonitorGPURef); - // void await this.updateServerGPU(index,{ - // utilization: value - // }); - // }, - // }); - // }); - // }); + gpus?.forEach(({ + name, index + }) => { + + if(name === undefined || index === undefined) { + console.warn('getGPUsFromServer: name or index undefined', name, index); + return; + } + + let label = 'GPU'; + let labelVRAM = 'VRAM'; + if (moreThanOneGPU) { + label = 'GPU '+index; + labelVRAM = 'VRAM'+index; + } + + // GPU Utilization Variables + const monitorGPUNElement: TMonitorSettings = { + id: 'Crystools.switchGPU' + index, + name: this.menuPrefix + `[menu] Display GPU monitor\r\n[${index}] ${name}`, + type: 'boolean', + label, + title: `${index}: ${name}`, + defaultValue: true, + htmlMonitorRef: undefined, + htmlMonitorSliderRef: undefined, + htmlMonitorLabelRef: undefined, + cssColor: '#0C86F4', + onChange: async(value: boolean) => { + this.updateWidget(monitorGPUNElement); + void await this.updateServerGPU(index,{ + utilization: value + }); + }, + }; + + // GPU VRAM Variables + const monitorVRAMNElement: TMonitorSettings = { + id: 'Crystools.switchVRAM' + index, + name: this.menuPrefix + `[menu] Display GPU VRAM monitor\r\n[${index}] ${name}`, + type: 'boolean', + label: labelVRAM, + title: `${index}: ${name}`, + defaultValue: true, + htmlMonitorRef: undefined, + htmlMonitorSliderRef: undefined, + htmlMonitorLabelRef: undefined, + cssColor: '#176EC7', + onChange: async(value: boolean) => { + this.updateWidget(monitorVRAMNElement); + void await this.updateServerGPU(index,{ + vram: value + }); + }, + }; + + this.monitorGPUSettings[index] = monitorGPUNElement; + this.monitorVRAMSettings[index] = monitorVRAMNElement; + // @ts-ignore + app.ui.settings.addSetting(this.monitorGPUSettings[index]); + // @ts-ignore + app.ui.settings.addSetting(this.monitorVRAMSettings[index]); + }); + }); }; @@ -235,26 +247,26 @@ class CrystoolsMonitor { throw new Error(resp.statusText); }; - // updateServerGPU = async(index: number, data: TGpuSettings): Promise => { - // console.log('updateServerGPU', index, data); - // const resp = await api.fetchApi(`/crystools/monitor/GPU/${index}`, { - // method: 'PATCH', - // body: JSON.stringify(data), - // cache: 'no-store', - // }); - // if (resp.status === 200) { - // return await resp.text(); - // } - // throw new Error(resp.statusText); - // }; + updateServerGPU = async(index: number, data: TGpuSettings): Promise => { + console.log('updateServerGPU', index, data); + const resp = await api.fetchApi(`/crystools/monitor/GPU/${index}`, { + method: 'PATCH', + body: JSON.stringify(data), + cache: 'no-store', + }); + if (resp.status === 200) { + return await resp.text(); + } + throw new Error(resp.statusText); + }; getHDDsFromServer = async(): Promise => { return this.getDataFromServer('HDD'); }; - // getGPUsFromServer = async(): Promise => { - // return this.getDataFromServer('GPU'); - // }; + getGPUsFromServer = async(): Promise => { + return this.getDataFromServer('GPU'); + }; getDataFromServer = async(what: string): Promise => { const resp = await api.fetchApi(`/crystools/monitor/${what}`, { @@ -270,9 +282,14 @@ class CrystoolsMonitor { updateAllWidget = (): void => { this.updateWidget(this.monitorCPUElement); this.updateWidget(this.monitorRAMElement); - this.updateWidget(this.monitorGPUElement); - this.updateWidget(this.monitorVRAMElement); this.updateWidget(this.monitorHDDElement); + + this.monitorGPUSettings.forEach((monitorSettings) => { + monitorSettings && this.updateWidget(monitorSettings); + }); + this.monitorVRAMSettings.forEach((monitorSettings) => { + monitorSettings && this.updateWidget(monitorSettings); + }); }; updateWidget = (monitorSettings: TMonitorSettings): void => { @@ -283,7 +300,7 @@ class CrystoolsMonitor { }; updateAllMonitors = (data: TStatsData): void => { - // console.log('updateAllMonitors', data); + console.log('updateAllMonitors', data); this.updateMonitor(this.monitorCPUElement, data.cpu_utilization); this.updateMonitor(this.monitorRAMElement, data.ram_used_percent); this.updateMonitor(this.monitorHDDElement, data.hdd_used_percent); @@ -293,15 +310,45 @@ class CrystoolsMonitor { return; } - const gpu = data.gpus[0] ? data.gpus[0] : { - gpu_utilization: 0, vram_used_percent: 0, - }; - const gpu_utilization = gpu.gpu_utilization; - const vram_used_percent = gpu.vram_used_percent; + this.monitorGPUSettings.forEach((monitorSettings, index) => { + if (data.gpus[index]) { + const gpu = data.gpus[index]; + if (gpu === undefined) { + console.error('UpdateAllMonitors: no GPU data for index', index); + return; + } - this.updateMonitor(this.monitorGPUElement, gpu_utilization); - this.updateMonitor(this.monitorVRAMElement, vram_used_percent); + this.updateMonitor(monitorSettings, gpu.gpu_utilization); + } else { + console.error('UpdateAllMonitors: no GPU data for index', index); + } + }); + + this.monitorVRAMSettings.forEach((monitorSettings, index) => { + if (data.gpus[index]) { + const gpu = data.gpus[index]; + if (gpu === undefined) { + console.error('UpdateAllMonitors: no GPU VRAM data for index', index); + return; + } + + this.updateMonitor(monitorSettings, gpu.vram_used_percent); + } else { + console.error('UpdateAllMonitors: no GPU VRAM data for index', index); + } + }); + + + // const gpu2 = data.gpus[0] ? data.gpus[0] : { + // gpu_utilization: 0, vram_used_percent: 0, + // }; + + // const gpu_utilization = gpu.gpu_utilization; + // const vram_used_percent = gpu2.vram_used_percent; + + // this.updateMonitor(this.monitorGPUElement, gpu_utilization); + // this.updateMonitor(this.monitorVRAMElement, vram_used_percent); }; updateMonitor = (monitorSettings: TMonitorSettings, percent: number): void => { @@ -311,17 +358,18 @@ class CrystoolsMonitor { monitorSettings.htmlMonitorLabelRef.innerHTML = `${Math.floor(percent)}%`; monitorSettings.htmlMonitorSliderRef.style.width = monitorSettings.htmlMonitorLabelRef.innerHTML; - if (monitorSettings.tooltip) { - monitorSettings.htmlMonitorLabelRef.title = monitorSettings.tooltip; - } }; updateAllAnimationDuration = (value: number): void => { this.updatedAnimationDuration(this.monitorCPUElement, value); this.updatedAnimationDuration(this.monitorRAMElement, value); - this.updatedAnimationDuration(this.monitorGPUElement, value); - this.updatedAnimationDuration(this.monitorVRAMElement, value); this.updatedAnimationDuration(this.monitorHDDElement, value); + this.monitorGPUSettings.forEach((monitorSettings) => { + monitorSettings && this.updatedAnimationDuration(monitorSettings, value); + }); + this.monitorVRAMSettings.forEach((monitorSettings) => { + monitorSettings && this.updatedAnimationDuration(monitorSettings, value); + }); }; updatedAnimationDuration = (monitorSettings: TMonitorSettings, value: number): void => { @@ -356,8 +404,12 @@ class CrystoolsMonitor { htmlContainer.append(this.createMonitor(this.monitorCPUElement)); htmlContainer.append(this.createMonitor(this.monitorRAMElement)); - htmlContainer.append(this.createMonitor(this.monitorGPUElement)); - htmlContainer.append(this.createMonitor(this.monitorVRAMElement)); + this.monitorGPUSettings.forEach((monitorSettings) => { + monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); + }); + this.monitorVRAMSettings.forEach((monitorSettings) => { + monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); + }); htmlContainer.append(this.createMonitor(this.monitorHDDElement)); const currentRate = parseFloat(app.ui.settings.getSettingValue(this.idInputRate, this.defaultRate)); @@ -377,6 +429,10 @@ class CrystoolsMonitor { htmlMain.style.flexDirection = 'row'; monitorSettings.htmlMonitorRef = htmlMain; + if (monitorSettings.title) { + htmlMain.title = monitorSettings.title; + } + const htmlMonitorText = document.createElement('div'); htmlMonitorText.style.width = '35px'; htmlMonitorText.style.fontSize = '10px'; @@ -395,7 +451,6 @@ class CrystoolsMonitor { htmlMonitorSlider.style.height = '100%'; htmlMonitorSlider.style.width = '0'; htmlMonitorSlider.style.backgroundColor = monitorSettings.cssColor; - // htmlMonitorSlider.style.transition = 'width 0.5s'; monitorSettings.htmlMonitorSliderRef = htmlMonitorSlider; htmlMonitorContent.append(htmlMonitorSlider); diff --git a/web/monitor.types.d.ts b/web/monitor.types.d.ts index 99e83ce..2160da5 100644 --- a/web/monitor.types.d.ts +++ b/web/monitor.types.d.ts @@ -41,7 +41,8 @@ type TMonitorSettings = { id: string, name: string, label: string, // on monitor - tooltip?: string, + title?: string, // on monitor + tooltip?: string, // on settings type: 'boolean' | 'number' | 'string', defaultValue: boolean, onChange: (value: boolean) => Promise, From 45df32229dd69c8a9747c80a493cf06ebf65ac8e Mon Sep 17 00:00:00 2001 From: Crystian Date: Mon, 15 Jan 2024 13:50:00 +0100 Subject: [PATCH 02/10] ready for test --- general/gpu.py | 8 ++++---- web/monitor.js | 4 ---- web/monitor.ts | 19 ++++--------------- 3 files changed, 8 insertions(+), 23 deletions(-) diff --git a/general/gpu.py b/general/gpu.py index 8f0aa20..23ef515 100644 --- a/general/gpu.py +++ b/general/gpu.py @@ -80,10 +80,10 @@ class CGPUInfo: if self.cudaDevice == 'cpu': gpuType = 'cpu' gpus.append({ - 'gpu_utilization': -1, - 'vram_total': -1, - 'vram_used': -1, - 'vram_used_percent': -1, + 'gpu_utilization': 0, + 'vram_total': 0, + 'vram_used': 0, + 'vram_used_percent': 0, }) else: gpuType = self.cudaDevice diff --git a/web/monitor.js b/web/monitor.js index 12db684..3bb5561 100644 --- a/web/monitor.js +++ b/web/monitor.js @@ -381,26 +381,22 @@ class CrystoolsMonitor { if (data.gpus[index]) { const gpu = data.gpus[index]; if (gpu === undefined) { - console.error('UpdateAllMonitors: no GPU data for index', index); return; } this.updateMonitor(monitorSettings, gpu.gpu_utilization); } else { - console.error('UpdateAllMonitors: no GPU data for index', index); } }); this.monitorVRAMSettings.forEach((monitorSettings, index) => { if (data.gpus[index]) { const gpu = data.gpus[index]; if (gpu === undefined) { - console.error('UpdateAllMonitors: no GPU VRAM data for index', index); return; } this.updateMonitor(monitorSettings, gpu.vram_used_percent); } else { - console.error('UpdateAllMonitors: no GPU VRAM data for index', index); } }); } diff --git a/web/monitor.ts b/web/monitor.ts index 23f45a9..f77cb7c 100644 --- a/web/monitor.ts +++ b/web/monitor.ts @@ -315,13 +315,13 @@ class CrystoolsMonitor { if (data.gpus[index]) { const gpu = data.gpus[index]; if (gpu === undefined) { - console.error('UpdateAllMonitors: no GPU data for index', index); + // console.error('UpdateAllMonitors: no GPU data for index', index); return; } this.updateMonitor(monitorSettings, gpu.gpu_utilization); } else { - console.error('UpdateAllMonitors: no GPU data for index', index); + // console.error('UpdateAllMonitors: no GPU data for index', index); } }); @@ -329,26 +329,15 @@ class CrystoolsMonitor { if (data.gpus[index]) { const gpu = data.gpus[index]; if (gpu === undefined) { - console.error('UpdateAllMonitors: no GPU VRAM data for index', index); + // console.error('UpdateAllMonitors: no GPU VRAM data for index', index); return; } this.updateMonitor(monitorSettings, gpu.vram_used_percent); } else { - console.error('UpdateAllMonitors: no GPU VRAM data for index', index); + // console.error('UpdateAllMonitors: no GPU VRAM data for index', index); } }); - - - // const gpu2 = data.gpus[0] ? data.gpus[0] : { - // gpu_utilization: 0, vram_used_percent: 0, - // }; - - // const gpu_utilization = gpu.gpu_utilization; - // const vram_used_percent = gpu2.vram_used_percent; - - // this.updateMonitor(this.monitorGPUElement, gpu_utilization); - // this.updateMonitor(this.monitorVRAMElement, vram_used_percent); }; updateMonitor = (monitorSettings: TMonitorSettings, percent: number): void => { From 7bba56e5f0a96f7022e35b79fb0641754133e85c Mon Sep 17 00:00:00 2001 From: Crystian Date: Mon, 15 Jan 2024 21:52:03 +0100 Subject: [PATCH 03/10] fix? --- general/gpu.py | 12 ++++++------ web/monitor.js | 1 - web/monitor.ts | 1 - 3 files changed, 6 insertions(+), 8 deletions(-) diff --git a/general/gpu.py b/general/gpu.py index 23ef515..1f7532f 100644 --- a/general/gpu.py +++ b/general/gpu.py @@ -15,8 +15,8 @@ class CGPUInfo: torchDevice = 'cpu' cudaDevice = 'cpu' cudaDevicesFound = 0 - switchGPU = False - switchVRAM = False + switchGPU = True + switchVRAM = True gpus = [] gpusUtilization = [] gpusVRAM = [] @@ -44,8 +44,8 @@ class CGPUInfo: }) # same index as gpus, with default values - self.gpusUtilization.append(False) - self.gpusVRAM.append(False) + self.gpusUtilization.append(True) + self.gpusVRAM.append(True) self.cuda = True logger.info(f'NVIDIA Driver: {pynvml.nvmlSystemGetDriverVersion()}') @@ -94,13 +94,13 @@ class CGPUInfo: # GPU Utilization if self.switchGPU and self.gpusUtilization[deviceIndex]: - print('switchGPU', deviceIndex) + print('monitoring GPU of', deviceIndex) utilization = pynvml.nvmlDeviceGetUtilizationRates(deviceHandle) gpuUtilization = utilization.gpu # VRAM if self.switchVRAM and self.gpusVRAM[deviceIndex]: - print('switchVRAM', deviceIndex) + print('monitoring VRAM of', deviceIndex) # Torch or pynvml?, pynvml is more accurate with the system, torch is more accurate with comfyUI memory = pynvml.nvmlDeviceGetMemoryInfo(deviceHandle) vramUsed = memory.used diff --git a/web/monitor.js b/web/monitor.js index 3bb5561..eddcaa3 100644 --- a/web/monitor.js +++ b/web/monitor.js @@ -294,7 +294,6 @@ class CrystoolsMonitor { configurable: true, writable: true, value: async (index, data) => { - console.log('updateServerGPU', index, data); const resp = await api.fetchApi(`/crystools/monitor/GPU/${index}`, { method: 'PATCH', body: JSON.stringify(data), diff --git a/web/monitor.ts b/web/monitor.ts index f77cb7c..e44530c 100644 --- a/web/monitor.ts +++ b/web/monitor.ts @@ -248,7 +248,6 @@ class CrystoolsMonitor { }; updateServerGPU = async(index: number, data: TGpuSettings): Promise => { - console.log('updateServerGPU', index, data); const resp = await api.fetchApi(`/crystools/monitor/GPU/${index}`, { method: 'PATCH', body: JSON.stringify(data), From 852a679ae688d60d7f886ed6a3f8bf8242422f20 Mon Sep 17 00:00:00 2001 From: Crystian Date: Tue, 16 Jan 2024 01:21:25 +0100 Subject: [PATCH 04/10] Update README.md colab added --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 6a53c87..162d2e5 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# ComfyUI-Crystools [![Hits](https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fgithub.com%2Fcrystian%2FComfyUI-Crystools&count_bg=%2379C83D&title_bg=%23555555&icon=&icon_color=%23E7E7E7&title=hits&edge_flat=false)](https://hits.seeyoufarm.com) [![Donate](https://img.shields.io/badge/Donate-PayPal-blue.svg)](https://paypal.me/crystian77) +# ComfyUI-Crystools [![Hits](https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fgithub.com%2Fcrystian%2FComfyUI-Crystools&count_bg=%2379C83D&title_bg=%23555555&icon=&icon_color=%23E7E7E7&title=hits&edge_flat=false)](https://hits.seeyoufarm.com) [![Donate](https://img.shields.io/badge/Donate-PayPal-blue.svg)](https://paypal.me/crystian77) Open in Colab **_🪛 A powerful set of tools for your belt when you work with ComfyUI 🪛_** From 662912a84683ab1e26ddccabab399bab3be33da3 Mon Sep 17 00:00:00 2001 From: Crystian Date: Tue, 16 Jan 2024 10:38:49 +0100 Subject: [PATCH 05/10] version updated --- __init__.py | 2 +- core/version.py | 2 +- version | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/__init__.py b/__init__.py index a0f4a81..6ea4f72 100644 --- a/__init__.py +++ b/__init__.py @@ -2,7 +2,7 @@ @author: Crystian @title: Crystools @nickname: Crystools -@version: 1.9.3 +@version: 1.10.1-gpu @project: "https://github.com/crystian/ComfyUI-Crystools", @description: Plugins for multiples uses, mainly for debugging, you need them! IG: https://www.instagram.com/crystian.ia """ diff --git a/core/version.py b/core/version.py index a52be3a..d79902e 100644 --- a/core/version.py +++ b/core/version.py @@ -1 +1 @@ -version = "1.9.3" +version = "1.10.1-gpu" diff --git a/version b/version index 77fee73..f7f2cff 100644 --- a/version +++ b/version @@ -1 +1 @@ -1.9.3 +1.10.1-gpu From 44e8b8d46bb4d23a9cd653461f6cbbd7bb0c2ab1 Mon Sep 17 00:00:00 2001 From: Crystian Date: Tue, 16 Jan 2024 21:09:29 +0100 Subject: [PATCH 06/10] gpu0 > vram0 > gpu1 > vram1 & simulation of 3 cards --- __init__.py | 2 +- core/version.py | 2 +- general/gpu.py | 12 +++++++++++- version | 2 +- web/monitor.js | 11 ++++++----- web/monitor.ts | 25 +++++++++++++++++++------ 6 files changed, 39 insertions(+), 15 deletions(-) diff --git a/__init__.py b/__init__.py index 6ea4f72..0128a65 100644 --- a/__init__.py +++ b/__init__.py @@ -2,7 +2,7 @@ @author: Crystian @title: Crystools @nickname: Crystools -@version: 1.10.1-gpu +@version: 1.10.2-gpu @project: "https://github.com/crystian/ComfyUI-Crystools", @description: Plugins for multiples uses, mainly for debugging, you need them! IG: https://www.instagram.com/crystian.ia """ diff --git a/core/version.py b/core/version.py index d79902e..bec7b94 100644 --- a/core/version.py +++ b/core/version.py @@ -1 +1 @@ -version = "1.10.1-gpu" +version = "1.10.2-gpu" diff --git a/general/gpu.py b/general/gpu.py index 1f7532f..d8b9f85 100644 --- a/general/gpu.py +++ b/general/gpu.py @@ -31,11 +31,17 @@ class CGPUInfo: if self.pynvmlLoaded and pynvml.nvmlDeviceGetCount() > 0: self.cudaDevicesFound = pynvml.nvmlDeviceGetCount() + + logger.info(f"GPU/s:") + + # for simulate multiple GPUs (for testing) interchange these comments: + # for deviceIndex in range(3): + # deviceHandle = pynvml.nvmlDeviceGetHandleByIndex(0) for deviceIndex in range(self.cudaDevicesFound): deviceHandle = pynvml.nvmlDeviceGetHandleByIndex(deviceIndex) + gpuName = pynvml.nvmlDeviceGetName(deviceHandle) - logger.info(f"GPU/s:") logger.info(f"{deviceIndex}) {gpuName}") self.gpus.append({ @@ -89,6 +95,10 @@ class CGPUInfo: gpuType = self.cudaDevice if self.pynvmlLoaded and self.cuda and self.cudaAvailable: + + # for simulate multiple GPUs (for testing) interchange these comments: + # for deviceIndex in range(3): + # deviceHandle = pynvml.nvmlDeviceGetHandleByIndex(0) for deviceIndex in range(self.cudaDevicesFound): deviceHandle = pynvml.nvmlDeviceGetHandleByIndex(deviceIndex) diff --git a/version b/version index f7f2cff..72708e7 100644 --- a/version +++ b/version @@ -1 +1 @@ -1.10.1-gpu +1.10.2-gpu diff --git a/web/monitor.js b/web/monitor.js index 64a5801..59a4636 100644 --- a/web/monitor.js +++ b/web/monitor.js @@ -445,6 +445,9 @@ class CrystoolsMonitor { configurable: true, writable: true, value: (monitorSettings) => { + if (!monitorSettings) { + return document.createElement('div'); + } const htmlMain = document.createElement('div'); htmlMain.setAttribute('id', monitorSettings.id); htmlMain.style.margin = '2px 10px'; @@ -521,11 +524,9 @@ class CrystoolsMonitor { ctoolsRoot.append(htmlContainer); htmlContainer.append(this.createMonitor(this.monitorCPUElement)); htmlContainer.append(this.createMonitor(this.monitorRAMElement)); - this.monitorGPUSettings.forEach((monitorSettings) => { - monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); - }); - this.monitorVRAMSettings.forEach((monitorSettings) => { - monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); + this.monitorGPUSettings.forEach((_monitorSettings, index) => { + this.monitorGPUSettings[index] && htmlContainer.append(this.createMonitor(this.monitorGPUSettings[index])); + this.monitorVRAMSettings[index] && htmlContainer.append(this.createMonitor(this.monitorVRAMSettings[index])); }); htmlContainer.append(this.createMonitor(this.monitorHDDElement)); const currentRate = parseFloat(app.ui.settings.getSettingValue(this.idInputRate, this.defaultRate)); diff --git a/web/monitor.ts b/web/monitor.ts index 963a743..e8839e2 100644 --- a/web/monitor.ts +++ b/web/monitor.ts @@ -392,12 +392,21 @@ class CrystoolsMonitor { htmlContainer.append(this.createMonitor(this.monitorCPUElement)); htmlContainer.append(this.createMonitor(this.monitorRAMElement)); - this.monitorGPUSettings.forEach((monitorSettings) => { - monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); - }); - this.monitorVRAMSettings.forEach((monitorSettings) => { - monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); + + // gpu0 > gpu1 > vram0 > vram1 + // this.monitorGPUSettings.forEach((monitorSettings) => { + // monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); + // }); + // this.monitorVRAMSettings.forEach((monitorSettings) => { + // monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); + // }); + + // gpu0 > vram0 > gpu1 > vram1 + this.monitorGPUSettings.forEach((_monitorSettings, index) => { + this.monitorGPUSettings[index] && htmlContainer.append(this.createMonitor(this.monitorGPUSettings[index])); + this.monitorVRAMSettings[index] && htmlContainer.append(this.createMonitor(this.monitorVRAMSettings[index])); }); + htmlContainer.append(this.createMonitor(this.monitorHDDElement)); const currentRate = parseFloat(app.ui.settings.getSettingValue(this.idInputRate, this.defaultRate)); @@ -406,7 +415,11 @@ class CrystoolsMonitor { this.registerListeners(); } - createMonitor = (monitorSettings: TMonitorSettings): HTMLDivElement => { + createMonitor = (monitorSettings?: TMonitorSettings): HTMLDivElement => { + if (!monitorSettings) { + // just for typescript + return document.createElement('div'); + } const htmlMain = document.createElement('div'); htmlMain.setAttribute('id', monitorSettings.id); htmlMain.style.margin = '2px 10px'; From fa48fba479054c2317b7dbdc1d1820fbc16f0048 Mon Sep 17 00:00:00 2001 From: Crystian Date: Wed, 17 Jan 2024 00:59:58 +0100 Subject: [PATCH 07/10] strange issue with battery is fixed (a message) --- README.md | 1 + __init__.py | 2 +- core/version.py | 2 +- general/gpu.py | 14 ++++++++++++-- version | 2 +- 5 files changed, 16 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 162d2e5..fdf3ca8 100644 --- a/README.md +++ b/README.md @@ -38,6 +38,7 @@ You can configure the refresh rate which resources to show: > **Notes:** > - The GPU data is only available when you use CUDA (only NVIDIA cards, sorry AMD users). > - It is not perfect, but it is a good approximation. +> - The cost of the monitor is low (0.1 to 0.5% of utilization), you can disable it from settings (`Refres rate` to `0`). > - Data comes from these libraries: > - [psutil](https://pypi.org/project/psutil/) > - [torch](https://pytorch.org/) diff --git a/__init__.py b/__init__.py index a0f4a81..fca8753 100644 --- a/__init__.py +++ b/__init__.py @@ -2,7 +2,7 @@ @author: Crystian @title: Crystools @nickname: Crystools -@version: 1.9.3 +@version: 1.9.4 @project: "https://github.com/crystian/ComfyUI-Crystools", @description: Plugins for multiples uses, mainly for debugging, you need them! IG: https://www.instagram.com/crystian.ia """ diff --git a/core/version.py b/core/version.py index a52be3a..091e924 100644 --- a/core/version.py +++ b/core/version.py @@ -1 +1 @@ -version = "1.9.3" +version = "1.9.4" diff --git a/general/gpu.py b/general/gpu.py index 0c7c55e..faf9415 100644 --- a/general/gpu.py +++ b/general/gpu.py @@ -95,8 +95,18 @@ class CGPUInfo: # GPU Utilization # if self.switchGPU and self.gpusUtilization[deviceIndex]: if self.switchGPU: - utilization = pynvml.nvmlDeviceGetUtilizationRates(deviceHandle) - gpuUtilization = utilization.gpu + gpuUtilization = 0 + try: + utilization = pynvml.nvmlDeviceGetUtilizationRates(deviceHandle) + gpuUtilization = utilization.gpu + except Exception as e: + if str(e) == "Unknown Error": + logger.error('For some reason, pynvml is not working in a laptop with only battery, try to connect and turn on the monitor') + else: + logger.error('Could not get GPU utilization.' + str(e)) + + logger.error('Monitor of GPU is turning off (not on UI!)') + self.switchGPU = False # VRAM if self.switchVRAM: diff --git a/version b/version index 77fee73..d615fd0 100644 --- a/version +++ b/version @@ -1 +1 @@ -1.9.3 +1.9.4 From 582064ac38aec24b44a8e09b7d4404a7050c1f3d Mon Sep 17 00:00:00 2001 From: Crystian Date: Wed, 17 Jan 2024 01:12:06 +0100 Subject: [PATCH 08/10] cleaning prints --- server/monitor.py | 1 - web/monitor.js | 2 -- web/monitor.ts | 3 +-- web/progressBar.js | 1 - web/progressBar.ts | 1 - 5 files changed, 1 insertion(+), 7 deletions(-) diff --git a/server/monitor.py b/server/monitor.py index 97c4f70..b77144d 100644 --- a/server/monitor.py +++ b/server/monitor.py @@ -90,7 +90,6 @@ def getHDDs(request): def getGPUs(request): try: gpuInfo = cmonitor.hardwareInfo.getGPUInfo() - print(gpuInfo) return web.json_response(gpuInfo) except Exception as e: logger.error(e) diff --git a/web/monitor.js b/web/monitor.js index 59a4636..53b9f31 100644 --- a/web/monitor.js +++ b/web/monitor.js @@ -213,7 +213,6 @@ class CrystoolsMonitor { }); }); void this.getGPUsFromServer().then((gpus) => { - console.log(gpus); let moreThanOneGPU = false; if (gpus.length > 1) { moreThanOneGPU = true; @@ -368,7 +367,6 @@ class CrystoolsMonitor { configurable: true, writable: true, value: (data) => { - console.log('updateAllMonitors', data); this.updateMonitor(this.monitorCPUElement, data.cpu_utilization); this.updateMonitor(this.monitorRAMElement, data.ram_used_percent); this.updateMonitor(this.monitorHDDElement, data.hdd_used_percent); diff --git a/web/monitor.ts b/web/monitor.ts index e8839e2..78f82a9 100644 --- a/web/monitor.ts +++ b/web/monitor.ts @@ -162,7 +162,6 @@ class CrystoolsMonitor { }); void this.getGPUsFromServer().then((gpus: TGpuName[]): void => { - console.log(gpus); let moreThanOneGPU = false; if (gpus.length > 1) { moreThanOneGPU = true; @@ -299,7 +298,7 @@ class CrystoolsMonitor { }; updateAllMonitors = (data: TStatsData): void => { - console.log('updateAllMonitors', data); + // console.log('updateAllMonitors', data); this.updateMonitor(this.monitorCPUElement, data.cpu_utilization); this.updateMonitor(this.monitorRAMElement, data.ram_used_percent); this.updateMonitor(this.monitorHDDElement, data.hdd_used_percent); diff --git a/web/progressBar.js b/web/progressBar.js index ef0df06..7cdcd9a 100644 --- a/web/progressBar.js +++ b/web/progressBar.js @@ -126,7 +126,6 @@ class CrystoolsProgressBar { else if (this.currentStatus === EStatus.execution_error) { this.htmlProgressLabelRef.innerHTML = 'ERROR'; this.htmlProgressSliderRef.style.backgroundColor = 'var(--error-text)'; - console.log('execution_error'); } else if (this.currentStatus === EStatus.executing) { this.htmlProgressLabelRef.innerHTML = `${this.currentProgress}%`; diff --git a/web/progressBar.ts b/web/progressBar.ts index f1f3e9c..4fe5e1e 100644 --- a/web/progressBar.ts +++ b/web/progressBar.ts @@ -68,7 +68,6 @@ class CrystoolsProgressBar { // an error occurred this.htmlProgressLabelRef.innerHTML = 'ERROR'; this.htmlProgressSliderRef.style.backgroundColor = 'var(--error-text)'; - console.log('execution_error'); } else if (this.currentStatus === EStatus.executing) { // on going From d11eb848230a3ea97365988910bd1decc7654e1a Mon Sep 17 00:00:00 2001 From: Crystian Date: Wed, 17 Jan 2024 01:19:19 +0100 Subject: [PATCH 09/10] doc updated --- README.md | 4 +--- web/monitor.js | 8 +++++--- web/monitor.ts | 20 ++++++++++---------- 3 files changed, 16 insertions(+), 16 deletions(-) diff --git a/README.md b/README.md index fdf3ca8..221bc46 100644 --- a/README.md +++ b/README.md @@ -37,14 +37,12 @@ You can configure the refresh rate which resources to show: > **Notes:** > - The GPU data is only available when you use CUDA (only NVIDIA cards, sorry AMD users). -> - It is not perfect, but it is a good approximation. +> - This extension needs ComfyUI 1915 (or higher). > - The cost of the monitor is low (0.1 to 0.5% of utilization), you can disable it from settings (`Refres rate` to `0`). > - Data comes from these libraries: > - [psutil](https://pypi.org/project/psutil/) > - [torch](https://pytorch.org/) > - [pynvml](https://pypi.org/project/pynvml/) (official NVIDIA library) -> - This is a beta version, so please report any issue you find. - ### Progress bar diff --git a/web/monitor.js b/web/monitor.js index 53b9f31..7e02709 100644 --- a/web/monitor.js +++ b/web/monitor.js @@ -522,9 +522,11 @@ class CrystoolsMonitor { ctoolsRoot.append(htmlContainer); htmlContainer.append(this.createMonitor(this.monitorCPUElement)); htmlContainer.append(this.createMonitor(this.monitorRAMElement)); - this.monitorGPUSettings.forEach((_monitorSettings, index) => { - this.monitorGPUSettings[index] && htmlContainer.append(this.createMonitor(this.monitorGPUSettings[index])); - this.monitorVRAMSettings[index] && htmlContainer.append(this.createMonitor(this.monitorVRAMSettings[index])); + this.monitorGPUSettings.forEach((monitorSettings) => { + monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); + }); + this.monitorVRAMSettings.forEach((monitorSettings) => { + monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); }); htmlContainer.append(this.createMonitor(this.monitorHDDElement)); const currentRate = parseFloat(app.ui.settings.getSettingValue(this.idInputRate, this.defaultRate)); diff --git a/web/monitor.ts b/web/monitor.ts index 78f82a9..e8681f7 100644 --- a/web/monitor.ts +++ b/web/monitor.ts @@ -393,18 +393,18 @@ class CrystoolsMonitor { htmlContainer.append(this.createMonitor(this.monitorRAMElement)); // gpu0 > gpu1 > vram0 > vram1 - // this.monitorGPUSettings.forEach((monitorSettings) => { - // monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); - // }); - // this.monitorVRAMSettings.forEach((monitorSettings) => { - // monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); - // }); + this.monitorGPUSettings.forEach((monitorSettings) => { + monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); + }); + this.monitorVRAMSettings.forEach((monitorSettings) => { + monitorSettings && htmlContainer.append(this.createMonitor(monitorSettings)); + }); // gpu0 > vram0 > gpu1 > vram1 - this.monitorGPUSettings.forEach((_monitorSettings, index) => { - this.monitorGPUSettings[index] && htmlContainer.append(this.createMonitor(this.monitorGPUSettings[index])); - this.monitorVRAMSettings[index] && htmlContainer.append(this.createMonitor(this.monitorVRAMSettings[index])); - }); + // this.monitorGPUSettings.forEach((_monitorSettings, index) => { + // this.monitorGPUSettings[index] && htmlContainer.append(this.createMonitor(this.monitorGPUSettings[index])); + // this.monitorVRAMSettings[index] && htmlContainer.append(this.createMonitor(this.monitorVRAMSettings[index])); + // }); htmlContainer.append(this.createMonitor(this.monitorHDDElement)); From 798a4be6dc5416ef59c509299efb1731c956ec6e Mon Sep 17 00:00:00 2001 From: Crystian Date: Wed, 17 Jan 2024 01:25:25 +0100 Subject: [PATCH 10/10] Update README.md --- README.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/README.md b/README.md index 221bc46..4dab50e 100644 --- a/README.md +++ b/README.md @@ -512,6 +512,9 @@ You have predefined switches (string, latent, image, conditioning) but you can u ### Crystools +### 1.10.0 (17/01/2024) +- Multi-gpu added + ### 1.9.2 (15/01/2024) - Big refactor on hardwareInfo and monitor.ts, gpu was separated on another file, preparing for multi-gpu support