ブラウザと Tensorflow.js を使った BERT の活用方法を考える

この記事は The TensorFlow Blog の記事 "Exploring helpful uses for BERT in your browser with Tensorflow.js" を元に翻訳・加筆したものです。詳しくは元記事をご覧ください。

投稿者: Philip Bayer（クリエイティブ テクノロジスト）、Ping Yu（ソフトウェア エンジニア）、Jason Mayes（デベロッパー アドボケート）


現在、言語で BERT を活用する方法について、たくさんのエキサイティングな研究が行われています。そこで、BERT をさらに身近な場所、つまり皆さんのウェブブラウザで使えるようにしたらどうなるだろうか、どんな活用法が生まれるだろうか、という疑問が浮かびました。

ウェブで Google に「自由の女神の高さはどれくらい？」といった質問をし、答え（93 メートル）を得るのは簡単です。しかし、ニュース記事、研究論文、ブログ投稿など、特定のコンテンツに関することを自然言語で尋ねる簡単な方法はありません。ブラウザのページ内検索機能（CTRL + F）を使うことはできますが、直接的なワード マッチングに頼ることになります。探したい言葉ではなく、質問を入力すればページで答えがハイライトされる方が簡単ではないでしょうか。

このアイデアについて考えるため、任意のウェブページについて質問できる MobileBERT Q&A モデルを使った Chrome 拡張機能のプロトタイプを作成しました。この拡張機能は、TensorFlow.js を使ってページの内容を元に回答を返します。モデルは完全に端末のブラウザ セッション内で動作するので、サーバーにデータが送られることはなく、プライバシーを維持できます。

まだ初期の実験段階ですが、このブログ投稿では、オープンソースの TensorFlow.js BERT モデルを使ってこのようなアプリケーションを構築する方法を説明するため、得られた知見を共有したいと思います。求めていた答えを得られた例や、期待はずれだった例について考えることは有益で、それによって可能性と、現時点での制約の両方を垣間見ることができました。こういった例に触れることで、誰もがこの議論に参加し、言語処理に機械学習をどう役立てることができるかというアイデアにつながることを期待しています。

Chrome 拡張機能で記事について質問すると、回答が得られる。

得られた知見

以下に、有益な答えが得られることがわかった結果の一部を示します。

• カニについての記事— 質問: “How do they move?”（どうやって移動しますか？）回答: “Crabs typically walk sideways”（カニは通常、横方向に移動します）
  
• ヘッドランプの製品ページ— 質問: “Can it get wet?”（濡らしても大丈夫ですか？）回答: “submersion in up to 1m of water for 30min”（水深 1 メートルの水に 30 分までの水没）
  
• 車のレビュー— 質問: “Gas mileage”（燃費） 回答: “19 miles per gallon in the city”（都市で 1 ガロンあたり 19 マイル）
  
• 木製のビルについての記事: — 質問: “How tall is it”（どのくらいの高さですか） 回答: “280 feet in height”（高さ 280 フィート）
  
• ラザニアのレシピ— 質問: “How long in the oven”（どのくらいの時間オーブンに入れますか） 回答: “25 minutes”（25 分）
  

モデルが期待どおりの回答を返さなかった例について考えるのも、興味深いことです。いくつかの例を示します。

• こちらの製品ページ— “What is the pitcher made of?”（容器は何でできていますか？）と尋ねると、“BPA-free polycarbonate pitcher”（BPA フリーのポリカーボネート製容器）という回答ではなく、“Ice mode pulses at staggered intervals to uniformly crush a pitcher of ice in seconds”（アイスモードでは、時間を少しずつずらして振動させることで、数秒で容器内の氷を均等に砕きます）を返します。
  
• こちらの記事— “Were the sharks real?”（サメは本物でしたか？）と尋ねると、“sharks! sharks”（サメだ！サメ）というテキストが返されます。しかし、これに関連する質問 “How did the sharks work?”（サメはうまく動きましたか？）をすると、もう少し役に立つ回答 “mechanical sharks often malfunctioned”（機械仕掛けのサメは故障することが多かった）が得られます。
  

機械学習モデルの仕組み

MobileBERT Q&A モデルを使うと、ユーザーの自然言語による質問に回答するシステムを構築できます。このモデルは、SQuAD 1.1（Stanford Question Answering Dataset）で細かくチューニングされた事前トレーニング済み BERT モデルを使って作成されています。これは、事前トレーニング言語表現の新しい手法で、実にさまざまな自然言語処理（NLP）タスクで最高水準の結果を得ることができます。うれしいことに、このモデルが TensorFlow.js で皆さん独自の用途に利用できるようになったことをお知らせします。MobileBERT モデルはコンパクトな BERT の一種で、リソースが限られた端末にもデプロイできます。
このモデルは、文書と質問を入力として受け取り、文中のセグメントで質問の回答である可能性が最も高いものを返します。TensorFlow.jsを使っているので、すべての処理はクライアント側のウェブブラウザで行われます。つまり、プライバシーは守られ、分析対象となるウェブサイトのテキストがサーバーに送られて分類に使われることは一切ありません。

TensorFlow.js BERT API

モデルはとても簡単に使うことができます。次のコード スニペットをご覧ください。

<!-- Load TensorFlow.js. This is required to use the qna model. -->
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs"> </script>
<!-- Load the qna model. -->
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/qna"> </script>

<!-- Place your code in the script tag below. You can also use an external .js file -->
<script>
  // Notice there is no 'import' statement. 'qna' and 'tf' is
  // available on the index-page because of the script tag above.
  // Load the model.
  qna.load().then(model => {
    model.findAnswers(question, passage).then(answers => {
      console.log('Answers: ', answers);
    });
  });
</script>

このように、最初の 2 行で、ホストされているスクリプトから TensorFlow.js ライブラリと Q&A（質問と回答）モデルを読み込み、Q&A 検索を行えるようになります。これは 1 回呼び出せば十分です。モデルはメモリに保持されている間、読み込まれた状態が維持されます。findAnswers() は、何度でも呼び出すことができます。その際に、2 つの文字列を渡します。1 つ目は尋ねたい質問、2 つ目は検索対象となるテキスト（ページのテキストなど）です。すると、次の構造を持つ結果オブジェクトが返されます。

[
  {
    text: string,
    score: number,
    startIndex: number,
    endIndex: number
  }
]

取得できるのは、質問に対する答えとして最もあてはまる文書の一部と、その正しさの信頼度を表すスコアを含むオブジェクトの配列です。さらに、回答テキストがコンテキスト文字列の中のどこにあるかを簡単に特定できるように、回答テキストのインデックスも取得できます。これだけです！このデータを使って、見つけたテキストをハイライト表示したり、見栄えのいい形で結果を返したりなど、どんなクリエイティブなアイデアでも実装できます。
モデルを試してみたい方には朗報ですが、現在、MobileBERT Q&A モデルはオープンソース化され、こちらの Github リポジトリで公開されています。自慢したいものができたら、ソーシャル メディアで #MadeWithTFJSを使って TensorFlow.js チームにお知らせください。皆さんが作ったものをぜひ見てみたいと思っています。

Reviewed by Khanh LeViet - Developer Relations Team