Как блокировать лишние внешние js скрипты, css и шрифты fonts на сайте. Внутренняя оптимизация и ускорение сайта
Привет ребятушки, пока большинство говорит, что нужно оптимизировать, я расскажу как.
Иногда web или seo сталкивается с движком или шаблоном (битрикс привет, аспро! салют!)) , которые не предназначены для кастомизации и не учитывают современные seo требования ПС. Это вынуждает идти на крайние меры, этим мы и займемся.
Метод актуален для сервера Apache и с поддержкой модуля mod_headers.c. Будем добавлять директивы в htaccess.
Я конечно понимаю, что у многих адептов правильного кода потечет кровь из глаз, но ... такова жизнь, тратить много времени на то, что можно сделать быстро - не наш вариант.
Решать этот вопрос будем сами, без помощи узких специалистов.
Content Security Policy
Будем использовать Content Security Policy. Content Security Policy (CSP, политика защиты контента) — это стандарт компьютерной безопасности, механизм обеспечения безопасности, с помощью которого можно обезопасить сайт от внедрения в контент скриптов, css, шрифтов. CSP описывает в своей директиве «безопасные» источники загрузки ресурсов. То есть не перечисленные источники ресурсов будут блокироваться.
Да, мы будем идти от обратного и описывать только то, что нам нужно, но это не сложно на самом деле. Все остальное заблокируется. Правила разрешений будут применяться ДО загрузки страницы.
Писать команду на внедрение заголовков CSP будем в. htaccess.
Пример директивы включает в себя разрешения
- можно загружать из источников на сайте;
- внешние источники js и css, с которых разрешена загрузка;
- запрет на загрузку внешних шрифтов.
----------------------------------------------------------
<IfModule mod_headers.c>
Header set Content-Security-Policy "script-src 'self' 'unsafe-inline' 'unsafe-eval' cdn.jsdelivr.net yastatic.net api-maps.yandex.ru core-renderer-tiles.maps.yandex.net code.jivo.ru developer.tech.yandex.ru; style-src 'self' 'unsafe-inline' cdn.jsdelivr.net yastatic.net api-maps.yandex.ru core-renderer-tiles.maps.yandex.net code.jivo.ru developer.tech.yandex.ru; font-src 'self' 'none'; block-all-mixed-content"
</IfModule>
----------------------------------------------------------
Это сначала нужно подогнать под свой сайт, то есть перечислить внешние источники скриптов, которые вам нужны. Хотя бы метрику mc.yandex.ru, у меня метрика грузится с альтернативного источника cdn.jsdelivr.net. Google Analitycs и tags нету, если они у вас есть, прописывайте домен с поддоменом.
Header set — устанавливаем заголовок Content-Security-Policy это вводная часть,
script-src 'self' 'unsafe-inline' 'unsafe-eval' — разрешения для скриптов,
style-src 'self' 'unsafe-inline' — разрешения для css стилей,
font-src 'self' 'none'; — блокируем внешние шрифты,
block-all-mixed-content: блокирует загрузку смешанного контента
----------------------------------------------------------
В примере разрешены следующие перечисленные источники для загрузки скриптов, стилей и шрифтов:
- «self»: текущий домен, с которого загружается страница.
- «unsafe-inline»: разрешает использование встроенных скриптов и стилей в HTML-коде страницы.
- «unsafe-eval»: разрешает использование eval() и подобных функций для выполнения динамически создаваемого кода.
- «cdn.jsdelivr.net»: разрешает загрузку скриптов или css с CDN-сервера jsdelivr.net.
- далее перечисленные в коде тоже разрешены.
Для пущей безопасности 'unsafe-inline' и 'unsafe-eval' можно убрать, а вообще — для безопасности делайте бекапы.
ИТОГО: все внешние НЕ ПЕРЕЧИСЛЕННЫЕ JS, CSS, FONT — будут заблокированы. За немного времени работы вы значительно увеличите скорость загрузки сайта.
Детальнее о CSP вы можете почитать в ПС, информации достаточно.
Пользуйтесь.
Всем удачи, здоровья, с наступающим НГ.
Пока.