最も高性能な関数

JavaScriptJavaScriptBeginner
オンラインで実践に進む

This tutorial is from open-source community. Access the source code

💡 このチュートリアルは英語版からAIによって翻訳されています。原文を確認するには、 ここをクリックしてください

はじめに

この実験では、関数の配列から最も高速に実行される関数のインデックスを返す高性能な関数を書く方法を探求し、練習します。この実験では、performance.now()Array.prototype.map() を使用して関数の実行時間を正確に測定し、比較することに焦点が当てられています。実験が終了するまでに、コードを最大限のパフォーマンスに最適化する方法をより深く理解するようになります。

JavaScript で最も高性能な関数を見つける方法

JavaScript で最も高性能な関数を見つけるには、次の手順に従います。

  1. ターミナル/SSH を開き、コーディングを練習するために node と入力します。
  2. Array.prototype.map() を使用して、各値が 反復回数 回実行した後の関数の実行にかかった合計時間である配列を生成します。
  3. performance.now() の値の前後の差分を使用して、ミリ秒単位の高精度の合計時間を取得します。
  4. Math.min() を使用して最小実行時間を見つけ、その最短時間のインデックスを返します。これは、最も高性能な関数のインデックスに対応します。
  5. 2 番目の引数 反復回数 を省略すると、関数はデフォルトで 10000 回の反復を使用します。
  6. 反復回数が多いほど結果が信頼性が高くなりますが、実行に時間がかかりますので、これを念頭に置いてください。

以下はコードの例です。

const mostPerformant = (fns, iterations = 10000) => {
  const times = fns.map((fn) => {
    const before = performance.now();
    for (let i = 0; i < iterations; i++) fn();
    return performance.now() - before;
  });
  return times.indexOf(Math.min(...times));
};

この関数を使用するには、関数の配列を最初の引数として、反復回数を 2 番目の引数(省略可能)として渡します。たとえば:

mostPerformant([
  () => {
    // `false` を返す前に配列全体をループします
    [1, 2, 3, 4, 5, 6, 7, 8, 9, "10"].every((el) => typeof el === "number");
  },
  () => {
    // `false` を返す前にインデックス `1` に到達するだけです
    [1, "2", 3, 4, 5, 6, 7, 8, 9, 10].every((el) => typeof el === "number");
  }
]); // 1

まとめ

おめでとうございます!最も高性能な関数の実験を完了しました。スキルを向上させるために、LabEx でさらに実験を行って練習してください。