Поощряйте полезные обзоры продуктов с помощью веб-ИИ на стороне клиента.

Кенджи Баэ
Kenji Baheux
Александра Клеппер
Alexandra Klepper

Опубликовано: 16 мая 2024 г.

Положительные и отрицательные отзывы могут повлиять на решение покупателя о покупке.

Согласно внешним исследованиям, 82% онлайн-покупателей активно ищут негативные отзывы перед совершением покупки. Эти негативные отзывы полезны как для клиентов, так и для бизнеса, поскольку наличие отрицательных отзывов может помочь снизить процент возвратов и помочь производителям улучшить свою продукцию.

Вот несколько способов улучшить качество отзыва:

  • Перед отправкой проверяйте каждый отзыв на наличие негативных высказываний. Мы могли бы призвать пользователей удалять оскорбительные выражения, а также другие бесполезные замечания, чтобы их отзыв максимально помог другим пользователям принять более взвешенное решение о покупке.
    • Минусы : Эта сумка ужасна, я её ненавижу.
    • Отрицательный отзыв с полезными замечаниями: молнии очень тугие, а материал кажется дешевым. Я вернула эту сумку.
  • Автоматически генерирует оценку на основе языка, использованного в отзыве.
  • Определите, является ли отзыв положительным или отрицательным.
Скриншот примера отзыва с оценкой настроения и количеством звезд.
В этом примере комментарию рецензента присваивается положительный отзыв и пятизвездочная оценка.

В конечном итоге, окончательное слово в оценке товара должно оставаться за пользователем.

В этом практическом занятии предлагаются решения для клиентской части, работающие на устройстве и в браузере. Знания в области разработки ИИ, серверы или ключи API не требуются.

Предварительные требования

Хотя серверные решения для ИИ (такие как API Gemini или API OpenAI ) предлагают надежные варианты для многих приложений, в этом руководстве мы сосредоточимся на клиентском веб-ИИ. Выполнение задач ИИ на стороне клиента происходит в браузере, что улучшает взаимодействие с веб-пользователями за счет исключения обращений к серверу.

В этом практическом занятии мы используем сочетание различных методов, чтобы показать вам, что есть в вашем арсенале для разработки ИИ на стороне клиента.

Мы используем следующие библиотеки и модели:

  • TensorFlow.js для анализа токсичности. TensorFlow.js — это библиотека машинного обучения с открытым исходным кодом для выполнения инференции и обучения в веб-среде.
  • transformers.js — библиотека веб-ИИ от Hugging Face.
  • Gemma 2B для звездных рейтингов. Gemma — это семейство легковесных открытых моделей, созданных на основе исследований и технологий, которые Google использовала для создания моделей Gemini. Для запуска Gemma в браузере мы используем ее с экспериментальным API LLM Inference от MediaPipe.

Вопросы удобства использования и безопасности

Для обеспечения оптимального пользовательского опыта и безопасности необходимо учитывать несколько факторов:

  • Предоставьте пользователю возможность редактировать оценку. В конечном итоге, окончательное решение по оценке товара должно оставаться за пользователем.
  • Четко объясните пользователю, что оценка и отзывы формируются автоматически.
  • Разрешите пользователям оставлять отзывы, классифицируемые как токсичные, но выполните повторную проверку на сервере. Это предотвратит неприятные ситуации, когда нетоксичный отзыв ошибочно классифицируется как токсичный (ложное срабатывание). Это также охватывает случаи, когда злоумышленнику удается обойти проверку на стороне клиента.
  • Проверка на токсичность на стороне клиента полезна, но её можно обойти. Убедитесь, что вы также выполняете проверку на стороне сервера.

Анализ токсичности с помощью TensorFlow.js

С помощью TensorFlow.js можно быстро начать анализ негативного характера пользовательских отзывов.

  1. Установите и импортируйте библиотеку TensorFlow.js и модель токсичности.
  2. Установите минимальный уровень достоверности прогноза. Значение по умолчанию — 0,85, а в нашем примере мы установили его равным 0,9.
  3. Загружайте модель асинхронно.
  4. Классифицируйте обзор асинхронно. Наш код выявляет прогнозы, превышающие пороговое значение 0,9 для любой категории.

Эта модель позволяет классифицировать токсичность по таким категориям, как нападки на личность, оскорбления, непристойность и многое другое.

