مدلهای ترنسفورمری در سالهای اخیر به پایه بسیاری از کاربردهای هوش مصنوعی تبدیل شدهاند؛ از پردازش زبان طبیعی و تحلیل تصویر گرفته تا سیستمهای گفتار و مدلهای چندوجهی. با این حال، اجرای این مدلها معمولا به زیرساختهای سمت سرور، محیطهای پایتونی و منابع محاسباتی قابلتوجه وابسته بوده است؛ موضوعی که استفاده از آنها را در اپلیکیشنهای وب و سناریوهای سمت کلاینت با محدودیتهایی همراه میکرد. Transformers.js پاسخی مستقیم به این چالش است.
این کتابخانه که توسط Hugging Face توسعه داده شده، امکان اجرای مدلهای Transformers را مستقیما در مرورگر یا محیط JavaScript فراهم میکند؛ بدون نیاز به سرور و با APIای بسیار نزدیک به نسخه پایتونی. در این مقاله، نگاهی دقیق به قابلیتها، نحوه استفاده، دامنه پشتیبانی از وظایف و مدلها، و جایگاه Transformers.js در توسعه اپلیکیشنهای وب مبتنی بر هوش مصنوعی خواهیم داشت.
اجرای مدلهای 🤗 Transformers مستقیما در مرورگر، بدون نیاز به سرور
Transformers.js نسخهای از کتابخانه Transformers که برای اجرای مدلها در مرورگر یا محیط جاوااسکریپت طراحی شده است. این ابزار از نظر کارکرد بسیار شبیه نسخهی پایتونی Transformers عمل میکند؛ یعنی میتوانید همان مدلهای ازپیشآموزشدیده را با یک API تقریبا مشابه در JavaScript اجرا کنید.
این مدلها از طیف گستردهای از وظایف در حوزههای مختلف پشتیبانی میکنند، از جمله:
- پردازش زبان طبیعی (NLP): طبقهبندی متن، تشخیص موجودیتهای نامدار، پاسخگویی به پرسش، مدلسازی زبان، خلاصهسازی، ترجمه، پرسشهای چندگزینهای و تولید متن
- بینایی ماشین (CV): طبقهبندی تصویر، تشخیص اشیا، بخشبندی (Segmentation) و تخمین عمق
- صوت: تشخیص خودکار گفتار (ASR)، طبقهبندی صوت و تبدیل متن به گفتار
- چندحالته (Multimodal): ساخت بردارهای امبدینگ، طبقهبندی صوت، تصویر و تشخیص اشیا بهصورت یادگیری بدون نمونه
Transformers.js از ONNX Runtime برای اجرای مدلها در مرورگر استفاده میکند. نکته جذاب ماجرا این است که میتوانید مدلهای PyTorch، TensorFlow یا JAX خود را بهسادگی با استفاده از ابزار 🤗 Optimum به فرمت ONNX تبدیل کرده و مستقیما در مرورگر اجرا کنید.
نگاهی کوتاه به قابلیتهای Transformers.js
راهاندازی و استفاده از Transformers.js بسیار ساده است. اگر قبلا با نسخه پایتونی کار کرده باشید، با همان الگو میتوانید پیش بروید. این کتابخانه از API مربوط به pipeline پشتیبانی میکند؛ یعنی مجموعهای یکپارچه که مدل، پیشپردازش ورودی و پردازش خروجی را کنار هم قرار میدهد. به همین دلیل، pipeline سادهترین روش برای اجرای یک مدل در این کتابخانه به حساب میآید.
| پایتون | جاوا اسکریپت |
| from transformers import pipeline
# Allocate a pipeline for sentiment-analysis pipe = pipeline(‘sentiment-analysis’) out = pipe(‘I love transformers!’) [{‘label’: ‘POSITIVE’, ‘score’: 0.999806941} # |
import { pipeline } from ‘@huggingface/transformers’;
// Allocate a pipeline for sentiment-analysis const pipe = await pipeline(‘sentiment-analysis’); const out = await pipe(‘I love transformers!’); [{‘label’: ‘POSITIVE’, ‘score’: 0.999817686}] // |
شما میتوانید با مشخص کردن شناسه یا مسیر مدل بهعنوان آرگومان دوم تابع pipeline، از یک مدل دیگر هم استفاده کنید. برای مثال:
|
1 2 |
// Use a different model for sentiment-analysis const pipe = await pipeline(‘sentiment-analysis’, ‘Xenova/bert-base-multilingual-uncased-sentiment’); |
بهصورت پیشفرض، وقتی مدل را در مرورگر اجرا میکنید، پردازش روی CPU انجام میشود (از طریق WASM). اگر بخواهید مدل روی GPU اجرا شود (با استفاده از WebGPU)، کافی است گزینه device: ‘webgpu’ را تنظیم کنید. برای مثال:
|
1 2 3 4 |
// Run the model on WebGPU const pipe = await pipeline(‘sentiment-analysis’, ‘Xenova/distilbert-base-uncased-finetuned-sst-2-english’, { device: ‘webgpu’, }); |
در محیطهایی که منابع محدود دارند، مانند مرورگرهای وب، بهتر است از نسخه کوآنتایزشده مدل استفاده شود تا مصرف پهنای باند کاهش یابد و کارایی بهبود پیدا کند. این کار با تنظیم گزینه dtype انجام میشود که امکان انتخاب نوع داده مناسب برای مدل را فراهم میکند. با اینکه گزینههای موجود بسته به مدل ممکن است متفاوت باشند، انتخابهای رایج شامل “fp32” (حالت پیشفرض برای WebGPU)، “fp16″، “q8” (حالت پیشفرض برای WASM) و “q4” هستند.
|
1 2 3 4 |
// Run the model at 4-bit quantization const pipe = await pipeline(‘sentiment-analysis’, ‘Xenova/distilbert-base-uncased-finetuned-sst-2-english’, { dtype: ‘q4’, }); |
محتواها
مستندات به ۴ بخش تقسیم شدهاند:
- GET STARTED یک معرفی سریع از کتابخانه و دستورالعملهای نصب ارائه میکند تا بتوانید کار را آغاز کنید.
- TUTORIALS بهترین نقطه شروع برای افراد مبتدی است! همچنین نمونه برنامههایی هم برای آزمایش و تمرین در اختیار شما قرار گرفته است.
- DEVELOPER GUIDES توضیح میدهد چگونه با استفاده از کتابخانه به یک هدف مشخص برسید.
- API REFERENCE تمام کلاسها و توابع را همراه با پارامترها و انواع آنها توضیح میدهد.
مثالها
میخواهید مستقیم شروع کنید؟ میتوانید با یکی از نمونه برنامهها یا قالبهای آماده huggingface که در این لینک قرار دارد، کار را آغاز کنید.
| نام | توصیف | لینکها |
| Whisper Web | تشخیص گفتار با مدل Whisper | کد، دمو |
| Doodle Dash | بازی تشخیص طرحهای دستی بهصورت بلادرنگ | بلاگ، کد، دمو |
| Code Playground | وبسایت تکمیل کد داخل مرورگر | کد، دمو |
| Semantic Image Search (client-side) | جستجوی تصویر بر اساس متن (سمانتیک) – سمت کلاینت | کد، دمو |
| Semantic Image Search (server-side) | جستجوی تصویر بر اساس متن (سمانتیک) – سمت سرور (با Supabase) | کد، دمو |
| Vanilla JavaScript | تشخیص اشیا داخل مرورگر با JavaScript خالص | ویدیو، کد، دمو |
| React | وبسایت ترجمه چندزبانه | کد، دمو |
| Text to speech (client-side) | تبدیل متن به گفتار داخل مرورگر | کد، دمو |
| Browser extension | افزونه مرورگر برای طبقهبندی متن | کد |
| Electron | اپلیکیشن طبقهبندی متن با Electron | کد |
| Next.js (client-side) | تحلیل احساسات – اجرای مدل در مرورگر | کد، دمو |
| Next.js (server-side) | تحلیل احساسات – اجرای مدل در Node.js | کد، دمو |
| Node.js | API تحلیل احساسات | کد |
| Demo site | مجموعهای از دموها | کد، دمو |
وظایف و مدلهای پشتیبانیشده در Transformers
در این بخش لیست تمام وظایف و معماریهایی را میبینید که در حال حاضر توسط Transformers.js پشتیبانی میشوند. اگر وظیفه یا مدل موردنظر شما در این لیست قرار ندارد یا هنوز پشتیبانی نمیشود، میتوانید از این قسمت یک درخواست برای اضافه شدن آن ثبت کنید.
برای پیدا کردن مدلهای سازگار در Hugging Face Hub، کافی است در بخش فیلترها، کتابخانه «transformers.js» را انتخاب کنید (یا از این لینک وارد شوید). همچنین میتوانید با انتخاب وظیفه موردنظر برای مثال text-classification نتایج را دقیقتر کنید.
تسکها
پردازش زبان طبیعی
| تسک | ID | توصیف | پشتیبانی میشود؟ |
| Fill-Mask | fill-mask | پنهانسازی برخی کلمات در یک جمله و پیشبینی اینکه کدام کلمات باید جایگزین شوند | ✅ (docs)
(models) |
| Question Answering | question-answering | استخراج پاسخ یک پرسش از متن دادهشده | ✅ (docs) |
| Sentence Similarity | sentence-similarity | تعیین میزان شباهت میان دو متن | ✅ (docs) |
| Summarization | summarization | تولید نسخهای کوتاهتر از یک سند با حفظ اطلاعات مهم | ✅ (docs) |
| Table Question Answering | table-question-answering | پاسخ دادن به پرسشها بر اساس اطلاعات موجود در یک جدول | ❌ |
| Text Classification | text-classification یا sentiment-analysis | اختصاص یک برچسب یا کلاس به یک متن | ✅ (docs) |
| Text Generation | text-generation | تولید متن جدید از طریق پیشبینی کلمهٔ بعدی در یک توالی | ✅ (docs) |
| Text-to-text Generation | text2text-generation | تبدیل یک توالی متنی به توالی متنی دیگر | ✅ (docs) |
| Token Classification | token-classification یا ner | اختصاص یک برچسب به هر توکن در متن | ✅ (docs) |
| Translation | translation | تبدیل متن از یک زبان به زبانی دیگر | ✅ (docs) |
| Zero-Shot Classification | zero-shot-classification | طبقهبندی متن در کلاسهایی که مدل در مرحله آموزش ندیده است | ✅ (docs) |
| Feature Extraction | feature-extraction | تبدیل داده خام به ویژگیهای عددی بدون از دست دادن اطلاعات اصلی | ✅ (docs) |
بینایی (Vision)
| تسک | ID | توصیف | پشتیبانی میشود؟ |
| Background Removal | background-removal | جدا کردن سوژه اصلی تصویر از طریق حذف پسزمینه یا شفاف کردن آن | ✅ (docs) |
| Depth Estimation | depth-estimation | پیشبینی عمق اشیا موجود در تصویر | ✅ (docs) |
| Image Classification | image-classification | اختصاص یک برچسب یا کلاس به کل تصویر | ✅ (docs) |
| Image Segmentation | image-segmentation | تقسیم تصویر به بخشهایی که هر پیکسل به یک شیء نسبت داده میشود. این وظیفه شامل انواعی مثل instance segmentation، panoptic segmentation و semantic segmentation است. | ✅ (docs) |
| Image-to-Image | image-to-image | تبدیل یک تصویر به گونهای که ویژگیهای تصویر هدف یا دامنه هدف را داشته باشد | ✅ (docs) |
| Mask Generation | mask-generation | تولید ماسک برای اشیای موجود در تصویر | ❌ |
| Object Detection | object-detection | تشخیص اشیای مربوط به کلاسهای مشخصشده در یک تصویر | ✅ (docs) |
| Video Classification | n/a | اختصاص یک برچسب یا کلاس به کل یک ویدیو | ❌ |
| Unconditional Image Generation | n/a | تولید تصویر بدون هیچ نوع شرط (مثل متن یا تصویر ورودی) | ❌ |
| Image Feature Extraction | image-feature-extraction | تبدیل داده خام تصویر به ویژگیهای عددی قابل پردازش بدون از دست دادن اطلاعات اصلی | ✅ (docs) |
صوتی (Audio)
| تسک | ID | توصیف | پشتیبانی میشود؟ |
| Audio Classification | audio-classification | اختصاص یک برچسب یا کلاس به یک فایل صوتی | ✅ (docs) |
| Audio-to-Audio | n/a | تولید خروجی صوتی بر اساس یک ورودی صوتی | ❌ |
| Automatic Speech Recognition | automatic-speech-recognition | تبدیل صوت ورودی به متن | ✅ (docs) |
| Text-to-Speech | text-to-speech / text-to-audio | تولید گفتار طبیعی از متن ورودی | ✅ (docs) |
جدولی (Tabular)
| تسک | ID | توصیف | پشتیبانی میشود؟ |
| Tabular Classification | n/a | طبقهبندی یک دسته هدف بر اساس مجموعهای از ویژگیها | ❌ |
| Tabular Regression | n/a | پیشبینی یک مقدار عددی بر اساس مجموعهای از ویژگیها | ❌ |
چندوجهی (Multimodal)
| تسک | ID | توصیف | پشتیبانی میشود؟ |
| Document Question Answering | document-question-answering | پاسخ دادن به پرسشها بر اساس تصاویر اسناد | ✅ (docs) |
| Image-to-Text | image-to-text | تولید خروجی متنی از یک تصویر | ✅ (docs) |
| Text-to-Image | text-to-image | تولید تصویر از متن ورودی | ❌ |
| Visual Question Answering | visual-question-answering | پاسخدهی به پرسشهای باز مبتنی بر یک تصویر | ❌ |
| Zero-Shot Audio Classification | zero-shot-audio-classification | طبقهبندی صوت در دستههایی که مدل در مرحله آموزش ندیده است | ✅ (docs) |
| Zero-Shot Image Classification | zero-shot-image-classification | طبقهبندی تصویر در دستههایی که مدل در مرحلهٔ آموزش ندیده است | ✅ (docs) |
| Zero-Shot Object Detection | zero-shot-object-detection | تشخیص اشیاء متعلق به کلاسهایی که مدل هنگام آموزش ندیده است | ✅ (docs) |
یادگیری تقویتی (Reinforcement Learning)
| تسک | ID | توصیف | پشتیبانی میشود؟ |
| Reinforcement Learning | n/a | یادگیری از طریق تعامل با محیط و انجام عملهای مختلف، همراه با دریافت پاداش مثبت یا منفی بهعنوان بازخورد. | ✅ |
مدلهای پشتیبانیشده در Transformers.js
Transformers.js بهعنوان نسخه وبمحور کتابخانه Transformers، محدود به چند مدل خاص نیست و از طیف گستردهای از مدلهای شناختهشده ترنسفورمری پشتیبانی میکند. این یعنی توسعهدهندهها میتوانند بسیاری از مدلهایی را که قبلا در اکوسیستم Hugging Face استفاده میکردند، مستقیما در مرورگر یا محیط JavaScript اجرا کنند.
در میان مدلهای پشتیبانیشده میتوان به خانوادههای شناختهشدهای مانند BERT، ALBERT، RoBERTa، DistilBERT در حوزه پردازش زبان طبیعی، مدلهایی مثل CLIP، ViT، DETR، Segment Anything در حوزه بینایی ماشین و مدلهایی مانند Whisper، Wav2Vec2 و SpeechT5 در پردازش صوت اشاره کرد.
همچنین پشتیبانی از مدلهای چندوجهی و مدلهای زبانی بزرگتر مانند LLaMA، BLOOM، GPT-Neo و Mistral نشان میدهد که Transformers.js صرفا برای سناریوهای ساده طراحی نشده و میتواند در پروژههای جدیتر هم مورد استفاده قرار بگیرد.
نکته مهم این است که پشتیبانی از یک مدل بهمعنای اجرای کامل و بیمحدودیت آن در مرورگر نیست. برخی مدلها به دلیل اندازه یا نیاز محاسباتی بالا، فقط در نسخههای کوچکتر، کوآنتایزشده یا در محیطهایی مثل Node.js عملکرد عملی دارند. با این حال، گستردگی فهرست مدلهای Transformers.js بهخوبی نشان میدهد که Transformers.js بهطور مستقیم با هسته اصلی اکوسیستم Hugging Face همراستا است.
در عمل، توسعهدهندگان بهجای انتخاب مدل از روی فهرست بلند Transformers.js ، معمولا ابتدا وظیفه (Task) موردنظر خود را مشخص میکنند و سپس از میان مدلهای سازگار با Transformers.js، گزینهای را انتخاب میکنند که از نظر دقت، حجم و عملکرد با محدودیتهای محیط وب هماهنگ باشد.
نتیجهگیری
Transformers.js نشان میدهد که اجرای مدلهای یادگیری ماشین در مرورگر دیگر صرفا یک آزمایش فنی نیست، بلکه به گزینهای عملی برای توسعهدهندگان وب تبدیل شده است. پشتیبانی از API آشنا، استفاده از pipeline و امکان اجرای مدلها با WASM یا WebGPU باعث میشود بسیاری از سناریوهای رایج هوش مصنوعی بدون وابستگی به بکاند قابل پیادهسازی باشند.
با این حال، استفاده از Transformers.js نیازمند درک درست از محدودیتهای محیط وب است. انتخاب مدل مناسب، بهرهگیری از کوآنتایزیشن و آگاهی از تفاوتهای اجرا در مرورگر و Node.js نقش مهمی در موفقیت پروژه دارند. اگر هدف شما ساخت اپلیکیشنهایی با تاخیر کمتر، حفظ حریم خصوصی بیشتر و وابستگی کمتر به سرور است، Transformers.js میتواند یکی از گزینههای جدی و قابل اتکا در اکوسیستم وب باشد.
منابع
سوالات متداول
Transformers.js امکان اجرای مدلهای آماده Transformers را مستقیما در مرورگر یا محیط JavaScript فراهم میکند، بدون نیاز به سرور یا بکاند پایتونی.
بله، به شرطی که مدل با Transformers.js و فرمت ONNX سازگار باشد. این مدلها در Hugging Face Hub با تگ transformers.js مشخص شدهاند.
برای مدلهای کوچک یا کوآنتایزشده کاملا عملی است. استفاده از WebGPU هم میتواند عملکرد را بهطور محسوسی بهبود دهد اما مدلهای بزرگ همچنان محدودیت دارند.
برای اپلیکیشنهای وب، افزونههای مرورگر، ابزارهای سمت کلاینت و پروژههایی که حریم خصوصی، تاخیر کم و حذف وابستگی به سرور اهمیت دارد.
برای آموزش مدل، پردازشهای بسیار سنگین یا استفاده از مدلهای بسیار بزرگ، نسخه پایتونی Transformers یا اجرای سروری گزینه بهتری است.
دیدگاهتان را بنویسید