İstemci tarafı web yapay zekası ile faydalı ürün yorumlarını teşvik edin

Maud Nalpas

Kenji Baheux

Alexandra Klepper

Yayınlanma tarihi: 16 Mayıs 2024

Olumlu ve olumsuz yorumlar, alıcının satın alma kararına yön verebilir.

Harici araştırmalara göre, online alışveriş yapanların% 82'si satın alma işlemi gerçekleştirmeden önce aktif olarak olumsuz yorumları arıyor. Olumsuz yorumlar, müşteriler ve işletmeler için faydalıdır. Olumsuz yorumların varlığı, iade oranlarının düşmesine ve üreticilerin ürünlerini iyileştirmesine yardımcı olabilir.

Yorum kalitesini artırmak için yapabilecekleriniz:

• Gönderilmeden önce her yorumun uygunsuzluk açısından kontrol edilmesi Kullanıcıları, yorumlarının diğer kullanıcılara daha iyi bir satın alma kararı vermelerinde en iyi şekilde yardımcı olması için rahatsız edici ifadeleri ve diğer faydasız yorumları kaldırmaya teşvik edebiliriz.
  • Olumsuz: Bu çanta berbat ve nefret ediyorum.
  • Faydalı geri bildirim içeren olumsuz yorum Fermuarlar çok sert ve malzeme kalitesiz görünüyor. Bu çantayı iade ettim.
• Yorumda kullanılan dile göre otomatik olarak derecelendirme oluşturma
• Yorumun olumsuz mu yoksa olumlu mu olduğunu belirleyin.

Sonuç olarak, ürün puanı konusunda son sözü kullanıcı söylemelidir.

Aşağıdaki codelab, istemci tarafı çözümlerini cihazda ve tarayıcıda sunar. Yapay zeka geliştirme bilgisi, sunucu veya API anahtarı gerekmez.

Ön koşullar

Çözümlerle (ör. Gemini API veya OpenAI API) sunulan sunucu tarafı yapay zeka, birçok uygulama için güçlü çözümler sunsa da bu kılavuzda istemci tarafı web yapay zekasına odaklanıyoruz. İstemci tarafı yapay zeka çıkarımı, sunucu gidiş dönüşlerini kaldırarak web kullanıcılarının deneyimini iyileştirmek için tarayıcıda gerçekleşir.

Bu codelab'de, istemci tarafı yapay zeka için araç kutunuzda neler olduğunu göstermek amacıyla çeşitli teknikler kullanıyoruz.

Aşağıdaki kitaplıkları ve modelleri kullanırız:

• Zararlılık analizi için TensforFlow.js TensorFlow.js, web'de hem çıkarım hem de eğitim için açık kaynaklı bir makine öğrenimi kitaplığıdır.
• Duygu analizi için transformers.js. Transformers.js, Hugging Face'in web yapay zeka kitaplığıdır.
• Yıldız puanları için Gemma 2B. Gemma, Google'ın Gemini modellerini oluşturmak için kullandığı araştırma ve teknolojiden yararlanılarak geliştirilmiş, hafif ve açık bir model ailesidir. Gemma'yı tarayıcıda çalıştırmak için MediaPipe'ın deneysel LLM Inference API'siyle birlikte kullanırız.

Kullanıcı deneyimi ve güvenlik ile ilgili dikkat edilmesi gereken noktalar

En iyi kullanıcı deneyimi ve güvenlik için dikkat edilmesi gereken birkaç nokta vardır:

• Kullanıcının derecelendirmeyi düzenlemesine izin verin. Sonuç olarak, ürün puanı konusunda son sözü kullanıcı söylemelidir.
• Puan ve yorumların otomatik olduğunu kullanıcıya açıkça belirtin.
• Kullanıcıların zararlı olarak sınıflandırılan yorumlar yayınlamasına izin verin ancak sunucuda ikinci bir kontrol gerçekleştirin. Bu sayede, zararlı olmayan bir yorumun yanlışlıkla zararlı olarak sınıflandırıldığı (yanlış pozitif) can sıkıcı bir deneyim önlenir. Bu, kötü amaçlı bir kullanıcının istemci tarafı kontrolünü atlamayı başardığı durumları da kapsar.
• İstemci tarafında yapılan uygunsuzluk kontrolü faydalı olsa da bu kontrol atlanabilir. Sunucu tarafında da kontrol yaptığınızdan emin olun.

TensorFlow.js ile toksisiteyi analiz etme

TensorFlow.js ile kullanıcı yorumlarının toksisitesini analiz etmeye hızlıca başlayabilirsiniz.

