تعزيز اختبار نموذج الذكاء الاصطناعي (AI) للويب: WebGPU وWebG وChrome بلا واجهة مستخدم رسومية

Jason Mayes

François Beaufort

نحمل لك خبرًا سارًّا. لقد أنشأت تطبيقًا رائعًا للذكاء الاصطناعي على الويب التي تشغِّل نماذج التعلم الآلي مباشرةً على جهاز المستخدم. إنه يعمل بالكامل على متصفح الويب من جانب العميل، دون الاعتماد على السحابة. هذا على الجهاز فقط التصميم يحسّن خصوصية المستخدم ويعزز الأداء ويقلل التكاليف بشكل ملحوظ.

مع ذلك، هناك عقبة. يمكن أن يعمل نموذج TensorFlow.js على كل من وحدات المعالجة المركزية (CPU) (WebAssembly) ووحدات معالجة الرسومات الأكثر فعالية (من خلال WebGL و WebGPU). وهناك سؤالٌ مُلح هو: كيف يمكنك إجراء اختبار تلقائي للمتصفّح باستمرار باستخدام الأجهزة المحدّدة؟

الحفاظ على الاتساق أمر بالغ الأهمية لمقارنة نموذج تعلُّم الآلة الأداء بمرور الوقت أثناء تكرارها وتحسينها، قبل نشر المستخدمين في العالم الحقيقي لاستخدامها على أجهزتهم.

قد يكون إعداد بيئة اختبار متسقة باستخدام وحدات معالجة الرسومات أكثر صعوبة من متوقع. في مشاركة المدونة هذه، سنشارك المشاكل التي واجهناها وكيفية حلّها حتى تتمكن من تحسين أداء تطبيقك.

لا يقتصر الأمر على مطوّري برامج الذكاء الاصطناعي على الويب. إذا كنت تعمل في ألعاب الويب أو الرسومات، فهذه المشاركة ذات قيمة بالنسبة لك أيضًا.

محتوى مجموعة أدوات التشغيل الآلي

إليك الميزات التي نستخدمها:

• البيئة: Google Colab المستند إلى Linux دفتر ملاحظات متصل بوحدة NVIDIA وحدة معالجة رسومات T4 أو V100 يمكنك استخدام منصات سحابية أخرى، مثل Google Cloud. (GCP) إذا كنت تفضّل ذلك
• المتصفح: يتوافق Chrome مع WebGPU، حليفًا قويًا لـ WebGL، توفّر التطورات الحديثة من واجهات برمجة التطبيقات الحديثة لوحدة معالجة الرسومات على الويب.
• التشغيل الآلي: Puppeteer هو مكتبة Node.js تتيح التحكم في المتصفحات آليًا باستخدام JavaScript. باستخدام Puppeteer، يمكننا Chrome في وضع التشغيل بلا واجهة مستخدم رسومية، ما يعني أنّ المتصفّح يعمل بدون وواجهة مرئية على الخادم. نستخدم النموذج المحسّن وضع التشغيل بلا واجهة مستخدم رسومية الجديد، وليس القديم.

التأكّد من البيئة

إن أفضل طريقة للتحقق مما إذا كان تسريع الأجهزة مفعَّلاً في Chrome هي اكتب chrome://gpu في شريط العناوين. يمكنك الأداء المكافئ آليًا باستخدام Puppeteer باستخدام console.log أو يمكنك حفظ التقرير الكامل كملف PDF للاطّلاع يدويًا على ما يلي:

/* Incomplete example.js */
import puppeteer from 'puppeteer';

// Configure launch parameters: Expands later
const browser = await puppeteer.launch({
  headless: 'new',
  args:  ['--no-sandbox']
});

const page = await browser.newPage();
await page.goto('chrome://gpu');

// Verify: log the WebGPU status or save the GPU report as PDF
const txt = await page.waitForSelector('text/WebGPU');
const status = await txt.evaluate(g => g.parentElement.textContent);
console.log(status);
await page.pdf({ path: './gpu.pdf' });

await browser.close();

افتح chrome://gpu وستظهر لك النتائج التالية:

ليست بداية رائعة. من الواضح إلى حدٍ ما أن عملية اكتشاف الأجهزة قد تعذّرت. تكون WebGL وWebGL2 وWebGPU متوقفة أو برامج فقط في الأساس. أر ليسوا وحدهم في هذه المشكلة - هناك العديد من المناقشات عبر الإنترنت حول أشخاص في موقف مشابه، بما في ذلك قنوات دعم Chrome الرسمية (1) (2).

تفعيل التوافق مع WebGPU وWebGL