Например:

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

  1. Установите и импортируйте библиотеку Transformers.js.

  2. Настройте задачу анализа настроений с помощью выделенного конвейера . При первом использовании конвейера модель загружается и кэшируется. С этого момента анализ настроений должен выполняться значительно быстрее.

  3. Классифицируйте обзор асинхронно. Используйте пользовательский пороговый уровень для установки уровня достоверности, который вы считаете приемлемым для вашего приложения.

Например:

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
}

Предложите оценку в виде звезд с помощью Джеммы и MediaPipe.

С помощью API LLM Inference вы можете запускать большие языковые модели (LLM) полностью в браузере.

Эта новая возможность особенно важна, учитывая требования к памяти и вычислительным ресурсам больших языковых моделей, которые более чем в сто раз превышают размеры клиентских моделей. Это стало возможным благодаря оптимизации всего веб-стека, включая новые операции, квантизацию, кэширование и распределение весов. Источник: «Large Language Models On-Device with MediaPipe and TensorFlow Lite» .

  1. Установите и импортируйте API для вывода данных MediaPipe LLM.
  2. Скачайте модель . Здесь мы используем Gemma 2B , скачанную с Kaggle . Gemma 2B — самая маленькая из открытых моделей Google.
  3. Укажите коду нужные файлы модели с помощью FilesetResolver . Это важно, поскольку модели генеративного ИИ могут иметь специфическую структуру каталогов для своих ресурсов.
  4. Загрузите и настройте модель с помощью интерфейса LLM MediaPipe. Подготовьте модель к использованию: укажите ее местоположение, желаемую длину ответов и желаемый уровень изобретательности при работе с температурой.
  5. Дайте модели подсказку ( см. пример ).
  6. Дождитесь ответа модели.
  7. Анализ для получения рейтинга: извлеките звездный рейтинг из ответа модели.
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);

Пример подсказки

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`;

Основные выводы

Опыт в области ИИ/машинного обучения не требуется . Разработка запроса требует итераций, но остальная часть кода соответствует стандартной веб-разработке.

Клиентские модели достаточно точны . Если вы запустите фрагменты кода из этого документа, вы увидите, что анализ токсичности и анализ настроения дают точные результаты. Рейтинги Gemma в большинстве случаев совпали с рейтингами модели Gemini для нескольких протестированных отзывов. Для подтверждения этой точности необходимы дополнительные тесты.

Тем не менее, разработка запроса для Gemma 2B требует усилий. Поскольку Gemma 2B — это небольшой магистерский курс, для получения удовлетворительных результатов необходим подробный запрос, значительно более подробный, чем тот, который требуется при использовании API Gemini.

Выполнение инференса может быть молниеносным . Если вы запустите фрагменты кода из этого документа, вы заметите, что инференс может работать быстро, потенциально быстрее, чем время отклика сервера, на ряде устройств. Тем не менее, скорость инференса может сильно варьироваться. Необходим тщательный бенчмаркинг на целевых устройствах. Мы ожидаем, что скорость инференса в браузере будет продолжать расти благодаря обновлениям WebGPU, WebAssembly и библиотек. Например, Transformers.js добавляет поддержку WebGPU в версии 3 , что может значительно ускорить инференс на устройстве .

Размер загружаемых файлов может быть очень большим. Выполнение вычислений в браузере происходит быстро, но загрузка моделей ИИ может представлять собой проблему. Для выполнения вычислений ИИ в браузере обычно требуется как библиотека, так и модель, что увеличивает размер загружаемого файла веб-приложения.

В то время как модель анализа токсичности Tensorflow (классическая модель обработки естественного языка) занимает всего несколько килобайт, модели генеративного ИИ, такие как стандартная модель анализа настроения Transformers.js, достигают 60 МБ. Большие языковые модели, такие как Gemma, могут занимать до 1,3 ГБ. Это значительно превышает средний размер веб-страницы в 2,2 МБ , что уже намного больше, чем рекомендуется для оптимальной производительности. Клиентский генеративный ИИ жизнеспособен в определенных сценариях.

Область генеративного искусственного интеллекта в интернете стремительно развивается! В будущем ожидается появление более компактных, оптимизированных для веб-среды моделей.

Следующие шаги

Chrome экспериментирует с еще одним способом запуска генеративного ИИ в браузере. Вы можете зарегистрироваться в программе раннего предварительного просмотра, чтобы протестировать его.