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

Maud Nalpas
Maud Nalpas
Kenji Baheux
Kenji Baheux
Alexandra Klepper
Alexandra Klepper

Yayınlanma tarihi: 16 Mayıs 2024

Olumlu ve olumsuz yorumlar, alıcıların satın alma kararını etkileyebilir.

Harici araştırmalara göre, internetten alışveriş yapanların% 82'si bir şey satın almadan önce aktif olarak olumsuz yorumlar almak istiyor. Olumsuz yorumların bulunması, iade oranlarını düşürmeye ve üreticilerin ürünlerini iyileştirmesine yardımcı olabileceğinden bu yorumlar hem müşteriler hem de işletmeler için faydalıdır.

İnceleme kalitesini iyileştirmenin birkaç yolu:

  • Gönderilmeden önce her yorumu toksik olup olmadığını kontrol edin. Kullanıcıları, yorumlarının diğer kullanıcıların daha iyi bir satın alma kararı vermesine yardımcı olması için rahatsız edici dillerin yanı sıra faydalı olmayan diğer ifadeleri kaldırmaya teşvik edebiliriz.
    • Negatif: Bu çanta berbat ve ondan nefret ediyorum.
    • Faydalı geri bildirim içeren olumsuz Fermuarlar çok sert ve kumaş kalitesi düşük. Bu çantayı iade ettim.
  • Yorumda kullanılan dile göre otomatik olarak derecelendirme oluşturma
  • Yorumun olumsuz mu yoksa olumlu mu olduğunu belirleyin.
Duygu ve yıldız puanı içeren örnek yorumun ekran görüntüsü.
Bu örnekte, yorumcuya olumlu bir duygu ve beş yıldızlı bir puan verilmiştir.

Ürün puanı konusunda son söz kullanıcıya aittir.

Aşağıdaki codelab'de cihaz üzerinde ve tarayıcıda istemci tarafı çözümler sunulmaktadır. AI geliştirme bilgisi, sunucu veya API anahtarı gerekmez.

Ön koşullar

Gemini API veya OpenAI API gibi çözümlere sahip 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 işlemi, 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 kod laboratuvarında, 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:

  • Toksisite 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'ın bir 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 teknolojiyle oluşturulmuş hafif, açık modeller ailesidir. Gemma'yı tarayıcıda çalıştırmak için MediaPipe'in deneysel LLM Tahmin API'siyle kullanırız.

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

Optimum kullanıcı deneyimi ve güvenliği sağlamak için dikkate alınması gereken birkaç nokta vardır:

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

TensorFlow.js ile toksisiteyi analiz etme

TensorFlow.js ile kullanıcıların yorumlarının kirliliğini analiz etmeye hemen başlayabilirsiniz.

  1. TensorFlow.js kitaplığını ve kötü niyetli davranış modelini yükleyin ve import.
  2. Minimum tahmin güveni belirleyin. Varsayılan değer 0, 85'tir. Ö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, toksisiteyi kimlik saldırısı, hakaret, müstehcenlik ve daha birçok kategoriye ayı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(
    (prediction) => prediction.results[0].match
);

Transformers.js ile duyguyu belirleme

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

  2. Yaklaşım analizi görevini özel bir ardışık düzenle oluşturun. Bir ardışık düzen ilk kez kullanıldığında model indirilir ve önbelleğe alınır. O zamandan sonra, duygu analizi çok daha hızlı olacaktır.

  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 } = sentimentResult[0];
if (score > SENTIMENT_THRESHOLD) {
  // The sentiment is `label`
} else {
  // Classification is not conclusive
}

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

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

Bu yeni özellik, istemci tarafı modellerden yüz kat daha büyük olan LLM'lerin bellek ve bilgi işlem talepleri göz önüne alındığında özellikle dönüştürücüdür. Web yığını genelinde optimizasyonlar bunu (yeni işlemler, miktar belirleme, önbelleğe alma ve ağırlık paylaşımı dahil) mümkün kılar. Kaynak: "MediaPipe ve TensorFlow Lite ile Cihazdaki Büyük Dil Modelleri".

  1. MediaPipe LLM çıkarım API'sini yükleyin ve içe aktarın.
  2. Bir model indirin. Burada, Kaggle'dan indirilen Gemma 2B'yi kullanıyoruz. Gemma 2B, Google'ın açık ağırlıklı modellerinin en küçüğüdür.
  3. FilesetResolver ile kodu doğru model dosyalarına yönlendirin. Üretken yapay zeka modellerinin öğeleri için belirli bir dizin yapısı olabileceğinden bu önemlidir.
  4. Modeli MediaPipe'ın LLM arayüzüyle yükleyip yapılandırın. Modeli kullanıma hazırlayın: Modelin konumunu, tercih edilen yanıt uzunluğunu ve sıcaklıkla tercih edilen yaratıcılık düzeyini belirtin.
  5. Modele bir istem sunun (örneğe bakın).
  6. Modelin yanıtını bekleyin.
  7. Derecelendirme için ayrıştır: Modelin yanıtından yıldız puanını ayıklayı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 iterasyonlar gerekir ancak kodun geri kalanı standart web geliştirmesidir.

İstemci tarafı modeller oldukça doğrudur. Bu belgedeki snippet'leri çalıştırırsanız hem toksisite hem de duygu analizinin doğru sonuçlar verdiğini görürsünüz. Test edilen birkaç referans yorum için Gemma puanları, Gemini model puanlarıyla büyük oranda eşleşti. Doğruluğu doğrulamak için daha fazla test yapılması gerekir.

Bununla birlikte, Gemma 2B için istemi tasarlamak zaman alır. Gemma 2B küçük bir LLM olduğundan tatmin edici sonuçlar elde etmek için ayrıntılı bir istem gerekir. Bu istem, Gemini API'de gerekenden çok daha ayrıntılı olmalıdır.

Tahminler çok hızlı olabilir. Bu belgedeki snippet'leri çalıştırırsanız çıkarım işleminin bazı cihazlarda hızlı, hatta sunucu gidiş gelişlerinden daha hızlı olabileceğini gözlemleyebilirsiniz. Bununla birlikte, çıkarım hızı büyük ölçüde değişebilir. Hedef cihazlarda kapsamlı bir karşılaştırma yapılması gerekir. WebGPU, WebAssembly ve kitaplık güncellemeleriyle tarayıcı çıkarımının daha da hızlanmasını bekliyoruz. Örneğin, Transformers.js v3'te Web GPU desteği ekler. Bu, cihaz üzerinde çıkarım yapma işlemini 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 zekayı çalıştırmak için genellikle hem bir kitaplığa hem de bir modele ihtiyacınız vardır. Bu model, web uygulamanızın indirme boyutunu artırır.

Tensorflow toksisite modeli (klasik bir doğal dil işleme modeli) yalnızca birkaç kilobayt boyutundayken Transformers.js'in 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 kadar büyük olabilir. Bu, ortanca 2,2 mb web sayfası boyutunu aşıyor.Bu boyut, en iyi performans için önerilenden çok daha büyüktür. İstemci tarafı üretken yapay zeka, belirli senaryolarda kullanılabilir.

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

Sonraki adımlar

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