Обнаружение связанных и неиспользуемых файлов и неиспользуемого JavaScript

Я только что закончил свой сайт, который я начал 2 года назад. Я всегда пробовал новые вещи, которые иногда включали добавление разных фреймворков или других внешних JS файлов.

Теперь я не знаю, какие из связанных файлов/строк JS не используются. Есть ли инструмент, который может обнаружить эти файлы и строки кода? Это сэкономит мне много времени.

Ответы

Ответ 1

Этот ответ предлагает Google Closure Compiler, который в процессе минимизации и конкатенация вашего кода JavaScript, может удалить "мертвый код".

Цитата из документация для уровней компиляции:

Компиляция с помощью ADVANCED_OPTIMIZATIONS удаляет код, который явно недостижим. Это особенно полезно в сочетании с большими библиотеками. Если вы используете только несколько функций из большого файла библиотеки, компилятор может удалить все, кроме этих функций, из своего вывода.

Также см. этот ответ, который содержит дополнительную информацию о компиляторе Google Closure.

Ответ 2

У меня была такая необходимость, поэтому я создал инструмент, который обнаруживает неиспользуемые JS на стороне браузера, а не только из источников, поэтому он также может протестировать скрипты третьих сторон.

Он работает, создавая локальный прокси-сервер на вашем компьютере, который перехватывает запросы JavaScript и инструменты эти файлы на лету. Инструмент не способен определить, какие части инструментальных файлов использовались на странице, а какие нет.

Я сделал это с открытым исходным кодом, и вы можете найти его здесь: https://github.com/gmetais/unusedjs.

Ответ 3

Для этого ответа я не уверен, полезен он или нет. Как насчет того, чтобы попробовать сонар. Sonar имеет плагин javascript, который может проверить качество js-кода и перечислить неиспользуемый код.

Ответ 4

Я рассматривал аналогичную задачу в течение последних нескольких недель и в итоге получил следующий 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(предположительно к элементам script) и отслеживают различные значения - voila, у вас есть список файлов .js, как указано в вашем проекте!

Было бы довольно просто настроить запрос так, чтобы он соответствовал вашему конкретному проекту и его структуре. Убедитесь, что вы не перебираете устаревшие файлы, которые могут содержать устаревшие ссылки. Учет разметки разметки - могли ли вы использовать одинарные кавычки для значений атрибутов в прошлом или оставить ненужные пробелы вокруг символа "равно" или оба? Не могли бы вы включить эти файлы программно или асинхронно из других js файлов? и т.д. и т.д.

Ответ 5

В инструментах разработчика Google Chrome теперь вы можете просматривать "Покрытие" на вкладке "Источники", чтобы отображать неиспользуемые Javascript и CSS в процентах от каждого файла или даже построчно.

Здесь анонс функции в 2017 году.