Kiểm thử mô hình AI cho web trong Google Colab

François Beaufort
François Beaufort

Thiết lập môi trường thử nghiệm nhất quán với GPU có thể khó hơn như dự kiến. Sau đây là các bước kiểm thử mô hình AI phía máy khách, dựa trên trình duyệt trong môi trường trình duyệt thực tế, đồng thời vẫn có thể mở rộng, tự động điều chỉnh và các thiết lập phần cứng chuẩn hoá và đã biết.

Trong trường hợp này, trình duyệt là trình duyệt Chrome thực sự có hỗ trợ phần cứng, thay vì mô phỏng phần mềm.

Cho dù bạn là trí tuệ nhân tạo cho web, nhà phát triển trò chơi trên web hay nhà phát triển đồ hoạ, hoặc bạn là chính mình bạn quan tâm đến việc kiểm thử mô hình AI (trí tuệ nhân tạo) trên web, thì đây là hướng dẫn dành cho bạn.

Bước 1: Tạo một sổ tay Google Colab mới

1. Truy cập vào colab.new để tạo một sổ tay Colab mới. Biểu đồ này sẽ trông giống như hình 1. 2. Làm theo lời nhắc để đăng nhập vào Tài khoản Google của bạn.
Ảnh chụp màn hình về một Colab mới
Hình 1: Một sổ tay mới trên Colab.

Bước 2: Kết nối với máy chủ hỗ trợ GPU T4

  1. Nhấp vào biểu tượng Kết nối ở gần phía trên cùng bên phải của sổ tay.
  2. Chọn Thay đổi loại thời gian chạy:
    Ảnh chụp màn hình cận cảnh các bước để thay đổi thời gian chạy.
    Hình 2. Thay đổi môi trường thời gian chạy trong giao diện Colab.
  3. Trong cửa sổ phụ, hãy chọn T4 GPU làm trình tăng tốc phần cứng. Khi bạn kết nối, Colab sẽ sử dụng một phiên bản Linux có kết nối với GPU NVIDIA T4.
    Ảnh chụp màn hình mô-đun Thay đổi loại thời gian chạy.
    Hình 3: Trong phần Hardware tăng tốc, chọn GPU T4.
  4. Nhấp vào Lưu.
  5. Nhấp vào nút Connect (Kết nối) để kết nối với môi trường thời gian chạy của bạn. Sau một thời gian, sẽ hiển thị dấu kiểm màu xanh lục, cùng với đồ thị sử dụng RAM và ổ đĩa. Biểu tượng này cho biết rằng một máy chủ đã được tạo thành công cùng với yêu cầu của bạn phần cứng.

Tuyệt vời, bạn vừa tạo một máy chủ có gắn GPU.

Bước 3: Cài đặt đúng trình điều khiển và phần phụ thuộc

  1. Sao chép và dán hai dòng mã sau vào ô chứa mã đầu tiên của sổ tay đó. Trong môi trường Colab, quá trình thực thi dòng lệnh sẽ được thêm vào trước một dấu chấm than.

    !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
    
    # 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
    
  2. Nhấp vào bên cạnh ô để thực thi mã.

    Ảnh chụp màn hình về một Colab mới
    Hình 4.

  3. Sau khi thực thi mã xong, hãy xác minh rằng nvidia-smi đã in nội dung nào đó tương tự như ảnh chụp màn hình sau đây để xác nhận rằng bạn thực sự có GPU được đính kèm và mã này được nhận dạng trên máy chủ của bạn. Bạn có thể cần phải di chuyển đến trong nhật ký để xem kết quả này.

    Hình 5: Tìm dữ liệu đầu ra bắt đầu bằng "NVIDIA-SMI".

Bước 4: Sử dụng và tự động hoá Chrome không có giao diện người dùng

  1. Nhấp vào nút để thêm mã mới ô chứa mã.
  2. Sau đó, bạn có thể viết mã tuỳ chỉnh để gọi dự án Node.js bằng tham số ưu tiên (hoặc chỉ cần gọi google-chrome-stable trực tiếp trong dòng lệnh). Chúng tôi có ví dụ cho cả hai trường hợp sau.

Phần A: Sử dụng Chrome không có giao diện người dùng ngay trong dòng lệnh

# 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

Trong ví dụ này, chúng ta lưu trữ kết quả ảnh chụp PDF trong /content/gpu.pdf. Người nhận khung hiển thị tệp đó, hãy mở rộng nội dung . Sau đó, nhấp vào để tải tệp PDF xuống vào máy cục bộ của bạn.

