ОБНОВЛЕНИЕ 7/3/2014: На данный момент jquery-latest.js больше не обновляется. Из блога jQuery:
Мы знаем, что http://code.jquery.com/jquery-latest.js злоупотребляют из-за статистики CDN показывая его самый популярный файл. Это было бы не так, если бы это было был использован только разработчиками для создания локальной копии.
Мы решили прекратить обновление этого файла, а также уменьшенную копию, сохраняя оба файла в версии 1.11.1 навсегда.
Команда CDN Google присоединилась к нам в этой непреднамеренный перерыв в сети и больше не обновляет файл на http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js. Этот файл будет оставаться заблокированным и в версии 1.11.1.
Следующий, теперь спорный ответ сохраняется здесь по историческим причинам.
Не делайте этого. Серьезно, не делайте.
Связывание с основными версиями jQuery действительно работает, но это плохая идея — все новые функции добавляются и устаревают с каждым десятичным обновлением. Если вы обновите jQuery автоматически без тестирования кода ПОЛНОСТЬЮ, вы рискуете неожиданным сюрпризом, если API для некоторого критического метода изменился.
Вот что вы должны делать: напишите свой код, используя последнюю версию jQuery. Протестируйте его, отлаживайте, публикуйте его, когда он готов к производству.
Затем, когда выйдет новая версия jQuery, спросите себя: Нужна ли мне эта новая версия в моем коде? Например, существует ли какая-то критическая совместимость с браузером, которая раньше не существовала, или это ускорит мой код в большинстве браузеров?
Если ответ «нет», не беспокойтесь, обновляя свой код до последней версии jQuery. Это может даже добавить НОВЫЕ ошибки в ваш код, который не существовал до. Ни один ответственный разработчик не будет автоматически включать новый код с другого сайта без тщательного тестирования.
Просто нет веской причины ВСЕГДА использовать последнюю версию jQuery. Старые версии все еще доступны на CDN, и если они работают для ваших целей, то зачем их заменять?
Вторичная, но, возможно, более важная проблема — кэширование. Многие люди ссылаются на jQuery на CDN, потому что многие другие сайты делают это, и ваши пользователи имеют хорошие шансы на то, что эта версия уже кэширована.
Проблема в том, что кэширование работает только в том случае, если вы предоставляете полный номер версии. Если вы предоставляете частичный номер версии, кэширование в будущем будущем не произойдет, потому что если это произойдет, некоторые пользователи получат разные младшие версии jQuery с одного и того же URL-адреса. (Скажем, что ссылка на 1,7 указывает на 1,7,1 в день и 1,7,2 на следующий день. Как браузер будет уверен, что он получит последнюю версию сегодня? Ответ: нет кеширования.)
Фактически здесь разбивка нескольких вариантов и их истечение Настройки…
http://code.jquery.com/jquery-latest.min.js (без кеша)
http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js (1 час)
http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js (1 час)
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js (1 год)
Итак, связываясь с jQuery таким образом, вы фактически устраняете одну из основных причин использования CDN в первую очередь.
http://code.jquery.com/jquery-latest.min.js может не всегда давать вам ожидаемую версию. На момент написания этой статьи он ссылался на последнюю версию jQuery 1.x, хотя был выпущен и jQuery 2.x. Это связано с тем, что jQuery 1.x совместим со старыми браузерами, включая IE 6/7/8, и jQuery 2.x не является. Если вам нужна последняя версия jQuery 2.x, то (на данный момент) вам нужно явно указать это.
Две версии имеют один и тот же API, поэтому для совместимых браузеров нет различий в восприятии. Однако jQuery 1.x является более крупным, чем 2.x.
qaru.site
Today I got a query from a fairly experienced developer who was facing issues with his jQuery files hosted in a 3rd party CDN. His CDN hosting provider although promising a 99.9% uptime in their Usage policy, was not quite living up to the expectations. As a result, whenever the CDN would face downtime issues, the website would ‘hang’ for a couple of seconds before being responsive again. Although the solution to these kind of issues is multifold, I thought of quickly writing some tips that will help you if you are in a similar situation.
CDN stands for Content Delivery Network or Content Distribution Network (CDN). It is a system of computers networked together across the Internet with the goal of serving content like graphics, scripts, media files etc., with high availability and high performance.
Each of these interlinked computers have a copy of the content you want to serve. When your website visitor requests for some content, a CDN delivers the content from a server that’s closest to the visitor. Because closer is better, this automatically reduces bandwidth requirement, reduces response time due to better caching and reduces the load on your web server. Once the content from a CDN is cached by the visitor’s browser, it doesn’t have to be downloaded again for subsequent requests from that visitor. This increases the load time of your website, on the visitor’s browser.
In case of jQuery, the most popular CDN choices are
Google CDN — https://developers.google.com/speed/libraries/devguide?csw=1#jquery
Microsoft CDN — http://www.asp.net/ajaxlibrary/cdn.ashx#4
jQuery’s own CDN — http://code.jquery.com/jquery.js
However CDN’s being a third party service, may not be accessible for some reason or blocked in some countries. Yes Google is blocked in some countries and last year, Microsoft CDN had a slight issue for a couple of minutes in some parts of the US, due to a configuration change on one of their servers! Although this happens very rarely with companies like Microsoft, it is always a good practice to use a CDN, but with a fallback to a local copy of the jQuery library on your web server. Ever since checks for DOM ready state has been added from jQuery 1.4 onwards, we can easily use a CDN with a fallback option. Here’s how it is done
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script> // Fallback to loading jQuery from a local path if the CDN is unavailable (window.jQuery || document.write('<script src="/scripts/jquery-1.10.2.min.js"></script>')); </script>
The first script uses jQuery script hosted on Google CDN in your Web application. The second script then tests to see if the jQuery object was loaded. If the jQuery object isn’t available, it allows your page to fallback to loading jQuery from a local path, on your own website.
Note: I have specified the CDN path without the http:// protocol. This is considered as a best practice to use that works on both HTTP and HTTPS pages. However this won’t work if you are loading HTML pages directly from the disk without using a web server. In such cases, you will need to include the http protocol in the CDN url.
This is not a foolproof method and before making the switch from the CDN version to the local version, your browser could wait for 40-60 seconds for the DNS to timeout. Sometimes this could be an endless wait and could leave the page non-responsive for a long time and block the other page elements from loading. This is another good reason why scripts should be placed at the end of the page before the closing </body> tag and not in the <head> tag.
For a time based fallback solution and to avoid the DNS timeout, you can use LABjs(http://labjs.com ) or use yepnope(http://yepnopejs.com/ ) to load a local version of the script if the CDN version is not found.
For educational purposes and for those who are wondering how to fall back to multiple CDN’s before loading the local jQuery file from your website, here’s the solution (although this is highly unlikely and unnecessary)
<!-- Use Google's CDN --> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <!-- Fallback to Microsoft's Ajax CDN if Google CDN is unavailable --> <script> (window.jQuery || document.write('<script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.2.min.js"></script>')); </script> <!-- Fallback to loading jQuery from a local path if both the CDN's are unavailable --> <script> (window.jQuery || document.write('<script src="/scripts/jquery-1.10.2.min.js"></script>')); </script>
Each CDN provider is different and what CDN you pick really matters, especially if your website audience is heavily localized in one part of the world. CDN’s hosted by Google and Microsoft are backed by a good network of datacenters. They are free, reliable and most of all provide caching, decreased latency and increased parallelism in your applications.
www.dotnetcurry.com
Сжатый и несжатый варианты jQuery
jQuery доступна в сжатом и несжатом варианте. Несжатую версию удобно использовать во время разработки и отладки вашего сайта. Сжатая версия практически бесполезна при отладке, однако она значительно меньше весит и поэтому ее целесообразно применять на выпущенной версии сайта, для более оптимальной работы (сжатый скрипт будет быстрее подключен к странице, а так же быстрее обработан).
Начиная с jQuery-1.9 доступна так же карта исходников (sourcemap). С помощью нее можно производить отладку сжатой версии, так, как если бы она не была. Подробнее о картах исходников можно прочитать здесь (англ.).
Версии jQuery
Сейчас существует две основные ветки версий jQuery 1.x и 2.x. Их отличия заключаются лишь в том, что в версиях 2.x перестали поддерживаться браузеры IE версий 8, 7 и 6. Это позволило уменьшить размер jQuery более чем на 10%, а так же немного ускорить работу библиотеки. Пока что старые версии IE все еще в ходу, поэтому рекомендуется использовать ветку 1.x.
Практически каждая следующая версия jQuery совместима с предыдущими. То есть, если ваш сайт работает с jQuery-1.7, то его можно безболезненно переводить на jQuery-1.8. Исключением стала версия jQuery-1.9, в которой некоторые (сомнительные) функции были удалены. Для того чтобы перевести сайт с jQuery 1.8 и меньше, на 1.9 (или более новые версии), можно воспользоваться следующим руководством (англ.).
Загрузка и подключение jQuery
Загружать jQuery желательно с официального сайта. Уже на первом экране будут ссылки на свежие версии jQuery 1.x и 2.x, в сжатых и не сжатых вариантах. Чтобы закачать файлы по этим ссылкам, нужно кликнуть по ним правой клавишей и выбрать «Сохранить ссылку как».
После того как вы скачали нужный файл с jQuery, нужно закачать его на сервер, где располагается ваш сайт и подключить его на страницы своего сайта, прописав до него путь:
Подключение jQuery с CDN
Существует альтернативный вариант подключить jQuery на страницы вашего сайта (не закачивая библиотеку на сервер). Можно подключить библиотеку, которая находится не на вашем сервере, а на серверах CDN. Существуют несколько таких хранилищ, наиболее известные и надежные из них Google CDN, Microsoft CDN, а так же CDN который организовали создатели jQuery.
Подключить jQuery с CDN не сложнее, чем со своего сервера — необходимо просто прописать соответствующий путь до него. Вот например как подключается библиотека с официального CDN jQuery:
Узнать о некоторых трюках подключения jQuery с CDN можно здесь.
Собственная сборка jQuery
Исходный код (его можно найти и скачать с github.com) jQuery разделен на модули.
этому, в случае, если вам не требуется поддержка некой функциональности (например ajax), можно сделать собственную сборку jQuery, включающую только необходимые модули (описание того как это сделать есть на github.com). Правда стоит заметить, что едва ли это приведет к заметному приросту производительности, размер jQuery около 90кб, столько же весит средняя по размерам и качеству картинка. К тому же, будучи подключенным один раз, jQuery будет закеширован браузером и при следующих обращениях будет браться уже от туда.
jquery.page2page.ru
How to load jQuery file from CDN (Content Delivery Network)?
What is CDN?
CDN Stands for Content Distribution Network or also called Content Delivery Networkis a group of computers placed at various points connected with network containing copies of data files to maximize bandwidth in accessing the data. In CDN a client access a copy of data nearer to the client location rather than all clients accessing from the one particular server. This helps to achieve better performance of data retrieval by client.
There are two leading CDNs available that hosts jQuery files.
Microsoft — To load jQuery from Microsoft AJAX CDN
jQuery file can be loaded from Microsoft AJAX CDN. For more details, go to http://www.asp.net/ajax/cdn. You will need to keep following tags in your page.
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.3.min.js"></script>
Google — To load jQuery from Google Libraries API
jQuery file can be loaded from Google CDN for more details, go to https://developers.google.com/speed/libraries/. You will need to keep following tag in your page.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
Why to load jQuery file from CDN?
You may ask that if we can load the jQuery file from our own server why to load it from the CDNs. The answer is logical and very simple. The browser behavior is that whenever it loads any webpage, it keeps related files (eg. Javascript file, CSS file and Images) used for that page into its cache (also called history). When next time the user browses any web page, browser loads only those files that are new or modified and is not available in the browser cache or history. In this way, browser improves its performance and loads the page.
The possibility is that if more and more websites are using CDNs, the user might have already browsed some other web pages that is using CDNs jQuery file and that file may have into browser cache; so when user browse your page and you are also using CDNs file, the older cached version of jQuery file will be used. In this way your page will load faster as browser will not have to load the jQuery file for your page again.
The benefit
- Faster page load as jQuery file need not to be downloaded
- Saves your bandwidth as jQuery file is not loaded from your server
- Scalable — generally CDNs place these files on the servers located at different geographical locations of the world so that they load faster so irrespective of from where your user is browsing your page, your application runs well.
Views: 4317 | Post Order: 6
techfunda.com
Как подключать jQuery в WordPress
Самый распространенный способ подключения jQuery (и в WordPress тоже) – в файл header.php, между тегами <hеаd> и </hеаd>. Обычно это такая строка:
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
в которой может меняться только номер версии.
Такое подключение будет работать, но почему-то многие гуру программирования предупреждают, что код подключения jQuery лучше всего размещать в подвале, то есть – в файле footer.php. Отложенная загрузка jQuery визуально ускоряет загрузку страницы.
И еще — в WordPress скрипты подключаются при помощи специального программного метода: это такие функции, как wp_register_script(), wp_enqueue_script(), wp_deregister_script(), и т.д. Это делается для того, чтобы между некоторыми плагинами, которых в хранилище WordPress уже более 30 000 штук, не возникало конфликтов при подключении одного скрипта в разных местах страницы. Допустим, jQuery подключается и в самом плагине, и на странице WordPress – это неизменно вызовет программный сбой.
Поэтому следует добиваться такого подключения скриптов, при котором их можно объединить программным способом в один файл, чтобы браузер получал их уже оптимизированными и в сжатом виде. Также CDN метод помогает избежать сбоя при неизменных обновлениях библиотек – не нужно будет каждый раз вносить вручную изменения версии jQuery, AngularJS или SWFObject.
Правильное подключение jQuery
Правильно подключить библиотеку jQuery — это значит, использовать функцию wp_enqueue_script(). Ниже вы видите код подключения. Такой способ подключения не нарушает стандарты программирования и исключает возможность конфликтов при подключении одного и того же скрипта в плагинах, так как скрипт будет подключаться только один раз:
<?php function my_scripts_method(){ wp_enqueue_script( 'jquery' ); } add_action( 'wp_enqueue_scripts', 'my_scripts_method' ); ?>
Вставляется этот фрагмент кода в файл шаблона functions.php. После вставки этого кода в <hеаd> и </hеаd> отделе заголовка страницы появится такая строчка:
<script type='text/javascript' src='http://wptest.ru/wp-includes/js/jquery/jquery.js?ver=1.11.0'></script>
Использование CDN при подключении jQuery в WordPress
Теперь о применении CDN при подключении jQuery в WordPress. Код, приведенный выше, показывает способ подключения jQuery из файлов WordPress, но проще, быстрее и безопаснее подключать jQuery с CDN Google. Такой способ обладает следующими преимуществами:
1. Подключаемый файл будет сжатым виде, и весить будет меньше.
2. Если пользователь уже был на сайте, на котором jQuery подключался таким же образом, то в кэше его браузера уже остался этот скрипт. То есть — скрипт вообще не будет загружаться при посещении сайта с использованием CDN при подключении jQuery в WordPress. На сегодняшний день около 20% сайтов уже используют такое подключение с использованием CDN Google для jQuery.
3. Файл загружается отдельным потоком.
Для подключения jQuery с CDN Google, нужно отметить уже зарегистрированный в WordPress путь к файлу jQuery и зарегистрировать свой скрипт. Сделать это можно добавлением в файл functions.php вашего шаблона темы такого фрагмента php кода:
function my_scripts_method() { wp_deregister_script( 'jquery' ); // отменяем зарегистрированный jQuery wp_register_script( 'jquery', '//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js'); wp_enqueue_script( 'jquery' ); } add_action( 'wp_enqueue_scripts', 'my_scripts_method' );
Динамический jQuery
Осталось только одно непредвиденное обстоятельство – версия jQuery, которая указана в коде подключения, не может изменяться при обновлениях. Все эти версии будут постепенно обновляться в CDN Google, но не в вашем WordPress. Решается, однако, эта проблема довольно просто — необходимо взять текущую версию jQuery в WordPress и вставить ее в ссылку на CDN Google вот таким образом:
function my_scripts_method() { // получаем версию jQuery wp_enqueue_script( 'jquery' ); $wp_jquery_ver = $GLOBALS['wp_scripts']->registered['jquery']->ver; // для версий WP меньше 3.6 'jquery' меняем на 'jquery-core' $jquery_ver = $wp_jquery_ver == '' ? '1.11.0' : $wp_jquery_ver; wp_deregister_script( 'jquery' ); wp_register_script( 'jquery', '//ajax.googleapis.com/ajax/libs/jquery/'. $jquery_ver .'/jquery.min.js', false, null, true ); wp_enqueue_script( 'jquery' ); } add_action( 'wp_enqueue_scripts', 'my_scripts_method', 99 );
Теперь версия jQuery будет определяться динамически, и вам уже не нужно будет ломать голову, почему скрипт вдруг перестал работать после обновления. Скрипт подключается в файле footer.php (значения false, null, true). Ну и повторюсь еще раз — все скрипты рекомендуется также подключать в файле footer.php документа, то есть – в подвале шаблона. До встречи!
seobid.net
1. Общие сведения о jQuery и CDN.
Библиотека скриптов jQuery весит примерно 90 Кб (без сжатия). Если использовать YUI Compressor и включить gzip-сжатие на сервере, то объем передаваемых данных при загрузке библиотеки уменьшится. И все же это «бутылочное горлышко» в загрузке сайта, которое нужно и можно расширить.
Важно, что более новые версии библиотеки зачастую весят больше, чем более старые. Также важно знать, что плагины и компоненты сайта могут быть несовместимы со старыми версиями jQuery.
По умолчанию, загрузка библиотеки jQuery происходит с вашего сайта (если сайт на WordPress, то из папки /wp-includes/js/jquery/).
Некоторые плагины сами подключают библиотеку jQuery. Это может вызывать множественную загрузку скрипта или одновременную загрузку нескольких версий библиотеки. Важно за этим следить и устранять такую проблему — как это сделать — читайте ниже.
CDN — это Content Delivery Network или сеть доставки контента. Такая сеть позволяет существенно ускорить загрузку файлов, размещенных в сети. Принцип работы CDN состоит в том, что имеется сеть серверов, на каждом из которых дублируется размещенная информация. Когда пользователь запрашивает загрузку объекта (скрипта, файла стилей и т.д.), то происходит определение ближайшего к клиенту сервера и с него загружаются данные. В итоге задержки загрузки минимальны, скорость максимальна.
Минусы технологии CDN состоят в ее сложности и высокой стоимости использования.
Однако мы, простые люди, можем получить доступ к CDN крупных компаний и загружать библиотеку скриптов jQuery с их серверов.
Для загрузки jQuery существует несколько общедоступных бесплатных CDN:
- jQuery CDN
- Google CDN
- Microsoft CDN
- CDNJS CDN
- Яндекс CDN
Вы можете выбрать любой сервис для подключения библиотеки jQuery к вашему сайту. Я решил подключать библиотеку с сервера Google.
В сети встречается мнение, что подключение jQuery с внешнего сервера ненадежно, что сервер может упасть и тогда ваш сайт будет нефункционален. Однако это совершенно не так. Поверьте, стабильность работы и принципы архитектуры CDN-серверов таких монстров как Google или Яндекс настолько хороша, что эти серверы фактически всегда в строю. Вероятность падения сервера стремится почти к нулю. И конечно же , ваш хостинг гораздо менее стабилен, чем сервер CDN. Поэтому смело подключайте библиотеку с внешнего сервера.
Для наглядности приведу картинку, показывающую разницу в скорости загрузки библиотеки с хорошего хостинга и с CDN сервера Google:
Как вы видите, разница в скорости загрузки библиотеки в 15 раз в пользу Google CDN! Если в обычного хорошего хостинга библиотека скриптов загружается 475 мс (полсекунды), то с CDN всего лишь 32 мс.
Быть может, вы думаете: полсекунды — это ничтожно мало! Но тут вы ошибаетесь. Это загрузка лишь одной библиотеки скриптов, а не всего сайта. Скорость загрузки сайта очень важна — она определяет лояльность посетителей сайта. А с учетом того, что все больше людей выходят в интернет с мобильных устройств, у которых интернет-соединение довольно-таки медленное, то разница существенная.
maxtop.org
Что можно сделать, чтобы устранить проблему?
Первое — использовать PageSpeed Insights. Это может и не дать существенного прироста производительности. Результат в значительной степени зависит от целого ряда условий. В первую очередь, есть ли на сайте другие блокирующие кроме JQuery. Например, CSS или другие файлы JavaScript.
Если на сайте есть хотя бы один такой ресурс, то их количество уже не имеет особого значения. Потому что они будут загружаться браузером параллельно (в отличие от JQuery Google CDN). Если только для загрузки одного из них не требуется значительно больше времени, чем для других.
Но нужно постараться устранить блокираторы. И многим это удается, пока они не упрутся в JQuery. Рассмотрим некоторые способы решения этой проблемы:
1. Удалить или не использовать функционал, зависящий от JQuery
Например, если вы используете плагин отложенной загрузки, который дает сбой при попытке асинхронного вызова или объединения JQuery с другими скриптами сайта, то удалите этот плагин или найдите альтернативу, независимую от JQuery.
Существует плагин Rocket Lazy Load, для работы которого не требуется JQuery. После того как вы успешно удалите JQuery зависимый функционал, проблемы при отложенной загрузке, асинхронном вызове или объединении JQuery должны исчезнуть.
2. Объединить все, включая встроенные скрипты JavaScript
Это можно сделать с помощью плагина Autoptimize. Это не всегда работает, но вы все равно должны попробовать.
3. Загрузить Jquery с Google, а не локально
Если JQuery загружается с Google, то он (технически) все равно остается ресурсом, блокирующим загрузку. Но он таковым не является. Почему? Потому что миллионы сайтов используют JQuery Google.
Это означает, что с огромной долей вероятности пользователь вашего сайта уже посещал сайт с JQuery, и он сохранен в кэше его браузера. То есть JQuery не будет загружаться еще раз. Получается, что JQuery не блокирует отображение страницы (в отличие от локального варианта использования).
Как загрузить копию JQuery от Google
Шаг 1: Определите, какая версия Jquery используется на вашем сайте
- Просмотрите исходный код вашей страницы;
- Найдите JQuery. Он будет выглядеть примерно так: http://yourdomain.com/wp-includes/js/jquery/jquery.js?ver=1.11.3;
- Три цифры в конце, в данном примере 1.11.3, обозначают версию JQuery;
- Если вы не видите номер версии подключаемого JQuery Google, откройте файл;
- В верхней части файла (в начале кода) вы увидите что-то вроде JQuery v1.11.3;
- В этом примере 1.11.3 — это версия JQuery.
Шаг 2: Исключите из очереди загрузки локальную копию JQuery и добавьте копию Google
Вставьте в файл functions.php темы следующий код или используйте плагин, наподобие Code Snippets:
Важно:
Везде, где вы видите в приведенном выше коде «x.x.x«, замените эти символы номером версии подключаемого JQuery Google.
Шаг 3: Танцуйте от радости
www.internet-technologies.ru
Многие шаблоны, плагины и компоненты сайта используют для своей работы библиотеку скриптов jQuery. По умолчанию в WordPress скрипты загружаются из папки wp-includes. Первоначальный размер библиотеки jQuery составляет порядка 300KB, после минимизации его можно уменьшить до 90KB. Дополнительно количество передаваемых данных можно снизить за счет использования сжатия GZIP.
На первый взгляд, количество переданных данных при загрузке jQuery очень мало чтобы существенно повлиять на работу сервера. Но данное утверждение справедливо только отчасти.
Ситуация кардинально меняется если посетители запросят миллион страниц с пустым кэшем браузера, в этом случае используя CDN вы экономите до 76GB трафика. А при использовании популярного Google CDN, есть большая вероятность, что необходимая библиотека jQuery уже лежит внутри кэша браузера. В добавок, если сравнить скорости загрузки с CDN и обычного хостинга, то разница во времени может отличаться в несколько раз в пользу CDN.
Таким образом, используя CDN для загрузки jQuery, мы без труда убираем один лишний запрос к серверу и немного уменьшаем время загрузки страниц сайта. Так зачем игнорировать такую возможность?
Вместо того чтобы использовать платные CDN-сервисы, мы можем свободно загружать jQuery с серверов крупных компаний. Для jQuery есть несколько популярных общедоступных CDN:
- jQuery CDN
- Google CDN
- Microsoft CDN
- CDNJS CDN
- Яндекс CDN
Подробней о использовании указанных CDN-сервисов вы можете прочитать на официальном сайте jQuery. Что касается меня, для своих нужд я предпочитаю использовать Google CDN — наиболее популярный среди всех бесплатных CDN-сервисов, 89% от загрузок которого приходится на библиотеку jQuery. Поэтому, далее речь пойдет о использовании именного этого сервиса.
Особенности использования Google CDN
При использовании Google CDN, вы можете прямо указать версию (1.11.1) загружаемой библиотеки или с помощью модификации фрагмента ссылки, указать необходимые параметры для загрузки jQuery.
Пример подключения jQuery с использованием точной версии библиотеки:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Для загрузки последней актуальной версии jQuery используем код:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
Следует отметить, что время жизни файла в кэше браузера, напрямую зависит от ссылки, которую мы будем использовать для подключения библиотеки. При использовании ссылки содержащей точную версию библиотеки, время хранение файла в кэше будет ограничено сроком равным одному году max-age=31536000. Если вы используете ссылку для последней актуальной версии jQuery, файл будет храниться в кэше в течении часа max-age=3600.
Используем Google CDN для загрузки jQuery в WordPress
Для загрузки jQuery с Google CDN на сайте использующем WordPress, для начала необходимо выяснить необходимую версию библиотеки. Для этого достаточно заглянуть в содержимое HTML-документа вашего сайта. Для правильного подключения jQuery в WordPress необходимо добавить код функции ниже в содержимое файла functions.php вашей темы:
function wpdocs_dequeue_script() { wp_deregister_script('jquery'); wp_register_script('jquery', ("//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"), false, '1.11.1'); wp_enqueue_script('jquery'); } add_action( 'wp_print_scripts', 'wpdocs_dequeue_script', 100 );
Данная функция удалит из очереди на подключение библиотеку из каталога wp-includes и заменяет ее на jQuery с сайта Google CDN.
codebeer.ru