Hugging Face and Open-Source Models

1// Model Categories on Hugging Face
2
3// TEXT GENERATION
4const textModels = {
5  small: "gpt2", // 124M params - fast, runs anywhere
6  medium: "facebook/opt-1.3b", // 1.3B params - good balance
7  large: "meta-llama/Llama-2-7b-chat-hf", // 7B params - high quality
8  enterprise: "mistralai/Mistral-7B-Instruct-v0.2" // 7B - excellent performance
9};
10
11// SENTIMENT ANALYSIS
12const sentimentModels = {
13  general: "distilbert-base-uncased-finetuned-sst-2-english",
14  multilingual: "nlptown/bert-base-multilingual-uncased-sentiment",
15  financial: "ProsusAI/finbert" // Domain-specific
16};
17
18// TEXT CLASSIFICATION
19const classificationModels = {
20  zeroShot: "facebook/bart-large-mnli", // No training needed!
21  topics: "cardiffnlp/twitter-roberta-base-topic-latest",
22  emotions: "j-hartmann/emotion-english-distilroberta-base"
23};
24
25// EMBEDDINGS
26const embeddingModels = {
27  fast: "sentence-transformers/all-MiniLM-L6-v2", // 384 dims
28  accurate: "sentence-transformers/all-mpnet-base-v2", // 768 dims
29  multilingual: "sentence-transformers/paraphrase-multilingual-MiniLM-L12-v2"
30};
31
32// COMPUTER VISION
33const visionModels = {
34  imageClassification: "google/vit-base-patch16-224",
35  objectDetection: "facebook/detr-resnet-50",
36  imageSegmentation: "facebook/mask2former-swin-large-coco-panoptic",
37  imageGeneration: "stabilityai/stable-diffusion-xl-base-1.0"
38};
39
40// AUDIO
41const audioModels = {
42  speechRecognition: "openai/whisper-base",
43  textToSpeech: "facebook/mms-tts-eng",
44  audioClassification: "MIT/ast-finetuned-audioset-10-10-0.4593"
45};

1// How to choose a model
2
3function selectModel(requirements) {
4  const criteria = {
5    // Performance Requirements
6    latency: "low", // low, medium, high tolerance
7    accuracy: "high", // minimum acceptable accuracy
8
9    // Resource Constraints
10    maxModelSize: "500MB", // download size
11    runEnvironment: "browser", // browser, server, edge
12    maxRAM: "2GB", // available memory
13
14    // Use Case
15    task: "sentiment-analysis",
16    language: "en", // or multilingual
17    domain: "general", // or finance, medical, legal
18
19    // Privacy & Cost
20    dataSensitivity: "high", // prefer on-device
21    expectedVolume: 1000000, // requests/month
22    budget: 100 // $/month
23  };
24
25  // For browser deployment
26  if (requirements.runEnvironment === "browser") {
27    // Use quantized models (ONNX, TensorFlow.js)
28    return "Xenova/distilbert-base-uncased-finetuned-sst-2-english";
29  }
30
31  // For server deployment
32  if (requirements.latency === "low") {
33    // Smaller models (< 1B params)
34    return "distilbert-base-uncased";
35  }
36
37  // For high accuracy
38  if (requirements.accuracy === "high") {
39    // Larger models (7B+ params)
40    return "meta-llama/Llama-2-7b-chat-hf";
41  }
42}

1// Hugging Face Inference API Client
2
3class HuggingFaceClient {
4  constructor(apiKey) {
5    this.apiKey = apiKey;
6    this.baseUrl = "https://api-inference.huggingface.co/models";
7  }
8
9  async query(modelId, inputs, options = {}) {
10    const response = await fetch(`${this.baseUrl}/${modelId}`, {
11      method: "POST",
12      headers: {
13        "Authorization": `Bearer ${this.apiKey}`,
14        "Content-Type": "application/json"
15      },
16      body: JSON.stringify({ inputs, ...options })
17    });
18
19    if (!response.ok) {
20      throw new Error(`HF API Error: ${response.statusText}`);
21    }
22
23    return await response.json();
24  }
25
26  // Sentiment Analysis
27  async analyzeSentiment(text) {
28    const result = await this.query(
29      "distilbert-base-uncased-finetuned-sst-2-english",
30      text
31    );
32    return result[0]; // [{ label: "POSITIVE", score: 0.99 }]
33  }
34
35  // Text Generation
36  async generateText(prompt, options = {}) {
37    const result = await this.query(
38      "gpt2",
39      prompt,
40      {
41        max_length: options.maxLength || 100,
42        temperature: options.temperature || 0.7,
43        top_p: options.topP || 0.9
44      }
45    );
46    return result[0].generated_text;
47  }
48
49  // Text Embeddings
50  async getEmbeddings(texts) {
51    const result = await this.query(
52      "sentence-transformers/all-MiniLM-L6-v2",
53      texts
54    );
55    return result;
56  }
57
58  // Zero-Shot Classification
59  async classifyZeroShot(text, candidateLabels) {
60    const result = await this.query(
61      "facebook/bart-large-mnli",
62      text,
63      { candidate_labels: candidateLabels }
64    );
65    return result;
66  }
67
68  // Question Answering
69  async answerQuestion(question, context) {
70    const result = await this.query(
71      "deepset/roberta-base-squad2",
72      { question, context }
73    );
74    return result;
75  }
76
77  // Summarization
78  async summarize(text, maxLength = 130) {
79    const result = await this.query(
80      "facebook/bart-large-cnn",
81      text,
82      { max_length: maxLength, min_length: 30 }
83    );
84    return result[0].summary_text;
85  }
86
87  // Translation
88  async translate(text, fromLang, toLang) {
89    const modelId = `Helsinki-NLP/opus-mt-${fromLang}-${toLang}`;
90    const result = await this.query(modelId, text);
91    return result[0].translation_text;
92  }
93
94  // Image Classification
95  async classifyImage(imageUrl) {
96    const result = await this.query(
97      "google/vit-base-patch16-224",
98      imageUrl
99    );
100    return result;
101  }
102}
103
104// Usage Examples
105const hf = new HuggingFaceClient(process.env.HF_API_KEY);
106
107// Sentiment
108const sentiment = await hf.analyzeSentiment("I love this product!");
109console.log(sentiment); // { label: "POSITIVE", score: 0.9998 }
110
111// Zero-shot classification (no training!)
112const classification = await hf.classifyZeroShot(
113  "The stock market rallied today on positive earnings news.",
114  ["finance", "sports", "technology", "politics"]
115);
116console.log(classification.labels[0]); // "finance"
117
118// Summarization
119const summary = await hf.summarize(`
120  [Long article text...]
121`);