متصفّح Chrome بلا واجهة مستخدم رسومية تلقائيًا إيقاف وحدة معالجة الرسومات لتفعيله على نظام التشغيل Linux، طبِّق جميع العلامات التالية عند تشغيل إصدار بلا واجهة مستخدم رسومية. متصفِّح Chrome:

• توقِف العلامة --no-sandbox وضع الحماية للأمان في Chrome، والذي يعزل المتصفح من بقية النظام. تشغيل Chrome كجذر بدون وضع الحماية هذا غير مدعم.
• يعمل العلم --headless=new على تشغيل Chrome مع الميزات الجديدة والمحسّنة وضع التشغيل بلا واجهة مستخدم رسومية، بدون أي واجهة مستخدم مرئية
• تطلب العلامة --use-angle=vulkan من Chrome استخدام خلفية Vulkan لـ ANGLE يترجم طلبات OpenGL ES 2/3 إلى طلبات Vulkan API.
• تتيح العلامة --enable-features=Vulkan تشغيل الواجهة الخلفية لرسومات Vulkan في والتجميع والبكسلة في Chrome.
• تعمل علامة --disable-vulkan-surface على إيقاف VK_KHR_surface vulkan. المثيل. فبدلاً من استخدام سلسلة التبديل، يُستخدم Bit blit تقديم نتيجة العرض على الشاشة.
• تعمل العلامة --enable-unsafe-webgpu على تفعيل واجهة برمجة التطبيقات WebGPU API التجريبية في متصفّح Chrome على نظام التشغيل Linux ويوقف القائمة المحظورة للمحوّلات

يتم الآن دمج جميع التغييرات التي أجريناها حتى الآن. إليك النص الكامل.

/* Complete example.js */
import puppeteer from 'puppeteer';

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

const page = await browser.newPage();
await page.goto('chrome://gpu');

// Verify: log the WebGPU status or save the GPU report as PDF
const txt = await page.waitForSelector('text/WebGPU');
const status = await txt.evaluate(g => g.parentElement.textContent);
console.log(status);
await page.pdf({path: './gpu.pdf'});

await browser.close();

شغِّل النص البرمجي مرة أخرى. لم يتم رصد أي مشاكل في WebGPU وتتغيّر القيمة من إلى البرامج فقط.

ومع ذلك، لا تزال ميزة تسريع الأجهزة غير متاحة، ولن يتم استخدام وحدة معالجة الرسومات NVIDIA T4 الجديدة.

تثبيت برامج تشغيل وحدة معالجة الرسومات الصحيحة

لقد فحصنا عن كثب نتائج "chrome://gpu"، مع بعض الخبراء في وحدات معالجة الرسومات. في فريق Chrome. لقد رصدنا مشاكل في برامج التشغيل التلقائية المثبَّتة على Linux Colab مما يتسبب في حدوث مشكلات في Vulkan، ما يؤدي إلى عدم تمكّن Chrome من اكتشاف وحدة معالجة الرسومات NVIDIA T4 على مستوى GL_RENDERER كما هو موضّح في الإخراج التالي. هذا النمط يتسبب في حدوث مشاكل في Chrome بلا واجهة مستخدم رسومية.

ومن ثم يؤدي تثبيت برامج التشغيل الصحيحة التي كانت متوافقة إلى حل المشكلة.

لتثبيت برامج التشغيل الصحيحة، شغِّل الأوامر التالية أثناء عملية الإعداد. تشير رسالة الأشكال البيانية يساعدك السطران الأخيران في تسجيل مخرجات كل ما تكتشفه برامج تشغيل NVIDIA على مع vulkaninfo.

apt-get install -y vulkan-tools libnvidia-gl-525

// Verify the NVIDIA drivers detects along with vulkaninfo
nvidia-smi
vulkaninfo --summary

الآن قم بتشغيل النص البرمجي مرة أخرى وسنحصل على النتيجة التالية. 🎉

باستخدام برامج التشغيل والعلامات الصحيحة عند تشغيل Chrome، أصبح لدينا الآن WebGPU متوافقة مع WebGL باستخدام الوضع الجديد اللامع بلا واجهة مستخدم رسومية.

وراء الكواليس: التحقيق الذي يجريه فريقنا

بعد الكثير من البحث، لم نعثر على طرق عمل للبيئة التي اللازمة للتنفيذ في Google Colab، على الرغم من وجود بعض مشاركات تبعث على الأمل التي عملت في بيئات أخرى، وكان ذلك واعدًا. في النهاية، لم نكن تكرار نجاحها في بيئة Colab NVIDIA T4، حيث نجحنا في المشكلات الرئيسية:

