راهاندازی یک محیط آزمایشی ثابت با پردازندههای گرافیکی میتواند سختتر از حد انتظار باشد. در اینجا مراحل آزمایش مدلهای هوش مصنوعی مبتنی بر مرورگر در سمت مشتری در محیطهای مرورگر واقعی، در حالی که مقیاسپذیر، خودکار و در یک راهاندازی سختافزار استاندارد شده شناخته شده هستند، آمده است.
در این مثال، مرورگر یک مرورگر کروم واقعی با پشتیبانی سخت افزاری است، برخلاف شبیه سازی نرم افزاری.
چه یک توسعهدهنده هوش مصنوعی وب، بازیهای وب، یا توسعهدهنده گرافیک باشید یا به آزمایش مدل هوش مصنوعی وب علاقهمند باشید، این راهنما برای شما مناسب است.
مرحله 1: یک نوت بوک Google Colab جدید ایجاد کنید
1. برای ایجاد یک نوت بوک جدید Colab به colab.new بروید. باید شبیه شکل 1 به نظر برسد. 2. برای ورود به حساب Google خود دستور را دنبال کنید.مرحله 2: به یک سرور مجهز به GPU T4 متصل شوید
- روی Connect نزدیک سمت راست بالای نوت بوک کلیک کنید.
- تغییر نوع زمان اجرا را انتخاب کنید:
- در پنجره مودال، T4 GPU را به عنوان شتاب دهنده سخت افزاری خود انتخاب کنید. هنگام اتصال، Colab از یک نمونه لینوکس با GPU NVIDIA T4 متصل استفاده می کند.
- روی ذخیره کلیک کنید.
- برای اتصال به زمان اجرا روی دکمه Connect کلیک کنید. پس از مدتی، دکمه یک علامت سبز به همراه نمودارهای استفاده از رم و دیسک را نشان می دهد. این نشان می دهد که یک سرور با موفقیت با سخت افزار مورد نیاز شما ایجاد شده است.
کار خوبی بود، شما به تازگی یک سرور با 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
روی
کنار سلول کلیک کنید تا کد اجرا شود.پس از اتمام اجرای کد، تأیید کنید که
nvidia-smi
چیزی مشابه تصویر زیر را چاپ کرده است تا مطمئن شوید که واقعاً یک GPU متصل شدهاید و در سرور شما شناسایی شده است. ممکن است لازم باشد برای مشاهده این خروجی به قسمت قبلی در گزارشها بروید.
مرحله 4: از کروم بدون هد استفاده و خودکارسازی کنید
- برای افزودن سلول کد جدید روی دکمه کد کلیک کنید.
- سپس می توانید کد سفارشی خود را برای فراخوانی یک پروژه Node.js با پارامترهای دلخواه خود بنویسید (یا فقط
google-chrome-stable
مستقیماً در خط فرمان تماس بگیرید). ما برای هر دو زیر مثال داریم.
قسمت A: از Headless 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
در مثال، ما پیدیاف حاصل را در /content/gpu.pdf
ذخیره کردیم. برای مشاهده آن فایل، محتوا را گسترش دهید. سپس روی کلیک کنید تا فایل PDF را در دستگاه محلی خود دانلود کنید.
قسمت B: فرمان Chrome با Puppeteer
ما یک مثال مینیمالیستی با استفاده از Puppeteer برای کنترل Headless 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 را وارد کنید. این به شما امکان می دهد Chrome را از راه دور با Node.js کنترل کنید:
import puppeteer from 'puppeteer';
سپس بررسی کنید که چه آرگومان های خط فرمان به برنامه Node ارسال شده است. اطمینان حاصل کنید که آرگومان سوم تنظیم شده است - که نشان دهنده یک URL برای پیمایش است. شما باید آرگومان سوم را در اینجا بررسی کنید زیرا دو آرگومان اول خود Node و اسکریپتی را که در حال اجرا هستیم صدا می کنند. عنصر سوم در واقع شامل اولین پارامتر ارسال شده به برنامه Node است:
const url = process.argv[2];
if (!url) {
throw "Please provide a URL as the first argument";
}
اکنون یک تابع ناهمزمان با نام runWebpage()
تعریف کنید. این یک شی مرورگر ایجاد میکند که با آرگومانهای خط فرمان پیکربندی شده است تا باینری کروم را به روشی که ما نیاز داریم تا WebGL و WebGPU را همانطور که در Enable 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
گوش دهد. این به شما امکان می دهد پیام ها را در خط فرمان Node ثبت کنید و همچنین متن کنسول را برای یک عبارت خاص (در این مورد captureAndEnd
) بررسی کنید که یک اسکرین شات را ایجاد می کند و سپس فرآیند مرورگر را در Node پایان می دهد. این برای صفحات وب که نیاز به انجام مقداری کار قبل از گرفتن اسکرین شات دارند مفید است و زمان اجرا غیر قطعی دارد.
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();
بسته.json را اصلاح کنید
شاید متوجه شده باشید که ما از دستور import در ابتدای فایل 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، ارتباط برنامهریزی با Chrome را آسانتر میکند.
موفقیت
اکنون میتوانیم تأیید کنیم که طبقهبندیکننده TensorFlow.js Fashion MNIST میتواند به درستی یک جفت شلوار را در یک تصویر، با پردازش سمت کلاینت در مرورگر با استفاده از GPU تشخیص دهد.
میتوانید از این برای هر بار کاری مبتنی بر GPU سمت مشتری، از مدلهای یادگیری ماشین گرفته تا آزمایشهای گرافیکی و بازیها استفاده کنید.
منابع
برای دریافت بهروزرسانیهای آینده ، یک ستاره به مخزن GitHub اضافه کنید .
،راهاندازی یک محیط آزمایشی ثابت با پردازندههای گرافیکی میتواند سختتر از حد انتظار باشد. در اینجا مراحل آزمایش مدلهای هوش مصنوعی مبتنی بر مرورگر در سمت مشتری در محیطهای مرورگر واقعی، در حالی که مقیاسپذیر، خودکار و در یک راهاندازی سختافزار استاندارد شده شناخته شده هستند، آمده است.
در این مثال، مرورگر یک مرورگر کروم واقعی با پشتیبانی سخت افزاری است، برخلاف شبیه سازی نرم افزاری.
چه یک توسعهدهنده هوش مصنوعی وب، بازیهای وب، یا توسعهدهنده گرافیک باشید یا به آزمایش مدل هوش مصنوعی وب علاقهمند باشید، این راهنما برای شما مناسب است.
مرحله 1: یک نوت بوک Google Colab جدید ایجاد کنید
1. برای ایجاد یک نوت بوک جدید Colab به colab.new بروید. باید شبیه شکل 1 به نظر برسد. 2. برای ورود به حساب Google خود دستور را دنبال کنید.مرحله 2: به یک سرور مجهز به GPU T4 متصل شوید
- روی Connect نزدیک سمت راست بالای نوت بوک کلیک کنید.
- تغییر نوع زمان اجرا را انتخاب کنید:
- در پنجره مودال، T4 GPU را به عنوان شتاب دهنده سخت افزاری خود انتخاب کنید. هنگام اتصال، Colab از یک نمونه لینوکس با GPU NVIDIA T4 متصل استفاده می کند.
- روی ذخیره کلیک کنید.
- برای اتصال به زمان اجرا روی دکمه Connect کلیک کنید. پس از مدتی، دکمه یک علامت سبز به همراه نمودارهای استفاده از رم و دیسک را نشان می دهد. این نشان می دهد که یک سرور با موفقیت با سخت افزار مورد نیاز شما ایجاد شده است.
کار خوبی بود، شما به تازگی یک سرور با 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
روی
کنار سلول کلیک کنید تا کد اجرا شود.پس از اتمام اجرای کد، تأیید کنید که
nvidia-smi
چیزی مشابه تصویر زیر را چاپ کرده است تا مطمئن شوید که واقعاً یک GPU متصل شدهاید و در سرور شما شناسایی شده است. ممکن است لازم باشد برای مشاهده این خروجی به قسمت قبلی در گزارشها بروید.
مرحله 4: از کروم بدون هد استفاده و خودکارسازی کنید
- برای افزودن سلول کد جدید روی دکمه کد کلیک کنید.
- سپس می توانید کد سفارشی خود را برای فراخوانی یک پروژه Node.js با پارامترهای دلخواه خود بنویسید (یا فقط
google-chrome-stable
مستقیماً در خط فرمان تماس بگیرید). ما برای هر دو نمونه زیر داریم.
قسمت A: از Headless 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
در مثال، ما پیدیاف حاصل را در /content/gpu.pdf
ذخیره کردیم. برای مشاهده آن فایل، محتوا را باز کنید. سپس روی کلیک کنید تا فایل PDF را در دستگاه محلی خود دانلود کنید.
قسمت B: فرمان Chrome با Puppeteer
ما یک مثال مینیمالیستی با استفاده از Puppeteer برای کنترل Headless 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 را وارد کنید. این به شما امکان می دهد Chrome را از راه دور با Node.js کنترل کنید:
import puppeteer from 'puppeteer';
سپس بررسی کنید که چه آرگومان های خط فرمان به برنامه Node ارسال شده است. اطمینان حاصل کنید که آرگومان سوم تنظیم شده است - که نشان دهنده یک URL برای پیمایش است. شما باید آرگومان سوم را در اینجا بررسی کنید زیرا دو آرگومان اول خود Node و اسکریپتی را که در حال اجرا هستیم صدا می کنند. عنصر سوم در واقع شامل اولین پارامتر ارسال شده به برنامه Node است:
const url = process.argv[2];
if (!url) {
throw "Please provide a URL as the first argument";
}
اکنون یک تابع ناهمزمان با نام runWebpage()
تعریف کنید. این یک شی مرورگر ایجاد میکند که با آرگومانهای خط فرمان پیکربندی شده است تا باینری کروم را به روشی که ما نیاز داریم تا WebGL و WebGPU را همانطور که در Enable 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
گوش دهد. این به شما امکان می دهد پیام ها را در خط فرمان Node ثبت کنید و همچنین متن کنسول را برای یک عبارت خاص (در این مورد captureAndEnd
) بررسی کنید که یک اسکرین شات را ایجاد می کند و سپس فرآیند مرورگر را در Node پایان می دهد. این برای صفحات وب که نیاز به انجام مقداری کار قبل از گرفتن اسکرین شات دارند مفید است و زمان اجرا غیر قطعی دارد.
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();
بسته.json را اصلاح کنید
شاید متوجه شده باشید که ما از دستور import در ابتدای فایل 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، ارتباط برنامهریزی با Chrome را آسانتر میکند.
موفقیت
اکنون میتوانیم تأیید کنیم که طبقهبندیکننده TensorFlow.js Fashion MNIST میتواند به درستی یک جفت شلوار را در یک تصویر، با پردازش سمت کلاینت در مرورگر با استفاده از GPU تشخیص دهد.
میتوانید از این برای هر بار کاری مبتنی بر GPU سمت مشتری، از مدلهای یادگیری ماشین گرفته تا آزمایشهای گرافیکی و بازیها استفاده کنید.
منابع
برای دریافت بهروزرسانیهای آینده ، یک ستاره به مخزن GitHub اضافه کنید .