Информация о GPU в ElectronJS

Опубликовано: 29 Июля, 2021

ElectronJS - это платформа с открытым исходным кодом, используемая для создания кроссплатформенных нативных настольных приложений с использованием веб-технологий, таких как HTML, CSS и JavaScript, которые могут работать в операционных системах Windows, macOS и Linux. Он объединяет движок Chromium и NodeJS в единую среду выполнения.

GPU (Graphics Processing Unit) - это специализированный программируемый процессор, используемый для рендеринга всего графического контента, такого как изображения, на экране компьютера. Он разработан для быстрого управления и изменения памяти для ускорения создания изображений в буфере кадров, предназначенных для вывода на устройство отображения. Все современные компьютерные системы поставляются со встроенными компонентами графического процессора, т.е. они могут быть либо частью схемы материнской платы, либо вообще другим компонентом, подключенным к материнской плате извне. Chromium широко использует этот компонент графического процессора при отображении контента, ускоренного графическим процессором. Chromium использует графические процессоры для ускорения рендеринга веб-страниц, HTML, CSS и других графических элементов в браузере. Последние версии Chromium также используют компонент GPU для рендеринга и обработки видео. Графический процессор потребляет меньше энергии, чем центральный процессор, что снижает энергопотребление и в целом выделяет меньше тепла. Графический процессор также помогает сбалансировать нагрузку на ЦП за счет совместного использования ресурсов, что позволяет ЦП работать быстрее и брать на себя более тяжелые вычислительные задачи. В браузерах Chromium есть специальная вкладка GPU для мониторинга и отображения всей информации, связанной с GPU в системе. Доступ к нему можно получить, посетив страницу chrome: // gpu / в браузере. Электрон также может получить доступ к этой информации, связанной с графическим процессором, и использовать ее для приложения с помощью событий и методов экземпляра модуля приложения. В этом руководстве будет показано, как получать, отображать и контролировать информацию, связанную с графическим процессором, в Electron.

Мы предполагаем, что вы знакомы с предварительными условиями, описанными в вышеупомянутой ссылке. Для работы Electron в системе должны быть предварительно установлены node и npm.

  • Структура проекта:

Пример: следуйте инструкциям в разделе «Печать в ElectronJS», чтобы настроить базовое приложение «Электрон». Скопируйте код Boilerplate для файлов main.js и index.html, как указано в статье. Кроме того, внесите необходимые изменения, упомянутые в файле package.json, чтобы запустить приложение Electron. Мы продолжим создавать наше приложение, используя ту же кодовую базу. Основные шаги, необходимые для настройки приложения Electron, остаются прежними.
package.json:

{
  "name": "electronic-gpu",
  "версия": "1.0.0",
  "description": "Информация о GPU в электронном",
  "main": "main.js",
  "scripts": {
    "старт": "электрон".
  },
  "ключевые слова": [
    "электрон"
  ],
  «автор»: «Радхеш Ханна»,
  "лицензия": "ISC",
  "dependencies": {
    "электрон": "^ 8.3.0"
  }
}

Выход:

Информация о графическом процессоре в Electron: модуль приложения используется для управления жизненным циклом событий приложения. Этот модуль является частью основного процесса . Чтобы импортировать и использовать модуль приложения в процессе рендеринга , мы будем использовать удаленный модуль Electron.

  • index.html : добавьте в этот файл следующий фрагмент.

html




< h3 >GPU Information in Electron</ h3 >
< button id = "metrics" >
Fetch App Metrics
</ button >
< br >< br >
< button id = "basic" >
Get Basic GPU Information
</ button >
< br >< br >
< button id = "complete" >
Get Complete GPU Information
</ button >
< br >< br >
< button id = "features" >
Get GPU Feature Status
</ button > 
  •  index.js : все кнопки, созданные в index.html, будут использоваться для отображения различной информации, относящейся к графическому процессору и приложению. Эти кнопки еще не связаны с какими-либо функциями. Чтобы изменить это, добавьте следующий код в файл index.js.
 javascript 



 const electron = require( 'electron' )
 // Importing the app module using Electron remote
 const app = electron.remote.app;
 
app.on( 'gpu-info-update' , () => {
    console.log( 'GPU Information has been Updated' );
 });
 
app.on( 'gpu-process-crashed' , (event, killed) => {
    console.log( 'GPU Process has crashed' );
    console.log(event);
    console.log( 'Whether GPU Process was killed - ' , killed);
 });
 
var metrics = document.getElementById( 'metrics' );
 metrics.addEventListener( 'click' , () => {
    console.dir(app.getAppMetrics());
 });
 
var basic = document.getElementById( 'basic' );
 basic.addEventListener( 'click' , () => {
    app.getGPUInfo( 'basic' ).then(basicObj => {
        console.dir(basicObj);
    });
 });
 
var complete = document.getElementById( 'complete' );
 complete.addEventListener( 'click' , () => {
    app.getGPUInfo( 'complete' ).then(completeObj => {
        console.dir(completeObj);
    });
 });
 
