ब्राउज़र में सीधे चलने वाला Transformers.js

 (github.com/xenova)
3 पॉइंट द्वारा GN⁺ 2024-04-13 | 1 टिप्पणियां | WhatsApp पर शेयर करें
  • Transformers.js बिना server के browser में 🤗 Transformers models चलाने के लिए एक library है, जिसका लक्ष्य Hugging Face के Python transformers के साथ functionally equivalent और समान API देना है
  • Model execution के लिए ONNX Runtime का उपयोग होता है, और PyTorch·TensorFlow·JAX pretrained models को 🤗 Optimum से ONNX में convert करके इस्तेमाल किया जा सकता है
  • pipeline API से sentiment analysis जैसे tasks को Python जैसी शैली में call किया जाता है, और दूसरा argument के रूप में model ID या path देकर दूसरा model चुना जा सकता है
  • Browser में default execution WASM-based CPU है, और device: 'webgpu' से WebGPU execution चुना जा सकता है, लेकिन WebGPU API अभी कई browsers में experimental है
  • Web browser जैसे resource-constrained environments में dtype से "fp32", "fp16", "q8", "q4" जैसे data types चुनकर bandwidth और performance adjust की जा सकती है

ब्राउज़र में चलने वाले Transformers

  • Transformers.js एक ऐसी library है जिसे बिना server के browser में सीधे 🤗 Transformers चलाने के लिए design किया गया है
  • इसका लक्ष्य Hugging Face की Python transformers library के साथ functionally equivalent usage experience देना है, और वही pretrained models बहुत समान API से चलाए जा सकते हैं
  • Supported tasks कई modalities में फैले हुए हैं
    • Natural language processing: text classification, named entity recognition, question answering, language modeling, summarization, translation, multiple choice, text generation
    • Computer vision: image classification, object detection, segmentation, depth estimation
    • Audio: automatic speech recognition, audio classification, text-to-speech
    • Multimodal: embeddings, zero-shot audio classification, zero-shot image classification, zero-shot object detection

Execution method और model conversion

  • Model execution के लिए ONNX Runtime का उपयोग होता है
  • Pretrained PyTorch, TensorFlow, JAX models को 🤗 Optimum का उपयोग करके ONNX में convert किया जा सकता है
  • पूरी documentation Transformers.js documentation पर उपलब्ध है

Installation और browser usage

  • NPM package को नीचे दिए command से install किया जाता है
npm i @huggingface/transformers
  • Bundler के बिना vanilla JS में भी इस्तेमाल किया जा सकता है, और CDN या static hosting के जरिए ES Modules के रूप में import किया जा सकता है
<script type="module">
    import { pipeline } from 'https://cdn.jsdelivr.net/npm/@huggingface/transformers@4.2.0';
</script>

Python जैसा pipeline API

  • pipeline API pretrained model, input preprocessing और output postprocessing को जोड़कर library में model चलाने का सबसे आसान तरीका है
  • Python transformers के sentiment analysis example की तरह JavaScript में भी pipeline('sentiment-analysis') बनाकर text input दिया जा सकता है और result मिल सकता है
import { pipeline } from '@huggingface/transformers';

const pipe = await pipeline('sentiment-analysis');
const out = await pipe('I love transformers!');
// [{'label': 'POSITIVE', 'score': 0.999817686}]
  • दूसरा model इस्तेमाल करने के लिए pipeline function के दूसरे argument के रूप में model ID या path specify किया जाता है
const pipe = await pipeline(
  'sentiment-analysis',
  'Xenova/bert-base-multilingual-uncased-sentiment'
);

CPU, WebGPU, quantization options

  • Browser execution का default WASM-based CPU execution है
  • GPU पर चलाने के लिए device: 'webgpu' set करें
