最速で配列からデータを取り出し、正規表現で検索したい。

Question

前提

プログラムを最速化したいです。参考にしたサイトも載せているのですが、配列の方式、検索の仕方、ループ分それぞれどれを採用すれば良いか分かりません。
jsonからデータを取り出していますが、文字列を保存して配列にするつもりです。

プログラムの内容

BOT関連をユーザーエージェントに応じて判定し、該当すればjavascriptをhtmlに書き込むプログラムです。

実現したいこと

• 配列からは最速でデータを取り出せるようにする
• ループ分の最速のものにする
• 検索方法も最速のものにする

参考にしたサイト

1. https://qiita.com/keroxp/items/67804391a8d65eb32cb8
2. https://nulab.com/ja/blog/nulab/100times-faster-performance-improvement-set-map/

該当のソースコード

function getJSON() {
        let req = new XMLHttpRequest();
        let Pattern;
        let UserAgent = navigator.userAgent.replace(/\s+/g, "");
        let result;
        req.onreadystatechange = function() {
            // サーバーからのレスポンスが正常＆通信が正常に終了したとき 
            if(req.readyState == 4 && req.status == 200) {
                // 取得したJSONファイルの中身を変数へ格納
                let data = JSON.parse(req.responseText);
                // JSONのデータ数を取得
                let i = 0;
                let len = data.length;

                for (i = 0; i < len; i=(i+1)|0){
                Pattern = new RegExp(data[i].pattern.replace(/\s+/g, ""));

        if(Pattern.test(UserAgent) == true){
        result = true;
        break;
        }
}

        if(result == null){
        var script = document.createElement("script");
        script.type = "text/javascript";
        script.src = "/stats/JavaScript/maura-port-ship.js";
        document.head.appendChild(script);
        }

            }
        };
        //HTTPメソッドとアクセスするサーバーのURLを指定
        req.open("GET", "https://raw.githubusercontent.com/monperrus/crawler-user-agents/master/crawler-user-agents.json", false);
        //実際にサーバーへリクエストを送信
        req.send(null);
}

getJSON();

Comments

[yuma.inaura]

ベンチマークをとって試してみてはいかがですか

[kansai5512]

とってます。遅いから質問しているのです。
よろしくお願いいたします。

[yuma.inaura]

参考サイトのどれを採用すれば良いか分からないというのが質問だったんじゃないですか？
どれも使い物にならないって事なんでしょうか

[kansai5512]

いいえ、使い物になる前提で、有識者に意見を求めています。

[maisumakun]

本当に、「検索やループ」で律速する状況なのでしょうか？

レスポンスを得るまでの時間が支配的であれば、いくら後処理を改良しても改善の度合いは限られたものとなります。

Answer 1

jsonからデータを取り出していますが、文字列を保存して配列にするつもりです。

この部分が、仮に、ネットワーク経由で json を取得するのではなく
「https://raw.githubusercontent.com/monperrus/crawler-user-agents/master/crawler-user-agents.json のデータから pattern を抜きだしてソースコード中に直接記述する」
という意味ならば、下記のような案が考えられます。

また、下記で有意な速度差を出すには、UserAgentのマッチング判定を、同じページ内で何回も繰り返す場合に限られます。
（一回しか判定しない場合は速度差はほとんどないものと考えられます）

---

new RegExp(data[i].pattern.replace(/\s+/g, ""));

このようにループ中で正規表現オブジェクトを都度生成するのは、わずかながら遅くなる原因になると思います。

したがって、この部分はforループをなくしてあらかじめ正規表現リテラルを記述し、

        if (/pattern1/.test(UserAgent) || 
             /pattern2/.test(UserAgent) ||
             /pattern3/.test(UserAgent) 
               ....
               ....
               ....
           ) {
          result = true;
          break;
        }
      }

としてみてはいかがでしょうか。
(書くのが面倒なのは高速化の対価）
（ロード時のコンパイル時間との兼ね合いかもしれない）

Comments

[kansai5512]

ありがとうございます。
ただ記述の量が多くなるのと、配列で検索するより早いのか心配です。
一般的にどちらが早いのか存じますでしょうか？

[退会済みユーザー]

配列を使用する場合、正規表現リテラルを使えないので、RegExpオブジェクトをループ中で生成する必要があります。
スクリプト内で何回も判定を繰り返すという前提ならば、RegExoオブジェクトを生成するより、正規表現リテラルの方が早いです。
ただし（回答には追記したのですが）1回しかUserAgentを判定しない場合は、速度に有意な差は出ません。

Answer 2

同意します。 この記事で取り上げた、私や他の多くの興味のあるトピック.
Game with fiery fighting games on cuphead io

Answer 3

JSONは検索結果ですのでJSONでうけとったデータから検索をしようとしているのでしたら高速化は困難です。表示したい最小限の内容をサーバー側で抽出後受け取ればどの方法も誤差レベルの違いしか無いでしょう
また、JSONから受け取ったデータを単純に表示したいだけならむしろJSONではなくHTMLデータをサーバー側から抽出してもらって、単純に表示するほうがDOMの評価がない分高速になると思います

Comments

[kansai5512]

最終的にネットワーク経由で json を取得するのではなく
「https://raw.githubusercontent.com/monperrus/crawler-user-agents/master/crawler-user-agents.json のデータから pattern を抜きだしてソースコード中に直接記述する」
る予定です。

[yambejp]

ごめんなさい、表現がわかりにくかったかもしれません。
クライアント側で処理をするかぎり高速化は見込めないというだけです。