2年前に始めたウェブサイトを完成させました。私は常に新しいことを試みていました。これには、異なるフレームワークや他の外部JSファイルの追加が含まれることもありました。
JSのリンクされたファイル/行のどれが未使用かわかりません。これらのファイルとコード行を検出できるツールはありますか?それは私に多くの時間を節約するでしょう。
2年前に始めたウェブサイトを完成させました。私は常に新しいことを試みていました。これには、異なるフレームワークや他の外部JSファイルの追加が含まれることもありました。
JSのリンクされたファイル/行のどれが未使用かわかりません。これらのファイルとコード行を検出できるツールはありますか?それは私に多くの時間を節約するでしょう。
この回答は、JavaScriptコードを縮小および連結する過程で、「デッドコード」を削除できるGoogleのClosureCompilerを提供します。
コンパイルレベルのドキュメントからの引用:
ADVANCED_OPTIMIZATIONSを使用してコンパイルすると、到達不能である可能性のあるコードが削除されます。これは、大規模なライブラリと組み合わせると特に便利です。大きなライブラリファイルから少数の関数のみを使用する場合、コンパイラはそれらの関数を除くすべてを出力から削除できます。
GoogleのClosureCompilerに関する詳細情報が含まれているこの回答も参照してください。
この必要性があったので、ソースからだけでなく、ブラウザー側で未使用のJSを検出するツールを作成しました。これにより、サードパーティのスクリプトもテストできます。
これは、JavaScriptリクエストをインターセプトし、これらのファイルをオンザフライで計測するローカルプロキシをコンピューター上に作成することで機能します。このツールは、インストルメントされたファイルのどの部分がページで使用され、どの部分が使用されていないかを検出できます。
私はそれをオープンソースにしました、そしてあなたはそれをここで見つけることができます:https ://github.com/gmetais/unusedjs 。
この答えについては、それが役立つかどうかはわかりません。ソナーを試してみませんか。Sonarには、jsコードの品質をチェックし、未使用のコードを一覧表示できるjavascriptプラグインがあります。
私は過去数週間自分で同様のタスクを検討していて、次のPowerShellクエリになりました。
PS> Get-ChildItem -Path C:\PathToProject\ -Filter *.as?x -Recurse
| select-string -pattern "src=""([^""]*.js)"""
| Select -Expand Matches | Foreach { $_.Groups[1].Value } | select -unique
まず、プロジェクトディレクトリ内のすべての.aspxファイルと.ascxファイルを再帰的に選択し、次にsrc
.jsファイル(おそらくスクリプト要素のファイル)を参照する属性値を見つけて、個別の値をトレースします-出来上がり、参照されている.jsファイルのリストがありますあなたのプロジェクトで!
特定のプロジェクトとその構造に合うようにクエリを調整するのはかなり簡単です。廃止された参照を含む可能性のある古いファイルを反復処理しないようにしてください。マークアップの不一致を考慮してください-過去に属性値に一重引用符を使用したか、「等号」記号の前後に不要な空白を残したか、またはその両方でしたか?これらのファイルを別のjsファイル内からプログラムまたは非同期で含めることはできますか?などなど。
Google Chromeデベロッパーツールでは、[ソース]タブの[カバレッジ]を表示して、未使用のJavascriptとCSSを各ファイルのパーセンテージで表示したり、行ごとに表示したりできるようになりました。
これが2017年の機能の発表です。
かなり古い質問ですが、これはこのタイプの問題に役立つ可能性があります-https://github.com/skpaul/LocateMe
私は自分のプロジェクトで使用するためにこれを書きました。