이 페이지는 Cloud Translation API를 통해 번역되었습니다.

Google Colab에서 웹 AI 모델 테스트하기

Jason Mayes

François Beaufort

GPU로 일관된 테스트 환경을 설정하는 것은 다른 것보다 더 어려울 수 있습니다. 있습니다. Google Cloud에서 클라이언트 측 브라우저 기반 AI 모델을 테스트하는 단계는 다음과 같습니다 확장 가능하고 자동화되며 알려진 표준 하드웨어 설정입니다.

이 경우 브라우저는 하드웨어를 지원하는 실제 Chrome 브라우저입니다. 소프트웨어 에뮬레이션과는 대조적입니다

웹 AI, 웹 게임, 그래픽 개발자이신가요? 아니면 평범한 사람이든 웹 AI 모델 테스트에 관심이 있다면 이 가이드가 도움이 될 것입니다.

1단계: 새 Google Colab 노트북 만들기

1. colab.new로 이동하여 새 Colab 노트북을 만드세요. 그림 1과 같이 표시됩니다. 2. 안내에 따라 Google 계정에 로그인합니다. <ph type="x-smartling-placeholder">

2단계: T4 GPU 지원 서버에 연결하기

노트북 오른쪽 상단에 있는 연결 을 클릭합니다.
런타임 유형 변경을 선택합니다. <ph type="x-smartling-placeholder">
</ph>
그림 2. Colab 인터페이스에서 런타임을 변경하세요.

를 통해 개인정보처리방침을 정의할 수 있습니다.
모달 창에서 하드웨어 가속기로 T4 GPU를 선택합니다. 연결되면 Colab에서 NVIDIA T4 GPU가 연결된 Linux 인스턴스를 사용합니다. <ph type="x-smartling-placeholder">
</ph> 더 강력한 GPU 옵션이 제공되지만 (V100 GPU도 작동하는 것으로 확인됨) 해당 옵션을 구매해야 합니다.
를 통해 개인정보처리방침을 정의할 수 있습니다. <ph type="x-smartling-placeholder">
</ph> <ph type="x-smartling-placeholder"></ph>
그림 3: 하드웨어 가속기에서 T4 GPU를 선택합니다.
저장을 클릭합니다.
연결 버튼을 클릭하여 런타임에 연결합니다. 어느 정도 시간이 지나면 RAM 및 디스크 사용량 그래프와 함께 녹색 체크표시가 나타납니다. 이는 필요한 사용할 수 있습니다

수고하셨습니다. GPU가 연결된 서버를 만들었습니다.

3단계: 올바른 드라이버 및 종속 항목 설치

다음 두 줄의 코드를 복사하여 살펴보겠습니다 Colab 환경에서는 명령줄 실행 앞에 느낌표가 들어갑니다.

!git clone https://github.com/jasonmayes/headless-chrome-nvidia-t4-gpu-support.git
!cd headless-chrome-nvidia-t4-gpu-support && chmod +x scriptyMcScriptFace.sh && ./scriptyMcScriptFace.sh

GitHub에서 스크립트를 검사할 수 있습니다. 이 스크립트가 실행하는 원시 명령줄 코드를 확인할 수 있습니다.

# Update, install correct drivers, and remove the old ones.
apt-get install -y vulkan-tools libnvidia-gl-525

# Verify NVIDIA drivers can see the T4 GPU and that vulkan is working correctly.
nvidia-smi
vulkaninfo --summary

# Now install latest version of Node.js
npm install -g n
n lts
node --version
npm --version

# Next install Chrome stable
curl -fsSL https://dl.google.com/linux/linux_signing_key.pub | sudo gpg --dearmor -o /usr/share/keyrings/googlechrom-keyring.gpg
echo "deb [arch=amd64 signed-by=/usr/share/keyrings/googlechrom-keyring.gpg] http://dl.google.com/linux/chrome/deb/ stable main" | sudo tee /etc/apt/sources.list.d/google-chrome.list
sudo apt update
sudo apt install -y google-chrome-stable

# Start dbus to avoid warnings by Chrome later.
export DBUS_SESSION_BUS_ADDRESS="unix:path=/var/run/dbus/system_bus_socket"
/etc/init.d/dbus start

다음 작업을 수행하려면 셀 옆의 버튼을 클릭하세요. 코드를 실행할 수 있습니다
<ph type="x-smartling-placeholder">
</ph>
그림 4.
코드 실행이 완료되면 nvidia-smi가 무언가를 출력했는지 확인합니다. 다음 스크린샷과 유사하게 GPU가 실제로 있는지 확인합니다. 서버에서 인식됩니다 이전 항목으로 스크롤해야 할 수도 있습니다. 클릭하여 이 출력을 확인합니다.
<ph type="x-smartling-placeholder">
</ph>
그림 5: 'NVIDIA-SMI'로 시작하는 출력을 찾습니다.

4단계: 헤드리스 Chrome 사용 및 자동화

Code 버튼을 클릭하여 새로 추가합니다. 코드 셀입니다.
그런 다음 커스텀 코드를 작성하여 다음 명령어로 Node.js 프로젝트를 호출할 수 있습니다. 선호하는 매개변수 (또는 google-chrome-stable 명령줄에서). 다음 두 가지 예가 나와 있습니다.

파트 A: 명령줄에서 직접 헤드리스 Chrome 사용

