ホームページ > ウェブフロントエンド > jsチュートリアル > es5/6搭載ノードの性能比較を詳しく解説

es5/6搭載ノードの性能比較を詳しく解説

巴扎黑
リリース: 2017-08-12 16:27:46
オリジナル
1266 人が閲覧しました

この記事では主にnodeでのes5/6の使用方法とサポートとパフォーマンスの比較を紹介していますが、編集者が非常に良いと思ったので、参考として共有します。エディターをフォローして見てみましょう

前書き

近年、react と vue の急速な発展に伴い、ますます多くのフロントエンドがプロジェクトで es6 コードを使用し始めています。インポート、エクスポート、let、アロー関数などを含む、すべてのブラウザで実行できるように、js の babel バージョンを介してレベル コードを作成します。ノード側では、もちろん、これらの高度な構文も使用したいと考えていますが、次のことを知る必要があります。ノードがサポートする新しい構文を進めます。

カテゴリ

すべての es6 機能は 3 つの段階/カテゴリに分類されます:

  • 配送 --- デフォルトでは、v8 エンジンはフラグを設定する必要がなく、直接サポートできます。進行中。

  • staged --- これらは完成予定の新機能ですが、v8 エンジンではまだサポートされていません。ランタイム フラグ --harmony を使用する必要があります。

  • 進行中 --- これらの機能は将来廃止される可能性が高く、不確実であるため、使用しないことが最善です。

では、nodejs バージョンではどの機能がデフォルトでサポートされているのでしょうか?

Web サイト node.green では、node のさまざまなバージョンの新機能に対する優れたサポートが提供されます。

ノードの最新バージョンはすでに 6.11.2 であり、最新バージョンは 8.3 に達しているため、一般的に使用される es6 構文の一部に対するノードのサポートがすでに非常に優れていることがわかります。 0.

そのため、ノード側で es6 構文を記述すると、そのほとんどが直接使用できます。ただし、es7/8 の機能はまだ十分にサポートされていません。

どのような機能が開発中ですか?

v8 エンジンには常に新しい機能が追加されていますが、いつ追加されるかはわかりません。

--v8-options パラメーターを使用して、進行中のすべての機能を grep でリストできます。 これらは依然として互換性のない機能であるため、注意して使用してください。

パフォーマンス

es6 はその機能の互換性を理解するだけでなく、ノード上の es5 と es6 の実行時間を比較することもできます。 。

ブロックレベルスコープ

es5テスト:


var i = 0;
var start = +new Date(),
  duration;

while (i++ < 1000000000) {
  var a = 1;
  var b = &#39;2&#39;;
  var c = true;
  var d = {};
  var e = [];
}

duration = +new Date() - start;
console.log(duration)
ログイン後にコピー

複数のテスト、それぞれ11972/11736/11798時間がかかります

es6テスト:


let i = 0;
let start = +new Date(),
  duration;

while (i++ < 1000000000) {
  const a = 1;
  const b = &#39;2&#39;;
  const c = true;
  const d = {};
  const e = [];
}

duration = +new Date() - start;
console.log(duration)
ログイン後にコピー

テスト、時間がかかるはそれぞれ11583/11674/11521です。

この点では、es6 構文を使用する方がわずかに高速です。

class

es5構文


var i = 0;
var start = +new Date(),
  duration;

function Foo() {;
  this.name = &#39;wayne&#39;
}

Foo.prototype.getName = function () {
  return this.name;
}

var foo = {};

while (i++ < 10000000) {
  foo[i] = new Foo();
  foo[i].getName();
}

duration = +new Date() - start;

console.log(duration)
ログイン後にコピー

がテストされ、それぞれ2030/2062/1919ミリ秒かかりました。

es6 構文:

注: ここではクラスのみをテストしているため、両方とも var を使用して変数を宣言します。これが単一変数の原則です。


var i = 0;
var start = +new Date(),
  duration;
  
