वेब के लिए एलएलएम का अनुमान लगाने से जुड़ी गाइड

एलएलएम इन्फ़रेंस एपीआई की मदद से, वेब ऐप्लिकेशन के लिए लार्ज लैंग्वेज मॉडल (एलएलएम) को पूरी तरह से डिवाइस पर चलाया जा सकता है. इसका इस्तेमाल कई तरह के टास्क करने के लिए किया जा सकता है. जैसे, टेक्स्ट जनरेट करना, सामान्य भाषा में जानकारी पाना, और दस्तावेज़ों की खास जानकारी देना. इस टास्क में, टेक्स्ट से टेक्स्ट जनरेट करने वाले कई लार्ज लैंग्वेज मॉडल के लिए, पहले से मौजूद सहायता मिलती है. इसलिए, अपने वेब ऐप्लिकेशन पर डिवाइस में मौजूद जनरेटिव एआई मॉडल के नए वर्शन लागू किए जा सकते हैं. अगर Gemma-3n के नए मॉडल का इस्तेमाल किया जा रहा है, तो इमेज और ऑडियो इनपुट भी इस्तेमाल किए जा सकते हैं.

अपने वेब ऐप्लिकेशन में LLM Inference API को तुरंत जोड़ने के लिए, क्विकस्टार्ट का पालन करें. LLM Inference API का इस्तेमाल करने वाले वेब ऐप्लिकेशन का बुनियादी उदाहरण देखने के लिए, सैंपल ऐप्लिकेशन देखें. LLM Inference API के काम करने के तरीके के बारे में ज़्यादा जानकारी पाने के लिए, कॉन्फ़िगरेशन के विकल्प, मॉडल कन्वर्ज़न, और LoRA ट्यूनिंग सेक्शन देखें.

MediaPipe Studio के डेमो में, इस टास्क को काम करते हुए देखा जा सकता है. इस टास्क की क्षमताओं, मॉडल, और कॉन्फ़िगरेशन के विकल्पों के बारे में ज़्यादा जानने के लिए, खास जानकारी देखें.

क्विकस्टार्ट

अपने वेब ऐप्लिकेशन में LLM Inference API जोड़ने के लिए, यह तरीका अपनाएं. LLM Inference API के लिए, WebGPU के साथ काम करने वाला वेब ब्राउज़र ज़रूरी है. इसके साथ काम करने वाले ब्राउज़र की पूरी सूची देखने के लिए, जीपीयू के साथ काम करने वाले ब्राउज़र लेख पढ़ें.

डिपेंडेंसी जोड़ें

LLM Inference API, @mediapipe/tasks-genai पैकेज का इस्तेमाल करता है.

लोकल स्टेजिंग के लिए ज़रूरी पैकेज इंस्टॉल करें:

npm install @mediapipe/tasks-genai

किसी सर्वर पर डिप्लॉय करने के लिए, कॉन्टेंट डिलीवरी नेटवर्क (सीडीएन) सेवा का इस्तेमाल करें. जैसे, jsDelivr. इससे कोड को सीधे अपने एचटीएमएल पेज में जोड़ा जा सकता है:

<head>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-genai/genai_bundle.cjs"
    crossorigin="anonymous"></script>
</head>

मॉडल डाउनलोड करना

HuggingFace से Gemma-3n E4B या E2B डाउनलोड करें. जिन मॉडल के नाम में "-Web" होता है उन्हें खास तौर पर वेब पर इस्तेमाल करने के लिए बनाया जाता है. इसलिए, हमारा सुझाव है कि आप हमेशा इनमें से किसी एक मॉडल का इस्तेमाल करें.

उपलब्ध मॉडल के बारे में ज़्यादा जानने के लिए, मॉडल से जुड़ा दस्तावेज़ देखें. इसके अलावा, हमारे HuggingFace कम्यूनिटी पेज पर जाएं. यहां Gemma 3 के कई ऐसे वर्शन उपलब्ध हैं जिनके बारे में दस्तावेज़ में नहीं बताया गया है. हालांकि, इन्हें खास तौर पर वेब के लिए बनाया गया है. जैसे, 270M, 4B, 12B, 27B, और MedGemma-27B-Text.

मॉडल को अपने प्रोजेक्ट डायरेक्ट्री में सेव करें:

<dev-project-root>/assets/gemma-3n-E4B-it-int4-Web.litertlm