const pipe = await pipeline(
  'sentiment-analysis',
  'Xenova/distilbert-base-uncased-finetuned-sst-2-english',
  {
    device: 'webgpu',
  }
);
  • WebGPU से जुड़ी detailed जानकारी WebGPU guide में है
  • WebGPU API अभी कई browsers में experimental है, इसलिए समस्या आने पर WebGPU bug report submit करने का निर्देश दिया गया है
  • Resource-constrained web browser environments में quantized models का उपयोग recommended है
    • dtype option से model data type चुना जाता है
    • सामान्य choices हैं "fp32" WebGPU default, "fp16", "q8" WASM default, "q4"
    • अधिक जानकारी quantization guide में है
const pipe = await pipeline(
  'sentiment-analysis',
  'Xenova/distilbert-base-uncased-finetuned-sst-2-english',
  {
    dtype: 'q4',
  }
);

Custom configuration

  • Default रूप से Transformers.js hosted pretrained models और precompiled WASM binaries का उपयोग करके तुरंत काम करने के लिए configured है
  • env settings से model location, remote model loading और WASM file path बदले जा सकते हैं
import { env } from '@huggingface/transformers';

env.localModelPath = '/path/to/models/';
env.allowRemoteModels = false;
env.backends.onnx.wasm.wasmPaths = '/path/to/files/';
  • उपलब्ध पूरी settings API Reference में हैं
  • PyTorch model को ONNX में convert करते समय Optimum का उपयोग करने वाला single-command तरीका recommended है

Supported tasks और model scope

  • Hugging Face Hub पर compatible models खोजने के लिए transformers.js library tag से filter किया जा सकता है
  • Supported tasks natural language processing, vision, audio, multimodal, reinforcement learning तक फैले हैं, और कुछ tasks अभी supported नहीं हैं
    • Natural language processing में fill-mask, question-answering, summarization, text-classification, text-generation, token-classification, translation, zero-shot-classification, feature-extraction आदि supported हैं
    • Vision में background-removal, depth-estimation, image-classification, image-segmentation, image-to-image, object-detection, image-feature-extraction आदि supported हैं
    • Audio में audio-classification, automatic-speech-recognition, text-to-speech supported हैं
    • Multimodal में document-question-answering, image-to-text, zero-shot audio/image classification, zero-shot object detection आदि supported हैं
  • अभी supported नहीं होने वाले tasks भी बताए गए हैं
    • table-question-answering, mask-generation, video-classification, unconditional-image-generation
    • audio-to-audio, tabular-classification, tabular-regression
    • text-to-image, visual-question-answering
  • Supported model architecture list में BERT, BART, CLIP, DistilBERT, Whisper, Llama, Qwen, Gemma, Phi, Segment Anything, ViT सहित कई model families शामिल हैं
  • अगर इच्छित task या model list में नहीं है या अभी supported नहीं है, तो feature request खोली जा सकती है

संबंधित पढ़ाई

