GPU.js를 사용하여 JavaScript 애플리케이션 성능을 향상시키는 팁
- 青灯夜游앞으로
- 2021-02-04 15:23:272005검색
관련 권장 사항: "javascript 비디오 튜토리얼"
복잡한 계산을 실행하려고 했지만 시간이 오래 걸리고 프로세스 속도가 느려진 적이 있습니까?
이 문제를 해결하는 방법은 웹 작업자나 백그라운드 스레드를 사용하는 등 여러 가지가 있습니다. GPU는 CPU의 처리 부하를 줄이고 CPU에 다른 프로세스를 처리할 수 있는 더 많은 공간을 제공합니다. 그 사이에 웹 작업자는 여전히 CPU에서 실행되고 있지만 다른 스레드에서 실행됩니다.
이 초보자 가이드에서는 GPU.js를 사용하여 복잡한 수학 계산을 수행하고 JavaScript 애플리케이션의 성능을 향상시키는 방법을 보여줍니다.
GPU.js란 무엇인가요?
GPU.js는 그래픽 처리 장치(GPGPU)의 범용 프로그래밍을 위해 웹 및 Node.js용으로 구축된 JavaScript 가속 라이브러리입니다. 이를 통해 복잡하고 시간이 많이 소요되는 계산을 CPU 대신 GPU로 오프로드할 수 있습니다. 더 빠른 계산 및 작업. 대체 옵션도 있습니다. 시스템에 GPU가 없어도 이러한 기능은 일반 JavaScript 엔진에서 계속 실행됩니다.
복잡한 계산을 수행하려는 경우 기본적으로 이 부담을 CPU가 아닌 시스템의 GPU로 옮겨 처리 속도와 시간을 높입니다.
고성능 컴퓨팅은 GPU.js 사용의 주요 장점 중 하나입니다. 브라우저에서 병렬 컴퓨팅을 수행하고 싶지만 WebGL을 모른다면 GPU.js가 적합한 라이브러리입니다.
GPU.js를 사용하는 이유
복잡한 계산을 수행하기 위해 GPU를 사용해야 하는 이유는 셀 수 없이 많습니다. 한 기사에서 살펴보기에는 너무 많습니다. GPU 사용의 가장 주목할만한 이점은 다음과 같습니다.
- GPU는 대규모 병렬 GPGPU 계산을 수행하는 데 사용될 수 있습니다. 이는 비동기식으로 수행되어야 하는 계산 유형입니다.
- 시스템에 GPU가 없으면 우아하게 JavaScript로 돌아갑니다.
- GPU는 현재 브라우저와 Node.js에서 실행되며, 계산량이 많은 웹 사이트 속도를 높이는 데 적합합니다.
- GPU.js는 JavaScript를 염두에 두고 구축되었으므로 이러한 기능은 모두 합법적인 JavaScript 구문을 사용합니다.
프로세서가 해당 작업을 수행할 수 있다고 생각하면 GPU.js가 필요하지 않습니다. 이 GPU 및 CPU 실행 계산을 확인하세요. 아래 결과.
보시다시피 GPU는 CPU보다 22.97배 빠릅니다.
GPU.js의 작동 방식
이러한 속도 수준을 고려하면 JavaScript 생태계가 로켓을 타고 날아가는 것과 같습니다. GPU는 웹 사이트, 특히 홈페이지에서 복잡한 계산을 수행해야 하는 웹 사이트를 더 빠르게 로드하는 데 도움이 될 수 있습니다. GPU는 일반 CPU보다 22.97배 빠르게 계산을 실행할 수 있으므로 더 이상 백그라운드 스레드 및 로더 사용에 대해 걱정할 필요가 없습니다.
gpu.createKernel 메서드는 JavaScript 함수에서 포팅된 GPU 가속 커널을 생성합니다. gpu.createKernel 方法创建了一个从JavaScript函数移植过来的GPU加速内核。
与GPU并行运行内核函数会导致更快的计算速度——快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
在你的Node项目中要导入GPU.js。
import { GPU } from ('gpu.js')
// OR
const { GPU } = require('gpu.js')
const gpu = new GPU();
乘法演示
在下面的示例中，计算是在GPU上并行完成的。
首先，生成大量数据。
const getArrayValues = () => {
// 在此处创建2D arrary
const values = [[], []]
// 将值插入第一个数组
for (let y = 0; y <p>创建内核（运行在GPU上的函数的另一个词）。</p><pre class="brush:php;toolbar:false">const gpu = new GPU();
// 使用 `createKernel()` 方法将数组相乘
const multiplyLargeValues = gpu.createKernel(function(a, b) {
let sum = 0;
for (let i = 0; i <p>使用矩阵作为参数调用内核。</p><pre class="brush:php;toolbar:false">const largeArray = getArrayValues()
const out = multiplyLargeValues(largeArray[0], largeArray[1])输出
console.log(out\[y\][x]) // 将元素记录在数组的第x行和第y列 console.log(out\[10\][12]) // 记录输出数组第10行和第12列的元素
运行GPU基准测试
你可以按照GitHub上指定的步骤运行基准测试。
npm install @gpujs/benchmark
const benchmark = require('@gpujs/benchmark')
const benchmarks = benchmark.benchmark(options);options
rrreee첫째, 데이터를 많이 생성하세요.npm
rrreeeNode 프로젝트에 GPU.js를 가져옵니다.
rrreee곱셈 데모
아래 예에서는 계산이 GPU에서 병렬로 수행됩니다.
rrreee커널(GPU에서 실행되는 함수의 또 다른 단어)을 만듭니다. rrreee
행렬을 인수로 사용하여 커널을 호출합니다. 🎜rrreee🎜Output🎜rrreee🎜GPU 벤치마크 실행🎜🎜GitHub🎜에 지정된 지침을 따라 벤치마크를 실행할 수 있습니다. 🎜rrreee🎜options 개체에는 벤치마크에 전달할 수 있는 다양한 구성이 포함되어 있습니다. 🎜🎜공식 GPU.js 웹사이트로 이동하여 전체 컴퓨팅 벤치마크를 확인하세요. 이는 GPU.js를 사용하여 복잡한 계산에서 얼마나 많은 속도를 얻을 수 있는지 이해하는 데 도움이 됩니다. 🎜🎜The End🎜🎜이 튜토리얼에서는 GPU.js를 자세히 살펴보고, 작동 방식을 분석하고, 병렬 컴퓨팅을 수행하는 방법을 시연했습니다. 또한 Node.js 애플리케이션에서 GPU.js를 설정하는 방법도 시연했습니다. 🎜🎜🎜영어 원본 주소: https://blog.logrocket.com/improving-javascript-performance-with-gpu-js/🎜🎜저자: Solomon Eseme🎜🎜재인쇄 주소: https://blog.zhangbing.site/ 2020/11/30/improving-javascript-performance-with-gpu-js/🎜🎜🎜더 많은 컴퓨터 프로그래밍 관련 지식을 보려면 🎜프로그래밍 입문🎜을 방문하세요! ! 🎜위 내용은 GPU.js를 사용하여 JavaScript 애플리케이션 성능을 향상시키는 팁의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!