0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

初心者でもできる、パフォーマンスを意識したコーディング

Last updated at Posted at 2025-05-10

概要

コーディングに慣れていないと、つい書くことで精一杯になってしまうもの。
しかしながら、パフォーマンス(今回の場合はメモリの利用効率)を意識できると、
低燃費なサービス運用に貢献できます。

この記事では、JavaScript を学習している人向けに、リソース効率の良いコーディングを行うための方法を 1つ紹介します。

使わなくなった値は、再参照できないようにしよう

今回お伝えしたいことは、「使わなくなった値は、再参照できないようにしよう」ということです。

JavaScript は、ガベージコレクションという仕組みを持っています。
これは、参照がなくなったデータを自動でメモリから解放する機能です。

たとえば、以下のようなコードがあります。

let obj = { name: "Test" };
console.log(obj.name); // => Test

上記のログ出力後、もう変数 obj を使用しない場合、
以下のように処理を追記して、メモリを解放してあげるべきです。

let obj = { name: "Test" };
console.log(obj.name); // => Test

// もう使わないので参照を切る
obj = null;

// この時点で { name: "Test" } は参照されなくなり、ガベージコレクタの対象になる(メモリが解放される)

また、これを null ではなく、値を再代入しても、Test を保持していた分のメモリは解放されます。

let obj = { name: "Test" };
console.log(obj.name); // => Test

// 別の値を代入する
obj = { name: "Production" };

// この時点で { name: "Test" } は参照されなくなり、ガベージコレクタの対象になる(メモリが解放される)

特に、グローバル変数の扱いには気をつける

大抵の場合は変数を let で宣言するときは、値を再代入して使い回すでしょうから、あまり気にすることはないかもしれません。

ただし、グローバル変数の扱いには注意すべきです。
具体的には、グローバル変数は必要な数に絞って宣言した方がよいです。

たとえば、以下のようなコードがあります。

Sample1
// objをグローバル変数として定義
let obj = { name: "Test" };

function test() {
  console.log(obj.name);
}

test();

// 関数のあともobjはまだ参照できる
console.log(obj.name); // "Test"

グローバル変数は、プログラムが終了するまで、obj に値を持ち続けます。
つまり、ずっと一定量のメモリを占領し続けることになります。

次に、以下のように、obj を関数内に宣言します。

Sample2
function test() {
  let obj = { name: "Test" };
  console.log(obj.name);
}

test();
// ここで関数が終わったので、objの参照が消え、メモリも解放される(メモリが解放される)

すると今度は、関数が終了した時点で objはガベージコレクションの対象になり、その分のメモリが解放されます。

Sample1 のように、グローバルに宣言した変数をいつでも使い続けられるのは便利です。
その一方、一度や二度しか使わないのにグローバル変数にしてしまうと、その分メモリを占領し続けることになり、リソース効率が悪くなります(他にメモリが必要な処理にたいして使える容量が少なくなる)。




今回は、分かりやすいグローバル変数に触れながら説明しました。
しかし、開発していると不必要にメモリを使ってしまっていることって他にもあると思います。
「あれ、これもう使わないんじゃね?」って思ったら、こまめに参照を切りながらコーディングできると、高コスパエンジニアへ一歩近づけそうですね。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?