web-dev-qa-db-ja.com

本番コードからconsole.logを削除する必要がありますか？

私は現在、私のコードのどこにでもこのJSステートメントを持っています：

window.console && console.log("Foo");

これはまったくコストがかかるのか、それとも生産にマイナスの副作用があるのか​​と思います。

クライアント側のログインをそのままにしておくことはできますか？

編集：最後に、私（および他の誰か？）が思い付くことができる最善の議論は、ロギングメッセージを残したままサーバーとクライアント間で転送される可能性のある無視できない量の余分なデータがあるということです。プロダクションコードは完全に最適化される必要があります。クライアントに送信されるJavaScriptのサイズを小さくするには、ログを削除する必要があります。

javascriptlogging
74
Sean Anderson

not本番ページに開発ツールを追加する必要があります。

他の質問に答えるには：コードにはマイナスの副作用はありません：

  • consoleが定義されていない場合、_window.console_はfalseと評価されます
  • console.log("Foo")は、定義されているときにメッセージをコンソールに出力します（ページが非関数によって_console.log_を上書きしない場合）。
36
Rob W

これに対処する別の方法は、定義されていないときにコンソールオブジェクトを「スタブ」することです。そのため、コンソールを持たないコンテキストでエラーがスローされません。

if (!window.console) {
  var noOp = function(){}; // no-op function
  console = {
    log: noOp,
    warn: noOp,
    error: noOp
  }
}

あなたはアイデアを得る...コンソールのさまざまな実装で定義された多くの関数があるので、それらすべてまたは使用するものだけをスタブすることができます（たとえば、console.logおよび使用されていないconsole.profile、console.time etc ...）

私にとってこれは、すべての呼び出しの前に条件を追加する、またはそれらを使用しないよりも、開発における優れた代替手段です。

参照： JavaScriptコードで製品に「console.log（）」呼び出しを残すのは悪い考えですか？

47
craigb

UglifyJS2

このミニファイを使用している場合は、 drop_consoleオプション ：

Console。*関数への呼び出しを破棄するにはtrueを渡します

したがって、console.logは、コードベースの最も扱いにくい部分を呼び出します。

27
terales

ミニフィケーションがビルドプロセスの一部である場合、Googleクロージャーコンパイラで以下に説明するように、ミニフィケーションを使用してデバッグコードを取り除くことができます。 ミニフィケーション中にデバッグJavaScriptコードを除外

if (DEBUG) {
  console.log("Won't be logged if compiled with --define='DEBUG=false'")
}

高度な最適化でコンパイルすると、このコードはデッドとして識別され、完全に削除されます

16
wutz

はい。 console.logは、サポートされていないブラウザで例外をスローします（コンソールオブジェクトは見つかりません）。

5
MK_Dev

一般的には、プロダクションコードでログメッセージを公開することはお勧めできません。

理想的には、展開前にビルドスクリプトを使用してこのようなログメッセージを削除する必要があります。しかし、多くの（ほとんどの）人がビルドプロセスを使用していません（私を含む）。

このジレンマを解決するために最近使用しているコードの短いスニペットを次に示します。古いIEの未定義のconsoleによって引き起こされるエラーを修正し、「development_mode」の場合はロギングを無効にします。

// fn to add blank (noOp) function for all console methods
var addConsoleNoOp =  function (window) {
    var names = ["log", "debug", "info", "warn", "error",
        "assert", "dir", "dirxml", "group", "groupEnd", "time",
        "timeEnd", "count", "trace", "profile", "profileEnd"],
        i, l = names.length,
        noOp = function () {};
    window.console = {};
    for (i = 0; i < l; i = i + 1) {
        window.console[names[i]] = noOp;
    }
};

// call addConsoleNoOp() if console is undefined or if in production
if (!window.console || !window.development_mode) {
    this.addConsoleNoOp(window);
}

SOの別の回答から上記のaddConsoleNoOp f'nの多くを取得したとは確信していますが、今は見つかりません。見つかったら後で参照を追加します。

編集：私が考えていた投稿ではありませんが、同様のアプローチがあります： https://github.com/paulmillr/console-polyfill/blob/master/index.js

4
Zach Lysobey
var AppLogger = (function () {
  var debug = false;
  var AppLogger = function (isDebug) {
    debug = isDebug;
  }
  AppLogger.conlog = function (data) {
    if (window.console && debug) {
        console.log(data);
    }
  }
  AppLogger.prototype = {
    conlog: function (data) {
        if (window.console && debug) {
            console.log(data);
        }
    }
  };
return AppLogger;
})();

使用法：

var debugMode=true;
var appLogger = new AppLogger(debugMode);
appLogger.conlog('test');
2
C0r3yh

はい、console.logは、JavaScriptのデバッグ目的で使用しますが、実稼働サーバーから削除する必要があります。または、必要に応じて実稼働サーバーに追加して、いくつかの重要な点を考慮に入れることができます。

**var isDebugEnabled="Get boolean value from Configuration file to check whether debug is enabled or not".**
if (window.console && isDebugEnabled) {
    console.log("Debug Message");
}

コンソールが現在のブラウザでサポートされているかどうか、およびデバッグが有効かどうかを最初に確認するには、上記のコードブロックをすべてのログ記録に使用する必要があります。

isDebugEnabledは、環境に基づいてtrueまたはfalseに設定する必要があります。

1
shanky

TL; DR

Idea：ロギングオブジェクトは、ガベージコレクションされないようにします。

詳細

  1. オブジェクトをconsole.logに渡すと、これらのオブジェクトはDevToolsのコンソールから参照によりアクセスできます。オブジェクトをログに記録して変更し、古いメッセージがオブジェクトのその後の変更を反映していることを確認することで確認できます。
  2. ログが長すぎる場合、古いメッセージはChromeで削除されます。
  3. ログが短い場合、古いメッセージは削除されません。これらのメッセージがオブジェクトを参照している場合、これらのオブジェクトは収集されません。

これは単なるアイデアです：ポイント1と2をチェックしましたが、3はチェックしていません。

溶液

クライアント側のトラブルシューティングまたはその他のニーズのためにログを保持する場合：

['log', 'warn', 'error'].forEach( (meth) => {
  const _meth = window.console[meth].bind(console);
  window.console[meth] = function(...args) { _meth(...args.map((arg) => '' + arg)) }
});
1
ilyaigpetrov

基本的には、console.log関数を、コードが実行されている場所を知っている関数で上書きします。したがって、私はいつものようにconsole.logを使い続けることができます。私がdev/qaモードまたは本番モードであることを自動的に認識します。それを強制する方法もあります。ここに作業フィドルがあります。 http://jsfiddle.net/bsurela/Zneek/

スタックオーバーフローはjsfiddleを投稿する人々によって推測されるため、ここにスニペットがあります

  log:function(obj)
{
    if(window.location.hostname === domainName)
    {
        if(window.myLogger.force === true)
        {
            window.myLogger.original.apply(this,arguments);
        }
    }else {
        window.myLogger.original.apply(this,arguments);
    }
},
0
Bhavin