baseOptions ऑब्जेक्ट modelAssetPath पैरामीटर का इस्तेमाल करके, मॉडल का पाथ तय करें:

baseOptions: { modelAssetPath: `/assets/gemma-3n-E4B-it-int4-Web.litertlm`}

टास्क शुरू करना

बुनियादी कॉन्फ़िगरेशन विकल्पों के साथ टास्क शुरू करें:

const genai = await FilesetResolver.forGenAiTasks(
    // path/to/wasm/root
    "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-genai@latest/wasm"
);
llmInference = await LlmInference.createFromOptions(genai, {
    baseOptions: {
        modelAssetPath: '/assets/gemma-3n-E4B-it-int4-Web.litertlm'
    },
    maxTokens: 1000,
    topK: 40,
    temperature: 0.8,
    randomSeed: 101
});

टास्क रन करना

अनुमानों को ट्रिगर करने के लिए, generateResponse() फ़ंक्शन का इस्तेमाल करें.

const response = await llmInference.generateResponse(inputPrompt);
document.getElementById('output').textContent = response;

जवाब को स्ट्रीम करने के लिए, इसका इस्तेमाल करें:

llmInference.generateResponse(
  inputPrompt,
  (partialResult, done) => {
        document.getElementById('output').textContent += partialResult;
});

मल्टीमॉडल प्रॉम्प्ट

Gemma-3n मॉडल के लिए, LLM Inference API के वेब एपीआई, मल्टीमॉडल प्रॉम्प्टिंग के साथ काम करते हैं. मल्टीमॉडल सुविधा चालू होने पर, उपयोगकर्ता अपने प्रॉम्प्ट में इमेज, ऑडियो, और टेक्स्ट को क्रम से जोड़ सकते हैं. इसके बाद, एलएलएम टेक्स्ट के रूप में जवाब देता है.

शुरू करने के लिए, MediaPipe और वेब के साथ काम करने वाले फ़ॉर्मैट में, Gemma-3n E4B या Gemma-3n E2B का इस्तेमाल करें. ज़्यादा जानकारी के लिए, Gemma-3n के बारे में जानकारी देने वाला दस्तावेज़ देखें.

देखने में समस्या वाले लोगों के लिए, maxNumImages को पॉज़िटिव वैल्यू पर सेट करें. इससे यह तय होता है कि एलएलएम, एक प्रॉम्प्ट में इमेज के ज़्यादा से ज़्यादा कितने हिस्सों को प्रोसेस कर सकता है.

ऑडियो की सुविधा चालू करने के लिए, पक्का करें कि supportAudio को true पर सेट किया गया हो.

llmInference = await LlmInference.createFromOptions(genai, {
    baseOptions: {
        modelAssetPath: '/assets/gemma-3n-E4B-it-int4-Web.litertlm'
    },
    maxTokens: 1000,
    topK: 40,
    temperature: 0.8,
    randomSeed: 101,
    maxNumImages: 5,
    supportAudio: true,
});

अब जवाब पहले की तरह जनरेट किए जा सकते हैं. हालांकि, इसके लिए स्ट्रिंग, इमेज, और ऑडियो डेटा के क्रम में लगे ऐरे का इस्तेमाल किया जाता है:

const response = await llmInference.generateResponse([
  '<ctrl99>user\nDescribe ',
  {imageSource: '/assets/test_image.png'},
  ' and then transcribe ',
  {audioSource: '/assets/test_audio.wav'},
  '<ctrl100>\n<ctrl99>model\n',
]);

विजन के लिए, इमेज के यूआरएल और सबसे आम इमेज, वीडियो या कैनवस ऑब्जेक्ट इस्तेमाल किए जा सकते हैं. ऑडियो के लिए, सिर्फ़ सिंगल-चैनल AudioBuffer और मोनो-चैनल ऑडियो फ़ाइल के यूआरएल इस्तेमाल किए जा सकते हैं. ज़्यादा जानकारी के लिए, सोर्स कोड ब्राउज़ करें.

सैंपल ऐप्लिकेशन

यह सैंपल ऐप्लिकेशन, वेब के लिए टेक्स्ट जनरेट करने वाले एक बुनियादी ऐप्लिकेशन का उदाहरण है. इसमें LLM Inference API का इस्तेमाल किया गया है. इस ऐप्लिकेशन का इस्तेमाल, अपने वेब ऐप्लिकेशन को शुरू करने के लिए किया जा सकता है. इसके अलावा, मौजूदा ऐप्लिकेशन में बदलाव करते समय भी इसका इस्तेमाल किया जा सकता है. उदाहरण के तौर पर दिया गया कोड, GitHub पर होस्ट किया गया है.

