Заметки Вебмастера

Познаём Новые Технологии

работаем с jQuery

jQuery. Как правильно подключать библиотеку jQuery?

В данной заметке попробуем развеять миф о том, насколько эффективно подключать jQuery через google, yandex или с других серверов, и попробуем найти самый эффективный способ подключения jQuery для своего ресурса.

Подключать библиотеку jQuery можно двумя способами:

  • подключить её с внешнего ресурса (google, яндекс, jquery);
  • загрузить файл на сайт и подключить его локально.

Рассмотрим плюсы и минусы этих способов.

Подключение jQuery с внешнего ресурса

Начнём сразу со спорного вопроса. Скорость загрузки.

Спорный момент:

Скорость подключения с внешнего ресурса непредсказуема. Если многие и доверяют серверам google и не сомневаются, что подключение будет происходить достаточно быстро, то Яндексу доверяют не все. Хотя любое подключение библиотеки от любого из них будет с серверов CDN, а их надёжность гораздо выше любого из хостинг-провайдеров.

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

Несколько тестов для самого дешёвого хоста показали, что скорость первого подключения jquery с сервера CDN  и локального примерно одинакова 390-400 мс. Но при повторном обновлении страницы скорость подключения файла jquery.js с сервера CDN быстрее в 2, а то и в 4 раза. По соответствующим темам в интернете находил посты, где выкладывают скрины, на которых загрузка с CDN сервера доходит до 32 мс против 400 мс.

CDN сервера есть не только у Google или Яндекс, также можно использовать сервера Microsoft, CDNJS, jQuery…

Плюсы:

+ При подключении jquery с внешнего ресурса можно указать не конкретную версию библиотеки, а загружать её последний актуальный релиз. Хотя опять же, сомнительный плюс. Некоторые версии конфликтуют, и при новом обновлении библиотеки могут возникать конфликты.

Минусы:

При загрузке страницы ваш сайт делает дополнительный, возможно даже лишний, HTTP запрос на внешний ресурс. Если в дальнейшем вы будете заниматься оптимизацией своего сайта, то количество HTTP запросов придётся уменьшать. Но тут тоже всё неоднозначно из-за ограничений спецификации HTTP 1.1. Ни один браузер не сможет скачивать более чем 2 файла одновременно с одного хостинга. Поэтому может имеет смысл параллелить загрузки?

Подключение jQuery локально

Минусы:

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

Плюсы:

  •  При загрузке ваш сайт не делает дополнительный запрос на внешний ресурс;
  • Вы всегда уверены, что ваш сайт загрузит библиотеку, пусть и дольше чем с CDN сервера.
  • Вы можете спокойно манипулировать вашей библиотекой как пожелаете, например, если вы занялись оптимизацией сайта и сжимаете все файлы в один.

Подведём Итоги

Однозначно загружать библиотеку с внешнего CDN сервера гораздо практичнее и выгоднее.

Стоит отметить, что даже если вы считаете внешнюю загрузку библиотеки лишним запросом и стараетесь их минимизировать, то стоит задуматься над тем, что практически любая загрузка файла с вашего хостинга проходит дольше, чем с серверов CDN. Может быть этот запрос не такой уж и лишний?

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

, , ,

Добавить комментарий

 

Ваш e-mail не будет опубликован. Обязательные поля помечены *