1. تتيح بعض مجموعات العلامات اكتشاف وحدة معالجة الرسومات، ولكنّها لا تسمح لك ستستخدم وحدة GPU في الواقع.
2. أمثلة على حلول العمل التي ابتكرتها جهات خارجية والتي استخدمت الإصدار القديم من Chrome بلا واجهة مستخدم رسومية والذي سيتم إيقافه في مرحلة ما لصالح الإصدار الجديد. كنا بحاجة إلى حل التي تتوافق مع الإصدار الجديد من Chrome بلا واجهة مستخدم رسومية للمساعدة في مواكبة التغييرات المستقبلية.

أكّدنا على قلة استخدام وحدة GPU من خلال تشغيل مثال على صفحة الويب TensorFlow.js للتعرّف على الصور، ومن خلاله، دربنا نموذجًا للتعرف على عينات الملابس (نوعًا ما مثل " العالم التعلم الآلي).

على الجهاز العادي، يجب تشغيل 50 دورة تدريبية (المعروفة باسم الحقبات) في عدد أقل أقل من ثانية واحدة لكل منهما. عند الاتصال بمتصفّح Chrome بلا واجهة مستخدم رسومية بحالته التلقائية، يمكننا تسجيل إخراج وحدة تحكم JavaScript إلى سطر الأوامر من جانب الخادم Node.js لمعرفة كيف السرعة التي تستغرقها هذه الدورات التدريبية بالفعل.

وكما هو متوقع، استغرقت كل فترة تدريب وقتًا أطول بكثير من المتوقع (العديد من ثانية)، ما يشير إلى عودة Chrome إلى التنفيذ القديم لوحدة المعالجة المركزية (CPU) JS بدلاً من استخدام وحدة معالجة الرسومات:

بعد إصلاح برامج التشغيل واستخدام المجموعة الصحيحة من العلامات لنظام التشغيل بلا واجهة مستخدم رسومية في Chrome، تؤدي إعادة تشغيل مثال التدريب TensorFlow.js إلى الحصول على تجربة أسرع الحقبات التدريبية.

ملخّص

تطوّر الذكاء الاصطناعي على الويب بشكل كبير منذ إنشائها في عام 2017. باستخدام تقنيات المتصفح مثل WebGPU وWebGL WebAssembly، وهو نموذج لتعلُّم الآلة يمكن تسريع العمليات الرياضية من جانب العميل.

اعتبارًا من عام 2023، تجاوزت TensorFlow.js وMediaPipe Web أكثر من مليار عملية تنزيل من والنماذج والمكتبات — معلم رئيسي تاريخي ودلالة على كيفية عمل الويب يتحوّل المطوّرون والمهندسون إلى استخدام الذكاء الاصطناعي في الجيل التالي تطبيقات الويب لإنشاء بعض الحلول الرائعة حقًا.

مع النجاح الكبير في الاستخدام، تقع على عاتقنا مسؤولية كبيرة. في هذا المستوى من الاستخدام في أنظمة الإنتاج، تنشأ الحاجة إلى اختبار الذكاء الاصطناعي من جهة العميل النماذج في بيئة متصفح حقيقية، مع أن تكون أيضًا قابلة للتطوير وقابلة للتطوير تلقائيًا، وضمن أي جهاز موحّد معروف.

من خلال الاستفادة من القدرات المشتركة بين الإصدار الجديد من Chrome وPuppeteer بلا واجهة مستخدم رسومية، نتمكن من اختبار أعباء العمل هذه بثقة في نموذج موحّد وقابل للتكرار بيئات متسقة، ويضمن نتائج متسقة وموثوقة.

الخاتمة

يتوفر دليل مفصّل في وثائقنا، حتى يمكنك تجربة الإعداد بالكامل بنفسك.

إذا وجدت هذا مفيدًا، فأرسل صيحة على LinkedIn, X (المعروف سابقًا باسم Twitter)، أو أي شيء شبكة اجتماعية تستخدمها من خلال علامة التصنيف #WebAI. سيكون من الرائع سماع أي ملاحظاتكم حتى نعرف أننا لكتابة المزيد من مثل هذه الأمور في المستقبل.

إضافة نجمة على مستودع GitHub لتلقي أي تحديثات مستقبلية.

شكر وتقدير

نتوجّه بالشكر إلى جميع أعضاء فريق Chrome الذين ساعدوا في تصحيح أخطاء برنامج التشغيل وقد واجهنا مشاكل WebGPU في هذا الحل، ويرجع الفضل في ذلك إلى جيسلين ين ألكسندرا وايت للمساعدة في تحسين الكلمات مشاركة المدونة هذه. بفضل يولي نوفيكوف، وأندري كوزياكوف، أليكس رودينكو الذي كان له دور رائد في إيجاد الحل النهائي والعملي.