नीचे दिए गए कमांड का इस्तेमाल करके, git रिपॉज़िटरी को क्लोन करें:

git clone https://github.com/google-ai-edge/mediapipe-samples

ज़्यादा जानकारी के लिए, वेब के लिए सेटअप गाइड देखें.

कॉन्फ़िगरेशन विकल्प

वेब ऐप्लिकेशन सेट अप करने के लिए, कॉन्फ़िगरेशन के इन विकल्पों का इस्तेमाल करें:

विकल्प का नाम ब्यौरा वैल्यू की सीमा डिफ़ॉल्ट मान
modelPath प्रोजेक्ट डायरेक्ट्री में मॉडल को सेव करने का पाथ. पाथ लागू नहीं
maxTokens मॉडल, ज़्यादा से ज़्यादा इतने टोकन (इनपुट टोकन + आउटपुट टोकन) प्रोसेस कर सकता है. पूर्णांक 512
topK जनरेट करने के हर चरण में मॉडल कितने टोकन का इस्तेमाल करता है. पूर्वानुमानों को सबसे ज़्यादा संभावना वाले टॉप k टोकन तक सीमित करता है. पूर्णांक 40
temperature जनरेट करने के दौरान, बिना किसी क्रम के जोड़े गए डेटा की मात्रा. ज़्यादा तापमान पर, जनरेट किए गए टेक्स्ट में ज़्यादा क्रिएटिविटी दिखती है. वहीं, कम तापमान पर, जनरेट किए गए टेक्स्ट में ज़्यादा अनुमान लगाया जा सकता है. फ़्लोट 0.8
randomSeed टेक्स्ट जनरेट करने के दौरान इस्तेमाल किया गया रैंडम सीड. पूर्णांक 0
loraRanks LoRA मॉडल, रनटाइम के दौरान इस्तेमाल करने के लिए LoRA रैंक. ध्यान दें: यह सिर्फ़ GPU मॉडल के साथ काम करता है. पूर्णांकों का कलेक्शन लागू नहीं

मॉडल कन्वर्ज़न

LLM Inference API का इस्तेमाल इन मॉडल के साथ किया जा सकता है. इनमें से कुछ मॉडल के लिए, मॉडल कन्वर्ज़न की ज़रूरत होती है. अपने मॉडल के लिए ज़रूरी चरणों/तरीके की पहचान करने के लिए, इस टेबल का इस्तेमाल करें.

मॉडल कन्वर्ज़न का तरीका इन प्लैटफ़ॉर्म पर काम करता है फ़ाइल टाइप
Gemma-3 1B कन्वर्ज़न की ज़रूरत नहीं है Android, वेब .task
Gemma 2B, Gemma 7B, Gemma-2 2B कन्वर्ज़न की ज़रूरत नहीं है Android, iOS, वेब .bin
Phi-2, StableLM, Falcon MediaPipe कन्वर्ज़न स्क्रिप्ट Android, iOS, वेब .bin
PyTorch के सभी एलएलएम मॉडल AI Edge Torch Generative library Android, iOS .task

अन्य मॉडल को बदलने का तरीका जानने के लिए, मॉडल कन्वर्ज़न सेक्शन देखें.

LoRA को पसंद के मुताबिक बनाना

एलएलएम इन्फ़्रेंस एपीआई, PEFT (पैरामीटर-इफ़िशिएंट फ़ाइन-ट्यूनिंग) लाइब्रेरी का इस्तेमाल करके, LoRA (लो-रैंक अडैप्टेशन) ट्यूनिंग के साथ काम करता है. LoRA ट्यूनिंग की मदद से, एलएलएम के व्यवहार को पसंद के मुताबिक बनाया जा सकता है. इसके लिए, ट्रेनिंग की कम लागत वाली प्रोसेस का इस्तेमाल किया जाता है. इससे ट्रेनिंग के लिए उपलब्ध वज़न का एक छोटा सेट तैयार होता है. यह सेट, पूरे मॉडल को फिर से ट्रेन करने के बजाय, नए ट्रेनिंग डेटा पर आधारित होता है.