1npm install @xenova/transformers

1import { pipeline } from '@xenova/transformers';
2
3// Sentiment Analysis (runs in browser!)
4class ClientSideAI {
5  async setupSentiment() {
6    this.sentimentPipeline = await pipeline(
7      'sentiment-analysis',
8      'Xenova/distilbert-base-uncased-finetuned-sst-2-english'
9    );
10  }
11
12  async analyzeSentiment(text) {
13    const result = await this.sentimentPipeline(text);
14    return result[0]; // { label: "POSITIVE", score: 0.9998 }
15  }
16
17  // Feature Extraction (embeddings)
18  async setupEmbeddings() {
19    this.embeddingPipeline = await pipeline(
20      'feature-extraction',
21      'Xenova/all-MiniLM-L6-v2'
22    );
23  }
24
25  async getEmbedding(text) {
26    const output = await this.embeddingPipeline(text, {
27      pooling: 'mean',
28      normalize: true
29    });
30    return output.data; // Float32Array of 384 dimensions
31  }
32
33  // Text Classification
34  async setupClassification() {
35    this.classifier = await pipeline(
36      'text-classification',
37      'Xenova/toxic-bert'
38    );
39  }
40
41  async detectToxicity(text) {
42    const result = await this.classifier(text);
43    return result;
44  }
45
46  // Translation
47  async setupTranslation() {
48    this.translator = await pipeline(
49      'translation',
50      'Xenova/opus-mt-en-es'
51    );
52  }
53
54  async translate(text) {
55    const result = await this.translator(text);
56    return result[0].translation_text;
57  }
58}
59
60// React Component Example
61function SentimentAnalyzer() {
62  const [sentiment, setSentiment] = useState(null);
63  const [loading, setLoading] = useState(false);
64  const pipelineRef = useRef(null);
65
66  useEffect(() => {
67    // Load model on component mount
68    async function loadModel() {
69      pipelineRef.current = await pipeline(
70        'sentiment-analysis',
71        'Xenova/distilbert-base-uncased-finetuned-sst-2-english'
72      );
73    }
74    loadModel();
75  }, []);
76
77  async function analyze(text) {
78    setLoading(true);
79    const result = await pipelineRef.current(text);
80    setSentiment(result[0]);
81    setLoading(false);
82  }
83
84  return (
85    <div>
86      <textarea onChange={(e) => analyze(e.target.value)} />
87      {loading ? "Analyzing..." : sentiment && (
88        <div>
89          {sentiment.label}: {(sentiment.score * 100).toFixed(1)}%
90        </div>
91      )}
92    </div>
93  );
94}

1import { pipeline, cos_sim } from '@xenova/transformers';
2
3class BrowserSemanticSearch {
4  constructor() {
5    this.documents = [];
6    this.embeddings = [];
7  }
8
9  async initialize() {
10    this.embedder = await pipeline(
11      'feature-extraction',
12      'Xenova/all-MiniLM-L6-v2'
13    );
14  }
15
16  async indexDocuments(documents) {
17    this.documents = documents;
18
19    // Generate embeddings for all documents
20    this.embeddings = await Promise.all(
21      documents.map(doc => this.embed(doc))
22    );
23  }
24
25  async embed(text) {
26    const output = await this.embedder(text, {
27      pooling: 'mean',
28      normalize: true
29    });
30    return output.data;
31  }
32
33  async search(query, topK = 5) {
34    const queryEmbedding = await this.embed(query);
35
36    // Calculate similarity scores
37    const scores = this.embeddings.map((docEmbed, idx) => ({
38      document: this.documents[idx],
39      score: cos_sim(queryEmbedding, docEmbed)
40    }));
41
42    // Sort by similarity
43    scores.sort((a, b) => b.score - a.score);
44
45    return scores.slice(0, topK);
46  }
47}
48
49// Usage
50const search = new BrowserSemanticSearch();
51await search.initialize();
52
53await search.indexDocuments([
54  "Machine learning is a subset of artificial intelligence",
55  "Python is a popular programming language",
56  "Neural networks are inspired by the human brain",
57  "JavaScript runs in web browsers"
58]);
59
60const results = await search.search("AI and ML");
61console.log(results);
62// [{ document: "Machine learning...", score: 0.85 }, ...]