# Directly call Chrome to dump a PDF of WebGPU testing page
# and store it in /content/gpu.pdf
!google-chrome-stable \
--no-sandbox \
--headless=new \
--use-angle=vulkan \
--enable-features=Vulkan \
--disable-vulkan-surface \
--enable-unsafe-webgpu \
--print-to-pdf=/content/gpu.pdf https://webgpureport.org

이 예에서는 결과 PDF 캡처를 /content/gpu.pdf에 저장했습니다. 받는사람 파일을 보려면 콘텐츠 를 펼칩니다. 그런 다음 버튼을 클릭하여 PDF를 다운로드하세요. 업로드할 수 있습니다

파트 B: Puppeteer로 Chrome 명령하기

Puppeteer를 사용하여 헤드리스 Chrome을 제어하는 미니멀한 예시를 제공했습니다. 다음과 같이 실행할 수 있습니다.

# Call example node.js project to perform any task you want by passing
# a URL as a parameter
!node headless-chrome-nvidia-t4-gpu-support/examples/puppeteer/jPuppet.js chrome://gpu

jPuppet 예제에서 Node.js 스크립트를 호출하여 있습니다. 어떻게 작동하는 것일까요? 이 Node.js 안내 살펴보기 코드 입력 jPuppet.js).

jPuppet.js 노드 코드 분석

먼저 Puppeteer를 가져옵니다. 이를 통해 Node.js를 사용하여 Chrome을 원격으로 제어할 수 있습니다.

import puppeteer from 'puppeteer';

다음으로 노드 애플리케이션에 어떤 명령줄 인수가 전달되었는지 확인합니다. 이동할 URL을 나타내는 세 번째 인수가 설정되었는지 확인합니다. 나 여기서 세 번째 인수를 검사해야 합니다. 처음 두 인수는 실행 중인 스크립트가 있습니다 세 번째 요소는 실제로 첫 번째 요소가 포함되어 있고 매개변수가 노드 프로그램에 전달됩니다.

const url = process.argv[2];
if (!url) {
  throw "Please provide a URL as the first argument";
}

이제 runWebpage()라는 비동기 함수를 정의합니다. 이렇게 하면 브라우저가 생성됩니다. 명령줄 인수로 구성된 객체입니다. 앞서 설명한 대로 WebGL 및 WebGPU가 작동하도록 하는 데 필요한 방식으로 바이너리를 WebGPU 및 WebGL 지원을 사용 설정합니다.

async function runWebpage() {
  const browser = await puppeteer.launch({
    headless: 'new',
    args:  [
        '--no-sandbox',
        '--headless=new',
        '--use-angle=vulkan',
        '--enable-features=Vulkan',
        '--disable-vulkan-surface',
        '--enable-unsafe-webgpu'
      ]
  });

나중에 URL을 방문하는 데 사용할 수 있는 새 브라우저 페이지 객체를 만듭니다.

const page = await browser.newPage();

그런 다음 웹페이지가 로드될 때 console.log 이벤트를 수신 대기하는 이벤트 리스너를 추가합니다. 는 JavaScript를 실행합니다. 이를 통해 노드 명령줄에서 메시지를 로깅할 수 있습니다. 또한 콘솔 텍스트에 특수 구문이 있는지 검사합니다 (이 경우에는 captureAndEnd)를 호출하여 스크린샷을 트리거하고 다음 위치에서 브라우저 프로세스를 종료합니다. 노드. 이는 이전에 몇 가지 작업을 해야 하는 웹페이지에 유용합니다. 스크린샷을 찍을 수 있어야 하고 실행할 수 있습니다

page.on('console', async function(msg) {
  console.log(msg.text());
  if (msg.text() === 'captureAndEnd') {
    await page.screenshot({ path: '/content/screenshotEnd.png' });
    await browser.close();
  }
});

마지막으로, 지정된 URL을 방문하여 초기 스크린샷이 표시됩니다.

chrome://gpu의 스크린샷을 찍으려면 브라우저를 닫으세요. 콘솔 출력을 기다리지 않고 즉시 세션을 실행합니다 제어할 수 없습니다.

  await page.goto(url,  { waitUntil: 'networkidle2' });
  await page.screenshot({path: '/content/screenshot.png'});
  if (url === 'chrome://gpu') {
    await browser.close();
  }
}
runWebpage();

package.json 수정

다만 jPuppet.js 파일. package.json가 유형 값을 module로 설정해야 합니다. 모듈이 유효하지 않다는 오류가 표시됩니다.

 {
    "dependencies":  {
      "puppeteer": "*"
    },
    "name": "content",
    "version": "1.0.0",
    "main": "jPuppet.js",
    "devDependencies": {},
    "keywords": [],
    "type": "module",
    "description": "Node.js Puppeteer application to interface with headless Chrome with GPU support to capture screenshots and get console output from target webpage"
}

그러면 끝입니다. Puppeteer를 사용하면 더 쉽게 인터페이스할 수 있습니다. 할 수 있습니다.

성공

이제 TensorFlow.js Fashion MNIST 분류기 이미지에서 바지를 정확하게 인식할 수 있습니다. GPU를 사용하여 브라우저에서 데이터를 처리합니다.

이 옵션은 머신러닝부터 GPU까지 모든 클라이언트 측 GPU 기반 워크로드에 모델을 그래픽 및 게임 테스트에 적용하는 것입니다.

리소스

GitHub 저장소에 별표 추가 향후 업데이트를 받을 수 있습니다.