LLM Inference API, Gemma-2 2B, Gemma 2B, और Phi-2 मॉडल की अटेंशन लेयर में LoRA वेट जोड़ने की सुविधा देता है. मॉडल को safetensors फ़ॉर्मैट में डाउनलोड करें.

LoRA वेट बनाने के लिए, बेस मॉडल safetensors फ़ॉर्मैट में होना चाहिए. LoRA ट्रेनिंग के बाद, मॉडल को MediaPipe पर चलाने के लिए, उन्हें FlatBuffers फ़ॉर्मैट में बदला जा सकता है.

LoRA वेट तैयार करना

अपने डेटासेट पर फ़ाइन-ट्यून किए गए LoRA मॉडल को ट्रेन करने के लिए, PEFT की LoRA Methods गाइड का इस्तेमाल करें.

LLM Inference API, सिर्फ़ ध्यान देने वाली लेयर पर LoRA के साथ काम करता है. इसलिए, LoraConfig में सिर्फ़ ध्यान देने वाली लेयर तय करें:

# For Gemma
from peft import LoraConfig
config = LoraConfig(
    r=LORA_RANK,
    target_modules=["q_proj", "v_proj", "k_proj", "o_proj"],
)

# For Phi-2
config = LoraConfig(
    r=LORA_RANK,
    target_modules=["q_proj", "v_proj", "k_proj", "dense"],
)

तैयार किए गए डेटासेट पर ट्रेनिंग देने और मॉडल को सेव करने के बाद, फ़ाइन-ट्यून किए गए LoRA मॉडल के वेट, adapter_model.safetensors में उपलब्ध होते हैं. safetensors फ़ाइल, LoRA चेकपॉइंट है. इसका इस्तेमाल मॉडल कन्वर्ज़न के दौरान किया जाता है.

मॉडल कन्वर्ज़न

मॉडल के वज़न को Flatbuffer फ़ॉर्मैट में बदलने के लिए, MediaPipe Python पैकेज का इस्तेमाल करें. ConversionConfig, बेस मॉडल के विकल्पों के साथ-साथ LoRA के अतिरिक्त विकल्पों के बारे में बताता है.

import mediapipe as mp
from mediapipe.tasks.python.genai import converter

config = converter.ConversionConfig(
  # Other params related to base model
  ...
  # Must use gpu backend for LoRA conversion
  backend='gpu',
  # LoRA related params
  lora_ckpt=LORA_CKPT,
  lora_rank=LORA_RANK,
  lora_output_tflite_file=LORA_OUTPUT_FILE,
)

converter.convert_checkpoint(config)

कन्वर्टर, MediaPipe के साथ काम करने वाली दो फ़ाइलें बनाएगा. इनमें से एक फ़ाइल, बेस मॉडल के लिए होगी और दूसरी फ़ाइल, LoRA मॉडल के लिए होगी.

LoRA मॉडल का अनुमान

वेब, रनटाइम के दौरान डाइनैमिक LoRA का इस्तेमाल करता है. इसका मतलब है कि उपयोगकर्ता, LoRA रैंक का एलान इनिशियलाइज़ेशन के दौरान करते हैं. इसका मतलब है कि रनटाइम के दौरान, अलग-अलग LoRA मॉडल बदले जा सकते हैं.

const genai = await FilesetResolver.forGenAiTasks(
    // path/to/wasm/root
    "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-genai@latest/wasm"
);
const llmInference = await LlmInference.createFromOptions(genai, {
    // options for the base model
    ...
    // LoRA ranks to be used by the LoRA models during runtime
    loraRanks: [4, 8, 16]
});

बेस मॉडल को शुरू करने के बाद, रनटाइम के दौरान LoRA मॉडल लोड करें. एलएलएम से जवाब जनरेट करते समय, मॉडल का रेफ़रंस पास करके LoRA मॉडल को ट्रिगर करें.

// Load several LoRA models. The returned LoRA model reference is used to specify
// which LoRA model to be used for inference.
loraModelRank4 = await llmInference.loadLoraModel(loraModelRank4Url);
loraModelRank8 = await llmInference.loadLoraModel(loraModelRank8Url);

// Specify LoRA model to be used during inference
llmInference.generateResponse(
  inputPrompt,
  loraModelRank4,
  (partialResult, done) => {
        document.getElementById('output').textContent += partialResult;
});