var features = document.getElementById( 'features' );
 features.addEventListener( 'click' , () => {
    console.dir(app.getGPUFeatureStatus());
 });
 
Метод экземпляра app.getAppMetrics () модуля app используется для возврата массива объектов ProcessMetric, которые соответствуют статистике использования памяти и ЦП всеми процессами, связанными с приложением. Объект ProcessMetric состоит из следующих параметров.
  •  pid: Integer Идентификатор процесса (PID) . Каждый процесс, выполняемый в приложении, представлен отдельным объектом ProcessMetric в массиве. Этот параметр важен, потому что несколько методов экземпляра модуля webFrame используют PID в качестве входного аргумента. Этот параметр также важен для отладки и проверки системных показателей различных текущих процессов в собственной системной ОС, связанных с приложением.
  •  type: String Этот параметр представляет тип процесса, выполняемого в приложении. Этот параметр может содержать любое из следующих значений:
    •  Браузер
    •  Вкладка
    •  Полезность
    •  Зигота
    •  Помощник по песочнице
    •  GPU
    •  Плагин Pepper
    •  Брокер плагинов Pepper
    •  Неизвестный
  •  cpu: Object Этот параметр возвращает объект CPUUsage, который представляет использование ЦП процессом. Этот объект также может быть получен из метода экземпляра process.getCPUUsage () глобального объекта Process и ведет себя точно так же. Для получения более подробной информации об объекте CPUUsage и его поведении обратитесь к статье: Объект процесса в ElectronJS.
  •  createTime: Integer Этот параметр представляет время создания процесса. Время представлено в миллисекундах с начала эпохи. Этот параметр также можно получить из метода экземпляра process.getCreationTime () глобального объекта Process, и он ведет себя точно так же. Для получения более подробной информации о параметре CreationTime и его поведение, обратитесь к статье: Process Object в ElectronJS.
     Примечание: Поскольку PID может быть повторно использован снова ОСАМИ после процесса штампов, полезно использовать как ПИД - параметр и параметр CreationTime однозначно идентифицировать и отличать процесс.
  •  memory Этот параметр возвращает объект MemoryInfo, который представляет информацию о памяти процесса. Этот объект состоит из подробной информации о памяти, используемой процессом в реальной физической оперативной памяти. Он состоит из следующих параметров.
    •  workingSetSize: Integer Этот параметр представляет объем памяти, закрепленной в данный момент процессом в физической оперативной памяти .
    •  peakWorkingSetSize: Integer Этот параметр представляет максимальный объем памяти, который когда-либо был прикреплен процессом к фактической физической ОЗУ.
    •  privateBytes: Integer (Необязательно) Этот параметр поддерживается только в ОС Windows. Этот параметр представляет объем памяти, не совместно используемый другими процессами, такими как куча памяти ядра V8 или содержимое HTML.
  •  sandboxed: Boolean (Необязательно) Этот параметр поддерживается только в Windows и macOS. Этот параметр указывает, изолирован ли процесс на уровне ОС.
  •  IntegrityLevel: String (Необязательно) Этот параметр поддерживается только в ОС Windows. Этот параметр может содержать любое из следующих значений:
    •  ненадежный
    •  низкий
    •  Средняя
    •  высокая
    •  неизвестный
Метод экземпляра app.getGPUFeatureStatus () модуля приложения возвращает объект GPUFeatureStatus. Этот объект представляет состояние графической функции графического процессора на странице chome: // gpu в браузере Chromium.
Примечание. Объект GPUFeatureStatus состоит из тех же параметров, что и на изображении выше. Значения, отображаемые для параметров объекта GPUFeatureStatus, имеют сокращенный формат и могут отличаться от того, что показано на изображении. Эти параметры могут содержать любое из следующих значений с соответствующими цветовыми кодами:
  •  disabled_software: Только желтое программное обеспечение. Аппаратное ускорение отключено.
  •  disabled_off: красный
  •  disabled_off_ok: желтый
  •  unavailable_software: только желтое ПО, аппаратное ускорение недоступно.
  •  unavailable_off: красный
  •  unavailable_off_ok: желтый
  •  enabled_readback: желтый Аппаратное ускорение, но с пониженной производительностью.
  •  enabled_force: зеленый Аппаратное ускорение на всех страницах.
  •  включено: Зеленый Аппаратное ускорение
  •  enabled_on: зеленый
  •  enabled_force_on: Green Force включен.
Метод экземпляра app.disableHardwareAcceleration () модуля приложения отключает аппаратное ускорение для всего приложения. Этот метод экземпляра можно использовать только до того, как будет сгенерировано событие готовности модуля приложения. Следовательно, этот метод необходимо вызывать в файле main.js (Main Process).
 javascript 



 const { app, BrowserWindow } = require( 'electron' )
 app.disableHardwareAcceleration();
 
В приложении Electron Chromium отключает трехмерные API-интерфейсы (например, WebGL) до перезапуска приложения для каждого домена, если процессы графического процессора выходят из строя слишком часто. Это поведение Chromium по умолчанию. Может быть множество причин, которые могут вызывать частые сбои процессов графического процессора, включая проблемы в аппаратном обеспечении системы или чрезмерное использование системных ресурсов. Метод экземпляра app.disableDomainBlockingFor3DAPIs () модуля приложения отключает это поведение Chromium по умолчанию. Этот метод экземпляра можно использовать только до того, как будет сгенерировано событие готовности модуля приложения. Следовательно, этот метод необходимо вызывать в файле main.js (Main Process).
 javascript 



 const { app, BrowserWindow } = require( 'electron' )
 app.disableHardwareAcceleration();
 app.disableDomainBlockingFor3DAPIs();
 
Метод экземпляра app.getGPUInfo (info) извлекает и возвращает информацию о графическом процессоре из Chromium, связанную с приложением Electron. Этот метод экземпляра возвращает обещание, и оно преобразуется в объект, содержащий соответствующую информацию, на основе предоставленного параметра info: String. Обратитесь к выходным данным для лучшего понимания. Параметр info может содержать любое из следующих значений:
  •  complete: возвращенное обещание выполняется с помощью объекта, содержащего всю информацию о графическом процессоре, как указано в официальной документации объекта Chromium GPUInfo. Сюда входит информация о версии и драйвере, которая отображается на странице chrome: // gpu браузера Chromium. Когда info: complete , метод Instance требует гораздо больше времени для выполнения по сравнению с info: basic . Обратитесь к Результату для лучшего понимания. 
 Информация о драйвере и версии графического процессора - 1 
 Информация о драйвере и версии графического процессора - 2
  •  basic: возвращаемое обещание выполняется с помощью объекта, содержащего только меньшее количество и более важных параметров, чем объект, возвращаемый при запросе с помощью info: complete . Это значение следует использовать , если только базовая информация , как VendorID параметр или driverId параметр необходим. Возвращенные параметры образца показаны ниже:
 {auxAttributes:
   {amdSwitchable: true,
     canSupportThreadedTextureMailbox: false,
     directComposition: false,
     directRendering: true,
     glResetNotificationStrategy: 0,
     inProcessGpu: правда,
     initializationTime: 0,
     jpegDecodeAcceleratorSupported: false,
     оптимус: ложь,
     passthroughCmdDecoder: ложь,
     песочница: false,
     softwareRendering: false,
     supportsOverlays: false,
     videoDecodeAcceleratorFlags: 0},
gpuDevice:
   [{active: true, deviceId: 26657, vendorId: 4098},
     {active: false, deviceId: 3366, vendorId: 32902}],
machineModelName: 'MacBookPro',
machineModelVersion: '11 .5 '}


Модуль приложения генерирует следующие события экземпляра, связанные с графическим процессором .
  •  gpu-info-update: Event Это событие экземпляра генерируется всякий раз, когда происходит изменение какой-либо информации, связанной с графическим процессором, для различных процессов в приложении. В зависимости от использования, функциональности и количества процессов, активных в приложении, это событие экземпляра может генерироваться несколько раз.
  •  gpu-process-crashed: Событие Это событие экземпляра генерируется всякий раз, когда процесс GPU выходит из строя или прекращается собственной ОС. Это может привести к зависанию приложения, если его не обработать, и, следовательно, мы можем использовать это событие экземпляра, чтобы предпринять необходимые действия и сделать выход из приложения без ошибок. Это событие возвращает следующие параметры.
    •  event: Event Глобальный объект Event.
    •  kill: Boolean Этот параметр указывает, был ли процесс убит.
На этом этапе после запуска приложения Electron мы должны иметь возможность получать и отображать всю информацию, связанную с графическим процессором, в выводе консоли.
 Выход:
Примечание. Мы использовали метод JavaScript console.dir () для вывода и отображения объекта в окне консоли Chrome DevTools. Для отображения объектов этот метод предпочтительнее метода console.log () .
Для более подробной информации. См. Статью: Разница между console.dir и console.log.
            

                            

                    
                                            Node.js
                                            JavaScript
                                            HTML
                                    

                        

                
РЕКОМЕНДУЕМЫЕ СТАТЬИ

                

                                            

                            
Что такое тернарный оператор?

                            
23 Января, 2024

                        

                                            

                            
Ember.js Свойство содержимого ArrayProxy

                            
24 Февраля, 2023

                        

                                            

                            
Ошибка «Объект не определен» при попытке повернуть объект в three.js

                            
24 Февраля, 2023

                        

                                            

                            
Модель запросов Mongoose.deleteOne() API

                            
24 Февраля, 2023

                        

                                            

                            
Mongoose SchemaType.prototype.ref() API

                            
24 Февраля, 2023

                        

                                            

                            
Проверка мангуста

                            
24 Февраля, 2023

                        

                                            

                            
Moment.js Настройка эпох

                            
24 Февраля, 2023

                        

                                            

                            
Moment.js Настройка первого дня недели и первой недели года

                            
24 Февраля, 2023