Подключение библиотеки jQuery

Как правильно подключить jQuery к сайту

Известно, что скорость загрузки сайта влияет не только на его юзабилити, но и на его место в поисковой выдаче. Чем быстрее сайт, тем выше его место.

Оптимальным для скорости сайта является использование CDN, это когда сайт или отдельные его библиотеки и фреймворки загружаются посетителю не с сервера на котором непосредственно расположен сайт, а с сервера ближайшего к пользователю дата центра CDN сети. Например если пользователь в Бразилии открывает сайт физически расположенный на сервере в Москве, то библиотека подключаемая к сайту через CDN будет загружаться не из московского сервера, а с сервера в Бразилии. Для таких расстояний это быстрее на целые секунды (порою 5-6 секунд).

Ну и конечно же не исключаем то, что библиотека может быть уже закэширована в браузере посетителя после посещения другого сайта, где так же использовалась данная библиотека.

 

Подключение файла библиотеки jQuery

На сегодняшний день jQuery остаётся самой популярной библиотекой для JavaScript. Она выложена на многих CDN сервисах (есть на доменах Cloudflare, бутстрапа и многих других).

Её можно подключить с гугловских CDN:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>

 

Чтобы перестраховаться и в случае если по каким то причинам библиотека jQuery не загрузилась с CDN, то загрузить её непосредственно с сайта. Сделать это можно следующим образом:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="/js/jquery-3.6.3.min.js"><\/script>')</script>

Первая строка подключает библиотеку с гугловских CDN.

Вторая строка проверяет: если jQuery не загрузилась, то она загружается непосредственно с нашего сайта. В кавычках после атрибута src указан путь на сайте к библиотеке и её название - /js/jquery-3.6.3.min.js. Если вы у себя переименовываете файл библиотеки или расположена она у вас в другом месте на сайте, то нужно правильно отредактировать путь и название файла.

Ну и конечно же не стоит забывать о том, что библиотека jQuery должна подключаться перед скриптами использующими её.