Ảnh chụp màn hình về một Colab mới
Hình 6: Xem các bước để tải tệp PDF xuống trong ảnh chụp màn hình giao diện Colab này.

Phần B: Dùng lệnh cho Chrome bằng Puppeteer

Chúng tôi đã cung cấp một ví dụ tối giản về việc sử dụng Puppeteer để kiểm soát Headless Chrome có thể chạy như sau:

# 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

Trong ví dụ về jPuppet, chúng ta có thể gọi tập lệnh Node.js để tạo một ảnh chụp màn hình. Nhưng tính năng này hoạt động như thế nào? Hãy xem hướng dẫn về Node.js mã ở jPuppet.js.

Phân tích mã Nút jPuppet.js

Trước tiên, hãy nhập Puppeteer. Điều này cho phép bạn kiểm soát Chrome từ xa bằng Node.js:

import puppeteer from 'puppeteer';

Tiếp theo, hãy kiểm tra xem những đối số dòng lệnh nào đã được chuyển đến ứng dụng Nút. Đảm bảo đặt đối số thứ ba — đại diện cho URL cần điều hướng đến. Bạn cần kiểm tra đối số thứ ba tại đây vì hai đối số đầu tiên gọi Nút và tập lệnh chúng tôi đang chạy. Phần tử thứ 3 thực sự chứa phần tử đầu tiên được truyền đến chương trình Nút:

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

Bây giờ, hãy định nghĩa một hàm không đồng bộ có tên là runWebpage(). Thao tác này sẽ tạo một trình duyệt đối tượng được định cấu hình bằng các đối số dòng lệnh để chạy Chrome theo cách chúng ta cần để WebGL và WebGPU hoạt động như mô tả trong Bật tính năng hỗ trợ WebGPU và 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'
      ]
  });

Tạo đối tượng trang trình duyệt mới mà sau này bạn có thể sử dụng để truy cập bất kỳ URL nào:

const page = await browser.newPage();

Sau đó, hãy thêm một trình nghe sự kiện để theo dõi các sự kiện console.log khi trang web thực thi JavaScript. Việc này cho phép bạn ghi nhật ký thông điệp trên dòng lệnh Nút và cũng kiểm tra văn bản trên bảng điều khiển để tìm cụm từ đặc biệt (trong trường hợp này, captureAndEnd) kích hoạt ảnh chụp màn hình và sau đó kết thúc quá trình của trình duyệt trong Nút. Điều này sẽ hữu ích cho các trang web cần thực hiện một số công việc trước khi chỉ chụp được ảnh màn hình và có khoảng thời gian không xác định thực thi.

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

Cuối cùng, lệnh cho trang truy cập URL đã chỉ định và lấy ảnh chụp màn hình ban đầu khi trang đã tải.

Nếu chọn chụp ảnh màn hình của chrome://gpu thì bạn có thể đóng trình duyệt ngay lập tức thay vì đợi bất kỳ kết quả nào trên bảng điều khiển, vì trang này không được kiểm soát bằng mã của riêng bạn.

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

Sửa đổi package.json

Bạn có thể nhận thấy rằng chúng tôi đã sử dụng câu lệnh nhập ở đầu Tệp jPuppet.js. package.json của bạn phải đặt giá trị loại là module hoặc bạn sẽ nhận được thông báo lỗi mô-đun không hợp lệ.

 {
    "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"
}

Đó là tất cả những gì cần làm. Sử dụng Puppeteer giúp giao diện dễ dàng hơn bằng Chrome theo phương thức lập trình.

Thành công

Bây giờ, chúng ta có thể xác minh rằng Thuật toán phân loại MNIST của TensorFlow.js có thể nhận dạng chính xác một chiếc quần trong một hình ảnh, ở phía máy khách xử lý trong trình duyệt bằng GPU.

Bạn có thể dùng tính năng này cho mọi tải công việc dựa trên GPU phía máy khách, từ công nghệ học máy cho đến thử nghiệm đồ hoạ và trò chơi.

Ảnh chụp màn hình về một Colab mới
Hình 7: Chụp thành công mô hình TensorFlow.js được tăng tốc GPU có khả năng nhận dạng phía máy khách là quần áo trong trình duyệt theo thời gian thực

Tài nguyên

Thêm dấu sao trên kho lưu trữ GitHub để nhận các bản cập nhật trong tương lai.