Parte 2: crea un sistema di rilevamento della tossicità basato sull'IA lato client

let classifier = null;
(async function () {
  // Signal to the main thread that model preparation has started
  self.postMessage({ code: MESSAGE_CODE.PREPARING_MODEL, payload: null });
  try {
    // Prepare the model
    classifier = await pipeline('text-classification', MODEL_NAME);
    // Signal to the main thread that the model is ready
    self.postMessage({ code: MESSAGE_CODE.MODEL_READY, payload: null });
  } catch (error) {
    console.error('[Worker] Error preparing model:', error);
    self.postMessage({ code: MESSAGE_CODE.MODEL_ERROR, payload: null });
  }
})();

Classificare l'input dell'utente

Nella nostra funzione classify, utilizziamo il classificatore creato in precedenza per analizzare un commento dell'utente. Restituiamo l'output non elaborato del classificatore di tossicità: etichette e punteggi.

// Asynchronous function to classify user input
// output: [{ label: 'toxic', score: 0.9243140482902527 },
// ... { label: 'insult', score: 0.96187334060668945 }
// { label: 'obscene', score: 0.03452680632472038 }, ...etc]
async function classify(text) {
  if (!classifier) {
    throw new Error("Can't run inference, the model is not ready yet");
  }
  let results = await classifier(text, { topk: null });
  return results;
}

Chiamiamo la nostra funzione di classificazione quando il thread principale chiede al worker di farlo. Nella nostra demo, attiviamo il classificatore non appena l'utente smette di digitare (vedi TYPING_DELAY). Quando ciò accade, il nostro thread principale invia un messaggio al worker che contiene l'input dell'utente da classificare.

self.onmessage = async function (message) {
  // User input
  const textToClassify = message.data;
  if (!classifier) {
    throw new Error("Can't run inference, the model is not ready yet");
  }
  self.postMessage({ code: MESSAGE_CODE.GENERATING_RESPONSE, payload: null });

  // Inference: run the classifier
  let classificationResults = null;
  try {
    classificationResults = await classify(textToClassify);
  } catch (error) {
    console.error('[Worker] Error: ', error);
    self.postMessage({
      code: MESSAGE_CODE.INFERENCE_ERROR,
    });
    return;
  }
  const toxicityTypes = getToxicityTypes(classificationResults);
  const toxicityAssessement = {
    isToxic: toxicityTypes.length > 0,
    toxicityTypeList: toxicityTypes.length > 0 ? toxicityTypes.join(', ') : '',
  };
  console.info('[Worker] Toxicity assessed: ', toxicityAssessement);
  self.postMessage({
    code: MESSAGE_CODE.RESPONSE_READY,
    payload: toxicityAssessement,
  });
};

Elaborare l'output

Controlliamo se i punteggi di output del classificatore superano la nostra soglia. In questo caso, prendiamo nota dell'etichetta in questione.

Se è presente una delle etichette di tossicità, il commento viene contrassegnato come potenzialmente tossico.

// input: [{ label: 'toxic', score: 0.9243140482902527 }, ...
// { label: 'insult', score: 0.96187334060668945 },
// { label: 'obscene', score: 0.03452680632472038 }, ...etc]
// output: ['toxic', 'insult']
function getToxicityTypes(results) {
  const toxicityAssessment = [];
  for (let element of results) {
    // If a label's score > our threshold, save the label
    if (element.score > TOXICITY_THRESHOLD) {
      toxicityAssessment.push(element.label);
    }
  }
  return toxicityAssessment;
}

