質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

87.78%

クロージャーとガベージコレクションが理解不能

解決済

回答 2

投稿

  • 評価
  • クリップ 1
  • VIEW 529

score 4

用語集

解説サイトA= https://logmi.jp/tech/articles/322067
画像A= https://img.logmi.jp/article_images/CnNjsbCDuXcau2y612zVvW.jpg
画像B= https://img.logmi.jp/article_images/8ueUvyGywcmH2rx8eTssCM.jpg

抱えている問題・実現したいこと

html・css・javascriptでゲームを作っているが、
「このwebページは多くのメモリを使用しています」と警告が出る。
無視していると強制的にブラウザがページを再読み込みさせてしまうらしい。
ゲームプレイ途中にページが再読み込みされて処理がリセットされては困るので
メモリリークについて理解し、対策を取りたい。

前提

いろいろ解説サイトを読んだが、中でもゲームについて言及している
解説サイトAをメインで読んでいます。
解説サイトAによるとクロージャーがメモリに関係ありそうなので、理解をしたいが、難しくて理解できないです。

ガベージコレクションが発揮される条件が不明

画像Aに対して「ルートオブジェクトからたどれるものは消せないルール。だから、globalObjから辿り、something関数、NOT_USE_CLOSURE関数、localClosure変数は繋がりがあるので逐一消せなくなります」とありますが、globalObjはleakSampleスコープの中にあるのでルートオブジェクトではありませんよね?それともルートオブジェクトである「var test」のイコールの右辺の中にあるものは全てルートオブジェクトから辿れるとみなされるのですか?

クロージャーを使わないケースを理解できない

解決先としてクロージャーを使わないソース(画像B)が載っていますが、このソースもクロージャーを使っていませんか?解説サイトAには「別のスコープのローカル変数を参照できる仕組み自体がクロージャ」とありました。画像Bにおいては、nonLeakSampleスコープのローカル変数であるglobalObjを、NOT_USE_CLOSURE関数スコープ内で参照しているので、そう思いました。

備考

以前
https://teratail.com/questions/280194
に質問しましたが、1つの実現したいこと・抱えている問題に対して課題が複数あったので、課題ごとに分けて質問する為、その理由を添えて削除依頼しました。削除依頼は運営にも受理され、現在は削除されています。運営に受理されたということで複数に分けて質問させていただきます。

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • gvaslkjlie

    2020/07/27 21:07

    ご回答ありがとうございます。
    まさに私の作っているゲームのjsは「同じエレメントにイベントを何度もセットしている」し「setTimeoutが増殖している」状態にあります。

    「同じエレメント イベントを何度もセット」と検索しても検索の仕方が悪いのか何がダメなのか情報が出てこなかったので、教えていただければ幸いです。

    「setInterval」はclearしないと重くなると何かで読んだのですが、「setTimeout」についてもclearしないと重くなるのか調べてみました。
    https://stackoverrun.com/ja/q/999418
    によると意見が分かれていたり、node.jsの場合だったり、再起の場合だったりして結局わかりませんでした。

    キャンセル

  • tetosept

    2020/07/27 23:01

    横から失礼します。
    イベントはaddEventListenerで登録する様に必要がなくなればremoveEventListenrする必要があります。
    removeしない場合重ね付けされていってしまうので例えばclickイベントを二回addした場合は一回のクリックで登録されたイベントが二回実行されます。
    こちらご存知でしたら大変恐縮なのですが、上記コメントで気になったので確認していただければと思います。

    キャンセル

  • gvaslkjlie

    2020/07/28 18:27

    tetosept様、コメントありがとうございます。「同じエレメントにイベントを何度もセットしている」と記載しましたが誤りでした。正しくは「同じエレメントに対して何度もjqueryのaddClassとremoveClassを繰り返している」でした。紛らわしくてすみませんでした。addEventListenerをソース中で検索しましたが、唯一ヒットしたのが常時必要な関数でしたのでremoveはやめときます。

    キャンセル

回答 2

checkベストアンサー

+3

ガベージコレクションが発揮される条件が不明

この記述内容を議論する以前の問題として、ブラウザによっては最適化が行われますので、「スコープから見えているけどまったく参照もされない変数」は消えていることがあります。クロージャから読み書きが行われる変数は、もちろん必要なものなので最適化しても消せません。

(正直言って、実際にそこで行き詰まっているとはっきりしているのでなければ、こんな細かい挙動を追いかけても仕方ありません。)

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/08/02 12:50

    何のタイミングでメモリリークが起きているかがはっきりしていない状況で挙動を追いかけても仕方ないということで、追求するのは一旦終わりにしようと思います。maisumakun様がおっしゃっていた「setTimeoutが増殖している」の部分だけ直すことにします。ご回答ありがとうございました。

    キャンセル

  • 2020/08/02 12:51

    あとイベントリスナーについても使い終わったら消そうと思います。

    キャンセル

0

macOS Catalina上のSafariで「このWebページは多くのメモリを使用しています」の警告が頻繁に出る場合の対処法 | INFORNOGRAPHY

ちなみにこの警告はたとえMacの搭載メモリが32GBや64GBなど潤沢にあってメモリが有り余ってる場合でも表示される。

Safari は表示中のページだけでなくプラグインなども同じメモリを奪い合い、結果この警告が出るようです。
ブラウザを変えてみましょう。

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/08/02 19:48 編集

    ご回答ありがとうございます。「メモリが有り余ってる場合でも表示される」ということに驚いております。リンク先拝見しましたがユーザーに設定して貰う方法のようですね。ユーザーに設定の手間をかけさせるぐらいなら、Zuishin様の言う通りブラウザを変えてもらうよう、推奨ブラウザ環境を制限しようと思います。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 87.78%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る