class Foo {
  constructor() {
    this.name = &#39;wayne&#39;    
  }
  getName () {
    return this.name;
  }
}


var foo = {};

while (i++ < 10000000) {
  foo[i] = new Foo();
  foo[i].getName();
}

duration = +new Date() - start;

console.log(duration)
ログイン後にコピー

3 ラウンドのテスト後の結果は、2044/2129/2080 であり、両者の速度にほとんど差がないことがわかります。

4.x ノード バージョンは、es6 コードを実行すると es5 コードと比較して非常に遅くなりますが、現在ノード 6.11.2 バージョンを使用して es6 コードを実行し、es5 コードを実行すると、この 2 つは同じくらい高速であることがわかります。新機能のノードの速度が大幅に向上しました。

map

es5の構文:


var i = 0;
var start = +new Date(),
  duration;

while (i++ < 100000000) {
  var map = {};
  map[&#39;key&#39;] = &#39;value&#39;
}

duration = +new Date() - start;
console.log(duration)
ログイン後にコピー

5回実行、結果は次の通り: 993/858/897/855/862

es6の構文:


var i = 0;
var start = +new Date(),
  duration;

while (i++ < 100000000) {
  var map = new Map();
  map.set(&#39;key&#39;, &#39;value&#39;);
}

duration = +new Date() - start;
console.log(duration)
ログイン後にコピー

数回のテストの後、かかった時間は 10458/10316/10319 です。 つまり、es6 Map の実行時間は es5 の 10 倍以上であるため、ノード環境では使用する Map 構文を減らすことが最適です。

テンプレート文字列

es5構文:


var i = 0;
var start = +new Date(),
  duration;

var person = {
  name: &#39;wayne&#39;,
  age: 21,
  school: &#39;xjtu&#39;
}

while (i++ < 100000000) {
  var str = &#39;Hello, I am &#39; + person.name + &#39;, and I am &#39; + person.age + &#39; years old, I come from &#39; + person.school; 
}

duration = +new Date() - start;
console.log(duration)
ログイン後にコピー

テスト後、時刻は2396/2372/2427であることがわかります

es6構文:


var i = 0;
var start = +new Date(),
  duration;

var person = {
  name: &#39;wayne&#39;,
  age: 21,
  school: &#39;xjtu&#39;
}

while (i++ < 100000000) {
  var str = `Hello, I am ${person.name}, and I am ${person.age} years old, I come from ${person.school}`;
}

duration = +new Date() - start;
console.log(duration)
ログイン後にコピー

テスト後、次のことが可能です2978/3022/3010 では消費時間が異なることがわかりました。

計算すると、es6構文を使用すると、es5構文の約1.25倍の時間がかかります。 したがって、ノード側でテンプレート文字列の使用を減らすようにしてください。大量に使用すると、明らかに時間がかかります。

アロー関数

es5の構文:


var i = 0;
var start = +new Date(),
  duration;

var func = {};

while (i++ < 10000000) {
  func[i] = function (x) {
    return 10 + x;
  }
}

duration = +new Date() - start;
console.log(duration)
ログイン後にコピー

テストの結果、消費時間はそれぞれ1675/1639/1621であることが判明しました。

es6 構文:


var i = 0;
var start = +new Date(),
  duration;

var func = {};

while (i++ < 10000000) {
  func[i] = (x) => 10 + x
}

duration = +new Date() - start;
console.log(duration)
ログイン後にコピー

テストの結果、消費時間はそれぞれ 1596/1770/1597 であることが判明しました。

つまり、アロー関数の実行速度は es5 を使用したアロー関数の速度と同じであり、es6 を使用してアロー関数を作成した方が便利なので、推奨されており、直接使用できます。

まとめ

共通クラスやlet、arrow関数などはes5と同等の速度になりますが、やはりes6のほうが書きやすいのでおすすめです。 。

以上がes5/6搭載ノードの性能比較を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート