Рекомендации с открытым исходным кодом | Повышение производительности JavaScript с помощью GPU.js

JavaScript Информация
Рекомендации с открытым исходным кодом | Повышение производительности JavaScript с помощью GPU.js

Вы когда-нибудь пытались запустить сложный расчет, но обнаруживали, что это занимает много времени и замедляет ваш процесс?

Есть много способов решить эту проблему, например, с помощью веб-воркеров или фоновых потоков. Графический процессор снимает вычислительную нагрузку с ЦП, предоставляя ЦП больше возможностей для обработки других процессов. Тем временем веб-воркер по-прежнему работает на ЦП, но в другом потоке.

В этом руководстве для начинающих мы покажем, как использоватьGPU.jsВыполняйте сложные математические вычисления и повышайте производительность приложений JavaScript.

Что такое GPU.js?

GPU.js — это библиотека ускорения JavaScript, созданная для Интернета, и Node.js для программирования общего назначения на графических процессорах (GPGPU), что позволяет передавать сложные и трудоемкие вычисления графическому процессору, а не центральному процессору. Обеспечивает более быстрые вычисления и операции. Есть и альтернативный вариант: при отсутствии в системе GPU эти функции все равно будут работать на обычном движке JavaScript.

Когда вы собираетесь выполнять сложные вычисления, вы, по сути, перекладываете эту нагрузку на системный графический процессор, а не на центральный процессор, увеличивая скорость и время обработки.

Высокопроизводительные вычисления — одно из основных преимуществ использования GPU.js. Если вы хотите выполнять параллельные вычисления в браузере и не знаете WebGL, то GPU.js — библиотека для вас.

Зачем использовать GPU.js

Причин, по которым вам следует использовать GPU для выполнения сложных вычислений, бесконечно много, их слишком много, чтобы охватить в одной статье. Вот некоторые из наиболее заметных преимуществ использования графического процессора.

  • Графические процессоры можно использовать для выполнения массовых параллельных вычислений GPGPU. Это тип вычислений, которые необходимо выполнять асинхронно.
  • Он изящно возвращается к JavaScript, когда в системе нет графического процессора.
  • Графические процессоры в настоящее время работают в браузерах и Node.js и отлично подходят для ускорения веб-сайтов с тяжелыми вычислениями.
  • GPU.js был создан с учетом JavaScript, поэтому эти функции используют допустимый синтаксис JavaScript.

Если вы считаете, что ваш процессор справляется с этой задачей и вам не нужен GPU.js, взгляните на результат выполнения вычислений на GPU и CPU ниже.

Как видите, GPU в 22,97 раза быстрее, чем CPU.

Как работает GPU.js

Учитывая такой уровень скорости, экосистема JavaScript, кажется, начинает летать на ракете. Графические процессоры могут помочь веб-сайтам загружаться быстрее, особенно тем, которые должны выполнять сложные вычисления на главной странице. Вам больше не нужно беспокоиться об использовании фоновых потоков и загрузчиков, поскольку графические процессоры выполняют вычисления в 22,97 раза быстрее, чем обычные ЦП.

gpu.createKernelсоздает ядро ​​с ускорением на графическом процессоре, портированное из функции JavaScript.

Запуск функций ядра параллельно с графическим процессором приводит к более быстрым вычислениям — в 1-15 раз быстрее, в зависимости от вашего оборудования.

Начало работы с GPU.js

Чтобы показать, как сложные вычисления можно выполнять быстрее с помощью GPU.js, давайте быстро запустим практическую демонстрацию.

Установить

sudo apt install mesa-common-dev libxi-dev  // using Linux

npm

npm install gpu.js --save
// OR
yarn add gpu.js

Импортируйте GPU.js в свой проект Node.

import { GPU } from ('gpu.js')

// OR
const { GPU } = require('gpu.js')

const gpu = new GPU();

Демонстрация умножения

В приведенном ниже примере вычисления выполняются параллельно на графическом процессоре.

Во-первых, сгенерируйте много данных.

const getArrayValues = () => {

  // 在此处创建2D arrary
  const values = [[], []]

  // 将值插入第一个数组
  for (let y = 0; y < 600; y++){
    values[0].push([])
    values[1].push([])

    // 将值插入第二个数组
    for (let x = 0; x < 600; x++){
      values\[0\][y].push(Math.random())
      values\[1\][y].push(Math.random())
    }
  }

  // 返回填充数组
  return values
}

Создайте ядро ​​(другое слово для функции, которая работает на графическом процессоре).

const gpu = new GPU();

// 使用 `createKernel()` 方法将数组相乘
const multiplyLargeValues = gpu.createKernel(function(a, b) {
  let sum = 0;
  for (let i = 0; i < 600; i++) {
    sum += a\[this.thread.y\][i] * b\[i\][this.thread.x];
  }
  return sum;
}).setOutput([600, 600])

Вызов ядра с матрицей в качестве аргумента.

const largeArray = getArrayValues()
const out = multiplyLargeValues(largeArray[0], largeArray[1])

выход

console.log(out\[y\][x]) // 将元素记录在数组的第x行和第y列
console.log(out\[10\][12]) // 记录输出数组第10行和第12列的元素

Запустите тесты графического процессора

вы можете следоватьGitHubЗапустите тест с шагами, указанными выше.

npm install @gpujs/benchmark

const benchmark = require('@gpujs/benchmark')

const benchmarks = benchmark.benchmark(options);

optionsОбъект содержит различные конфигурации, которые можно передать тесту.

Зайдите на официальный веб-сайт GPU.js, чтобы увидеть полные вычислительные тесты, которые помогут вам понять, какую скорость вы можете получить с помощью GPU.js для сложных вычислений.

конец

В этом руководстве мы подробно изучили GPU.js, проанализировали, как он работает, и продемонстрировали, как выполнять параллельные вычисления. Мы также продемонстрировали, как настроить GPU.js в вашем приложении Node.js.

оригинал:blog.zhangbing.site
источник:blog.logrocket.com
Автор: Соломон Эсэме

Серия рекомендаций с открытым исходным кодом

Категории