Подтвердить что ты не робот

Как узнать, действительно ли определен код javascript?

Я выполняю работу по очистке JavaScript в устаревшем проекте и пытаюсь избавиться от избыточных JS-библиотек. Я сделал все очевидные (те, которые нигде не упоминаются). Но есть несколько JS файлов, которые включены во все страницы (через плитки).

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

4b9b3361

Ответ 1

Я думаю, что нет простого способа.

Вы можете удалить ссылку script, запустить свой сайт с включенным отладчиком браузера и посмотреть, есть ли ошибка "функция не найдена".

Но вам придется проверять каждую функциональность вашего сайта...

Edit:

Теперь у вас есть функция в инструментах chrome dev, которые могут сделать это для вас:

https://developers.google.com/web/updates/2017/04/devtools-release-notes

1) Откройте меню команд. 2) Начните вводить "Охват" и выберите "Показать охват".

Ответ 2

В одном из последних обновлений из инструментов chrome dev теперь есть вкладка покрытия JS и CSS, которая позволяет вам видеть неиспользуемый код.

https://developers.google.com/web/updates/2017/04/devtools-release-notes

1) Open the Command Menu.
2) Start typing Coverage and select Show Coverage.

Ответ 3

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

Если вам повезло, что библиотеки js инициализируются в конструкторе или каким-то другим способом, если это так, я предлагаю вам следить за этими функциями init.
Если нет, вам может понадобиться следить за всеми функциями, но это больно, особенно если у вас большие библиотеки, и в этом случае я предлагаю идти один за другим.

В прошлом я использовал Jasmine или Sinon. JS для этой задачи, следует примеру:

it('should be able to login', function () {
  spyOn(authobj, 'isEmpty');  
  authobj.login('abc', 'abc');  
  expect(authobj.isEmpty).toHaveBeenCalled();
});

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

Ответ 4

Вы также можете попробовать purifycss.

Использование CLI:

$ npm install -g purify-css

purifycss <css> <content> [option]

Options:
  -m, --min        Minify CSS                         [boolean] [default: false]
  -o, --out        Filepath to write purified css to                    [string]
  -i, --info       Logs info on how much css was removed
                                                      [boolean] [default: false]
  -r, --rejected   Logs the CSS rules that were removed
                                                      [boolean] [default: false]
  -w, --whitelist  List of classes that should not be removed
                                                           [array] [default: []]
  -h, --help       Show help                                           [boolean]
  -v, --version    Show version number                                 [boolean]

Ответ 5

Скачать Screaming Frog. Вы можете анализировать до 500 страниц бесплатно. И он показывает вам, где каждая ссылка используется.