1. TensorFlow.js kitaplığını ve kötü niyetli davranış modelini yükleyin ve içe aktarın.
2. Minimum tahmin güveni belirleyin. Varsayılan değer 0, 85'tir. Biz örneğimizde bu değeri 0,9 olarak ayarladık.
3. Modeli eşzamansız olarak yükleyin.
4. Yorumu eşzamansız olarak sınıflandırın. Kodumuz, herhangi bir kategori için 0,9 eşiğini aşan tahminleri tanımlar.

Bu model, kimliğe yönelik saldırı, hakaret ve müstehcenlik gibi konularda toksik içerikleri sınıflandırabilir.

Örneğin:

import * as toxicity from '@tensorflow-models/toxicity';

// Minimum prediction confidence allowed
const TOXICITY_COMMENT_THRESHOLD = 0.9;

const toxicityModel = await toxicity.load(TOXICITY_COMMENT_THRESHOLD);
const toxicityPredictions = await toxicityModel.classify([review]);
// `predictions` is an array with the raw toxicity probabilities
const isToxic = toxicityPredictions.some(
    (predi>ction) = prediction.results[0].match
);

Transformers.js ile yaklaşımı belirleme

1. Transformers.js kitaplığını yükleyin ve içe aktarın.

2. Özel bir ardışık düzenle yaklaşım analizi görevini ayarlayın. Bir işlem hattı ilk kez kullanıldığında model indirilip önbelleğe alınır. Bu işlemden sonra duygu analizi çok daha hızlı yapılabilir.

3. Yorumu eşzamansız olarak sınıflandırın. Uygulamanız için kullanılabilir olduğunu düşündüğünüz güven düzeyini ayarlamak üzere özel bir eşik kullanın.

Örneğin:

import { pipeline } from '@xenova/transformers';

const SENTIMENT_THRESHOLD = 0.9;
// Create a pipeline (don't block rendering on this function)
const transformersjsClassifierSentiment = await pipeline(
  'sentiment-analysis'
);

// When the user finishes typing
const sentimentResult = await transformersjsClassifierSentiment(review);
const { label, score } = sentimentR>esult[0];
if (score  SENTIMENT_THRESHOLD) {
  // The sentiment is `label`
} else {
  // Classification is not conclusive
}

Gemma ve MediaPipe ile yıldız puanı önerme