self.onmessage = async function (message) {
  // User input
  const textToClassify = message.data;
  if (!classifier) {
    throw new Error("Can't run inference, the model is not ready yet");
  }
  self.postMessage({ code: MESSAGE_CODE.GENERATING_RESPONSE, payload: null });

  // Inference: run the classifier
  let classificationResults = null;
  try {
    classificationResults = await classify(textToClassify);
  } catch (error) {
    self.postMessage({
      code: MESSAGE_CODE.INFERENCE_ERROR,
    });
    return;
  }
  const toxicityTypes = getToxicityTypes(classificationResults);
  const toxicityAssessement = {
    // If any toxicity label is listed, the comment is flagged as
    // potentially toxic (isToxic true)
    isToxic: toxicityTypes.length > 0,
    toxicityTypeList: toxicityTypes.length > 0 ? toxicityTypes.join(', ') : '',
  };
  self.postMessage({
    code: MESSAGE_CODE.RESPONSE_READY,
    payload: toxicityAssessement,
  });
};

Mostrare un suggerimento

Se isToxic è true, mostriamo un suggerimento all'utente. Nella nostra demo non utilizziamo il tipo di tossicità più granulare, ma l'abbiamo reso disponibile al thread principale, se necessario (toxicityTypeList). Potresti trovarlo utile per il tuo caso d'uso.

Esperienza utente

Nella nostra demo, abbiamo effettuato le seguenti scelte:

• Consenti sempre la pubblicazione. Il suggerimento sulla tossicità lato client non impedisce all'utente di pubblicare. Nella nostra demo, l'utente può pubblicare un commento anche se il modello non è stato caricato (e quindi non offre una valutazione della tossicità) e anche se il commento viene rilevato come tossico. Come consigliato, dovresti avere un secondo sistema per rilevare i commenti tossici. Se ha senso per la tua applicazione, valuta la possibilità di informare l'utente che il suo commento è stato pubblicato sul client, ma è stato segnalato sul server o durante l'ispezione umana.
• Tieni conto dei falsi negativi. Quando un commento non viene classificato come tossico, la nostra demo non offre feedback (ad esempio, "Bel commento!"). Oltre a essere rumoroso, offrire feedback positivi può inviare un segnale sbagliato, perché il nostro classificatore a volte, ma inevitabilmente, non rileva alcuni commenti tossici.

Miglioramenti e alternative

Limitazioni e miglioramenti futuri

• Lingue: il modello che utilizziamo supporta principalmente l'inglese. Per il supporto multilingue, è necessario il perfezionamento. Diversi modelli di tossicità elencati su Hugging Face supportano lingue diverse dall'inglese (russo, olandese), anche se al momento non sono compatibili con Transformers.js.
• Sfumature: sebbene toxic-bert rilevi efficacemente la tossicità palese, potrebbe avere difficoltà con casi più sottili o dipendenti dal contesto (ironia, sarcasmo). La tossicità può essere altamente soggettiva e sottile. Ad esempio, potresti voler che determinati termini o persino emoji vengano classificati come tossici. Il perfezionamento può contribuire a migliorare l'accuratezza in questi ambiti.

È in arrivo un articolo sul perfezionamento di un modello di tossicità.

Alternative

• MediaPipe per la classificazione del testo. Assicurati di utilizzare un modello compatibile con le attività di classificazione.

• Classificatore di tossicità TensorFlow.js. Offre un modello più piccolo e più veloce da recuperare, ma non è stato ottimizzato da un po' di tempo, quindi potresti notare che l'inferenza è un po' più lenta rispetto a Transformers.js.

Conclusione

Il rilevamento della tossicità lato client è uno strumento potente per migliorare le community online.

Sfruttando modelli di AI come Toxic-BERT che vengono eseguiti nel browser con Transformers.js, puoi implementare meccanismi di feedback in tempo reale che scoraggiano comportamenti tossici e riducono il carico di classificazione della tossicità sui server.

Questo approccio lato client funziona già su tutti i browser. Tuttavia, tieni presente le limitazioni, soprattutto in termini di costi di pubblicazione del modello e dimensioni del download. Applica le best practice per il rendimento dell'AI lato client e memorizza il modello nella cache.

Per un rilevamento completo della tossicità, combina approcci lato client e lato server.