1 टिप्पणियां

 
GN⁺ 2024-04-13
Hacker News की राय
  • यह लाइब्रेरी वाकई शानदार है। जल्दी डेमो खड़ा करना बहुत आसान है, इसलिए मैंने इसे Observable notebooks में कुछ बार इस्तेमाल किया है
    ब्राउज़र में CLIP: https://observablehq.com/@simonw/openai-clip-in-a-browser
    detra-resnet-50 के साथ इमेज ऑब्जेक्ट डिटेक्शन: https://observablehq.com/@simonw/detect-objects-in-images
    मॉडल का आकार शुरू में एक सीमा जैसा लगता है, लेकिन ऐसे काफ़ी ऐप हैं जहाँ अच्छे लैपटॉप और अच्छे कनेक्शन वाले यूज़र से यह कहना बिल्कुल अव्यावहारिक नहीं है कि लोड होने के लिए लगभग 30 सेकंड इंतज़ार करना होगा
    नवीनतम रिलीज़ में binary embedding quantization का सपोर्ट जोड़ा गया है, इसलिए इसे ज़रूर आज़माना चाहता हूँ: https://github.com/xenova/transformers.js/releases/tag/2.17....
    • binary embeddings में अतिरिक्त reranking की ज़रूरत पड़ेगी, लेकिन इसे टेस्ट करना मज़ेदार होगा
      मैंने transformers.js v3 का npm package बना रखा है और लगता है उसे अपडेट करना चाहिए। पक्का नहीं हूँ कि इसमें यह फीचर अभी शामिल है या नहीं
      मैंने मुख्य रूप से इसे bun पर चलाने के लिए fork बनाए रखा है, लेकिन v3 रिलीज़ होने पर bun को ठीक से सपोर्ट करने का इरादा है। हालाँकि WebGPU काम नहीं करेगा, पर वह एक वैकल्पिक फीचर है
      [संपादन: अगर इस्तेमाल करना चाहते हो तो DM करो। मैं अपने fork का प्रचार नहीं करना चाहता]
  • मैं इस लाइब्रेरी से gte-small(~0.07GB) embeddings बना रहा हूँ और उन्हें Upstash Vector में स्टोर कर रहा हूँ
    यह सिर्फ 384 dimensions का है, लेकिन पैराग्राफ-स्तर के टेक्स्ट पर हैरान करने वाली तरह से अच्छा काम करता है। leaderboard पर भी यह text-embedding-ada-002 से ऊपर आता है
    https://huggingface.co/spaces/mteb/leaderboard
  • Syntax podcast ने हाल ही में Transformers.js और उसके डेवलपर पर एक एपिसोड जारी किया है
    https://syntax.fm/show/740/local-ai-models-in-javascript-mac...
  • transformers.js वाकई एक शानदार लाइब्रेरी है
    मैंने BRIA AI के RMBG1.4 मॉडल के साथ इमेज background removal करने वाला एक छोटा web app बनाया है: https://aether.nco.dev
    यह बहुत अच्छा है कि डेटा API पर भेजना नहीं पड़ता और यह स्मार्टफ़ोन पर भी चलता है। आगे चलकर छोटे vision, language और दूसरे utility models (depth estimation, background removal आदि) के लिए इसका इस्तेमाल करने वाले बहुत से प्रोजेक्ट दिखेंगे, और वेब का भविष्य उज्ज्वल लगता है
    मैं पहले से अपने अगले प्रोजेक्ट पर काम कर रहा हूँ, और उसमें भी निश्चित रूप से transformers.js फिर इस्तेमाल करूँगा
    • मैं इसे एक सरल प्रोजेक्ट में इस्तेमाल कर रहा हूँ: https://github.com/sroussey/ellmers
      योजना यह है कि सर्वर या Electron app में इस्तेमाल के लिए कई RAG strategies हेतु embeddings और retrieval strategies को टेस्ट किया जाए
  • यह बहुत शानदार है, लेकिन अफ़सोस कि व्यावहारिक उपयोगिता काफ़ी कम लगती है। मॉडल आम तौर पर काफ़ी बड़े होते हैं, इसलिए भले ही ब्राउज़र उन्हें चला सके, ब्राउज़र तक लाने की प्रक्रिया में इन दो में से एक चीज़ चाहिए होगी
    1. हर बार वेबसाइट विज़िट करने पर बड़ा डाउनलोड
    2. हर उस साइट के लिए बड़ा डाउनलोड और अधिक स्टोरेज उपयोग जो बड़े मॉडल इस्तेमाल करती है। उदाहरण के लिए, 150 sites × 800MB मॉडल = 120GB स्टोरेज
      दोनों ही अच्छे नहीं हैं
      लंबे समय में शायद सही तरीका यह हो कि ब्राउज़र कुछ मॉडल बिल्ट-इन रखें और उन्हें standardized web API के ज़रिए expose करें, लेकिन मैंने अब तक ऐसी किसी कोशिश के बारे में नहीं सुना है