LLM Inference API ile büyük dil modellerini (LLM'ler) tamamen tarayıcıda çalıştırabilirsiniz.

Bu yeni özellik, özellikle istemci tarafı modellerden yüz kat daha büyük olan LLM'lerin bellek ve işlem talepleri göz önüne alındığında dönüştürücü bir etkiye sahiptir. Yeni işlemler, nicemleme, önbelleğe alma ve ağırlık paylaşımı dahil olmak üzere web yığını genelinde yapılan optimizasyonlar bunu mümkün kılar. Kaynak: "Large Language Models On-Device with MediaPipe and TensorFlow Lite".

1. MediaPipe LLM Inference API'yi yükleyin ve içe aktarın.
2. Model indirme Burada, Kaggle'dan indirilen Gemma 2B'yi kullanıyoruz. Gemma 2B, Google'ın açık ağırlıklı modellerinin en küçüğüdür.
3. Kodu, FilesetResolver ile doğru model dosyalarına yönlendirin. Üretken yapay zeka modellerinin öğeleri için belirli bir dizin yapısı olabileceğinden bu önemlidir.
4. MediaPipe'ın LLM arayüzüyle modeli yükleyin ve yapılandırın. Modeli kullanıma hazırlayın: Modelin konumunu, yanıtların tercih edilen uzunluğunu ve sıcaklık ile tercih edilen yaratıcılık düzeyini belirtin.
5. Modele bir istem girin (örneğe göz atın).
6. Modelin yanıtını bekleyin.
7. Puanı ayrıştırın: Yıldız puanını modelin yanıtından çıkarın.

import { FilesetResolver, LlmInference } from '@mediapipe/tasks-genai';

const mediaPipeGenAi = await FilesetResolver.forGenAiTasks();
const llmInference = await LlmInference.createFromOptions(mediaPipeGenAi, {
    baseOptions: {
        modelAssetPath: '/gemma-2b-it-gpu-int4.bin',
    },
    maxTokens: 1000,
    topK: 40,
    temperature: 0.5,
    randomSeed: 101,
});

const prompt = …
const output = await llmInference.generateResponse(prompt);

const int = /\d/;
const ratingAsString = output.match(int)[0];
rating = parseInt(ratingAsString);

Örnek istem

const prompt = `Analyze a product review, and then based on your analysis give me the
corresponding rating (integer). The rating should be an integer between 1 and 5.
1 is the worst rating, and 5 is the best rating. A strongly dissatisfied review
that only mentions issues should have a rating of 1 (worst). A strongly
satisfied review that only mentions positives and upsides should have a rating
of 5 (best). Be opinionated. Use the full range of possible ratings (1 to 5). \n\n
  \n\n
  Here are some examples of reviews and their corresponding analyses and ratings:
  \n\n
  Review: 'Stylish and functional. Not sure how it'll handle rugged outdoor use,
  but it's perfect for urban exploring.'
  Analysis: The reviewer appreciates the product's style and basic
  functionality. They express some uncertainty about its ruggedness but overall
  find it suitable for their intended use, resulting in a positive, but not
  top-tier rating.
  Rating (integer): 4
  \n\n
  Review: 'It's a solid backpack at a decent price. Does the job, but nothing
  particularly amazing about it.'
  Analysis: This reflects an average opinion. The backpack is functional and
  fulfills its essential purpose. However, the reviewer finds it unremarkable
  and lacking any standout features deserving of higher praise.
  Rating (integer): 3
  \n\n
  Review: 'The waist belt broke on my first trip! Customer service was
  unresponsive too. Would not recommend.'
  Analysis: A serious product defect and poor customer service experience
  naturally warrants the lowest possible rating. The reviewer is extremely
  unsatisfied with both the product and the company.
  Rating (integer): 1
  \n\n
  Review: 'Love how many pockets and compartments it has. Keeps everything
  organized on long trips. Durable too!'
  Analysis: The enthusiastic review highlights specific features the user loves
  (organization and durability), indicating great satisfaction with the product.
  This justifies the highest rating.
  Rating (integer): 5
  \n\n
  Review: 'The straps are a bit flimsy, and they started digging into my
  shoulders under heavy loads.'
  Analysis: While not a totally negative review, a significant comfort issue
  leads the reviewer to rate the product poorly. The straps are a key component
  of a backpack, and their failure to perform well under load is a major flaw.
  Rating (integer): 1
  \n\n
  Now, here is the review you need to assess:
  \n
  Review: "${review}" \n`;

Çıkarımlar

Yapay zeka/makine öğrenimi uzmanlığı gerekmez. İstem tasarlamak için yineleme gerekir ancak kodun geri kalanı standart web geliştirme kodudur.

İstemci tarafı modelleri oldukça doğrudur. Bu belgedeki snippet'leri çalıştırırsanız hem kötü niyetli davranış hem de duygu analizi için doğru sonuçlar elde ettiğinizi görürsünüz. Gemma'nın puanları, test edilen birkaç referans yorumu için Gemini modelinin puanlarıyla büyük ölçüde eşleşti. Doğruluğu onaylamak için daha fazla test yapılması gerekiyor.

Bununla birlikte, Gemma 2B için istem tasarlamak zaman alır. Gemma 2B küçük bir LLM olduğundan tatmin edici sonuçlar üretmek için ayrıntılı bir isteme ihtiyaç duyar. Bu istem, Gemini API'de gerekenden daha ayrıntılıdır.

Çıkarım, ışık hızında olabilir. Bu dokümandaki snippet'leri çalıştırırsanız çıkarımın bazı cihazlarda hızlı, hatta sunucu gidiş dönüşlerinden daha hızlı olabileceğini gözlemlersiniz. Bununla birlikte, çıkarım hızı büyük ölçüde değişiklik gösterebilir. Hedef cihazlarda kapsamlı karşılaştırma yapılması gerekir. Tarayıcı çıkarımının WebGPU, WebAssembly ve kitaplık güncellemeleriyle birlikte daha da hızlanmasını bekliyoruz. Örneğin, Transformers.js v3'te Web GPU desteği ekler. Bu destek, cihaz üzerinde çıkarımı kat kat hızlandırabilir.

İndirme boyutları çok büyük olabilir. Tarayıcıda çıkarım hızlıdır ancak yapay zeka modellerini yüklemek zor olabilir. Tarayıcı içi yapay zeka işlevini kullanmak için genellikle hem kitaplığa hem de modele ihtiyacınız olur. Bu da web uygulamanızın indirme boyutunu artırır.

Tensorflow zehirli içerik modeli (klasik bir doğal dil işleme modeli) yalnızca birkaç kilobayt boyutundayken Transformers.js'nin varsayılan yaklaşım analizi modeli gibi üretken yapay zeka modelleri 60 MB'a ulaşır. Gemma gibi büyük dil modelleri 1,3 GB'a kadar olabilir. Bu, medyan 2,2 MB web sayfası boyutunu aşıyor.Bu boyut, en iyi performans için önerilen boyuttan çok daha büyük. İstemci tarafı üretken yapay zeka, belirli senaryolarda kullanılabilir.

Web'deki üretken yapay zeka alanı hızla gelişiyor. Gelecekte daha küçük ve web için optimize edilmiş modellerin ortaya çıkması bekleniyor.

Sonraki adımlar

Chrome, tarayıcıda üretken yapay zekayı çalıştırmanın başka bir yolunu deniyor. Özelliği test etmek için erken önizleme programına kaydolabilirsiniz.