मॉडल डोमेन-विशेष रूप से cache होते हैं (Web Cache API का उपयोग), इसलिए हर बार पेज लोड होने पर इन्हें फिर से डाउनलोड करने की ज़रूरत नहीं होती। अगर आप मॉडल को डोमेन के पार बनाए रखना चाहते हैं, तो इस लाइब्रेरी से ब्राउज़र एक्सटेंशन बनाया जा सकता है
आख़िर में कही गई बात पर कुछ काम चल रहा है, लेकिन अभी उस पर बात करने का चरण नहीं है

  • यह लगभग वही समस्या है जो 10 साल पहले के पहले Unreal/Unity asm.js डेमो के बाद से web games को परेशान करती रही है, और तब से समाधान की दिशा में बहुत ज़्यादा प्रगति नहीं हुई है
    ऐसे web app जिन्हें client पर गीगाबाइट-स्तर का डेटा चाहिए, उन्हें व्यावहारिक रूप से बनाना मुश्किल है। cache में उपयोगकर्ता की इच्छा के अनुसार कितनी देर तक चीज़ें बनी रहेंगी, इसकी गारंटी देने का कोई भरोसेमंद तरीका नहीं है, और यदि स्थिर रूप से cache करना संभव भी हो, तो ब्राउज़र की cache partitioning नीति के कारण एक ही मॉडल इस्तेमाल करने वाली हर site पर download और storage की पुनरावृत्ति होती है
  • मॉडल 80MB से कम हैं, और बाकी LLM हैं, इसलिए वे दायरे से बाहर हैं। Whisper 40MB है, embedding 23MB है
    मूल टिप्पणी में “बहुत अव्यावहारिक लगता है”, “मॉडल आम तौर पर काफ़ी बड़े होते हैं”, “150 sites × 800MB मॉडल” जैसी बातें ख़ुद ही यह संकेत देती हैं कि समझ कुछ अधूरी है
  • कुछ मॉडल काफ़ी छोटे होते हैं, इसलिए सारा डेटा server पर भेजकर process करने की तुलना में उन्हें on-device चलाना फ़ायदेमंद हो सकता है
    एक और बड़ा फ़ायदा यह है कि transformers, Node.js पर भी चलता है। Python और उसकी dependencies के अजीब मेल को संभालने की तुलना में execution environment बनाना कहीं आसान है
  • यह सिर्फ़ ब्राउज़र की समस्या नहीं है, बल्कि on-device AI processing की मूलभूत समस्या है
    शायद तब सुधार होगा जब operating system मॉडल पहले से install करना शुरू करें और browser vendors ऐसे API दें जिन्हें इस्तेमाल किया जा सके
    फिर भी ज़्यादातर कामों में cloud-hosted मॉडल के कहीं बेहतर होने की संभावना बनी रहेगी
  • तो क्या अब Google CAPTCHA में साइकिल या पुल जैसी सभी चीज़ें पहचानने वाला browser plugin बनाया जा सकता है?
  • क्या training संभव नहीं है? कुछ साल पहले मैंने ब्राउज़र में छोटे neural network बनाकर उन्हें train करने का काम किया था; अब सोच रहा हूँ कि क्या छोटे custom transformer के साथ यह तरीका ज़्यादा अच्छी तरह चल सकता है
    • सैद्धांतिक रूप से यह निश्चित ही संभव है, लेकिन शायद performance समस्या ही वजह है कि यह अभी तक implement नहीं हुआ है
      Hugging Face Space में WebGPU embedding benchmark है, जिससे forward pass के प्रदर्शन का अंदाज़ा लगाया जा सकता है: https://huggingface.co/spaces/Xenova/webgpu-embedding-benchm...
      अपने आप में यह प्रभावशाली है, लेकिन उस latency पर training काफ़ी पीड़ादायक लगेगी। fp16, batch 32, sequence length 512 पर 2,200 दस-हज़ार पैरामीटर वाले मॉडल का forward pass लगभग 500ms लेता है
  • क्या इससे Node.js serverless functions में ऐसे मॉडल चलाने की संभावना भी खुलती है?
    on-demand inference के लिए भी निश्चित रूप से संभावना दिखती है
  • क्या यह Apple Silicon acceleration को support करता है?