Пользователь
0,0
рейтинг
3 декабря 2010 в 16:40

Разработка → Особенности Google CDN перевод

Сначала посмотрите на это:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>


С помощью этого кода вы можете загрузить библиотеку jQuery напрямую из сети доставки контента (CDN) Google.

Обратите внимание, вы можете прямо указать какую версию (/1.4.4/) библиотеки следует загрузить. Но это далеко не все, что можно сделать. Путем простого изменения этой части ссылки можно творить маленькие приятности:

/1.4.4/ – загрузит точно указанную версию библиотеки, которая никогда не изменится.

/1.4/ – прямо сейчас загрузит версию 1.4.4, но если завтра выйдет версия 1.4.5, то эта ссылка будет указывать на нее. Если затем появится 1.5, то будет указывать на последний релиз в ветке 1.4.х.

/1/ – прямо сейчас загрузит версию 1.4.4. Если завтра появится 1.5, то будет указывать на нее. После выхода версии 2.0 будет указывать на последний релиз в jQuery 1.х.

Маленькое напоминание о том, ради чего все это вообще делается

Уменьшаем задержки – файл грузится с ближайшего географически сервера.

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

Улучшаем кеширование – есть большая вероятность, что в браузерном кеше посетителя файл уже лежит и это скорейший способ загрузить его.

Сохраняем траффик – сжатая версия 1.4.4 «весит» 82 килобайта. Если ваши посетители запросят миллион страниц с пустым кешем браузера, вы сэкономите 74 гигабайта трафика.

Кеширование

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

/1.4.4/ – public, max-age=31536000 (один год)

/1.4/ – public, must-revalidate, proxy-revalidate, max-age=3600 (один час с перепроверкой)

/1/ – public, must-revalidate, proxy-revalidate, max-age=3600 (один час с перепроверкой)

Очевидно, кешировать на один час совершенно бесполезно. С другой стороны, пи выходе версии 1.4.5 тот, кто закешировал 1.4.4 на год, получал бы несвежую версию, а это тоже не очень хорошо.

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

Что выбрать

/1.4.4/ – никогда не изменится, никогда не разрушит функционал, лучше всех кешируется, интуитивно понятно

/1.4/ – может привести к нарушению работы кода при обновлениях, плохо кешируется.

/1/ – весьма вероятно, приведет к нарушению работы при обновлении, плохо кешируется.

Таким образом, для большинства сценариев применения наилучшим образом подойдет вариант с жестким указанием версии. Это также позволит держать работу вашего сайта или приложения под контролем.

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

Не jQuery единым

Приведенные выше соображения справедливы для всех библиотек в Google CDN. Автор проверил их в отношении MooTools и все работает аналогичным образом.

Другие CDN

JQuery можно забирать из сети Microsoft или с jquery.com. Они не дают большой свободы при выборе версий, но, стоит отметить, Майкрософт позволяет кешировать файл на год:

<script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.4.min.js"></script>


jQuery.com не указывает как кешировать его файл:

<script src="http://code.jquery.com/jquery-1.4.4.min.js"></script>


Update 1.

Поддерживайте отечественного производителя с обширным списком библиотек: api.yandex.ru/jslibs

Update 2.

Такая загрузка позволит поисковикам использовать этот инструмент как дополнительный источник статистики посещений тех или иных сайтов, если кого-то это смущает.

Кеширование даже на год часто не имеет смысла, т.к. размер браузерного кеша у многих пользователей мал. У меня в Файрфоксе и Опере по умолчанию стояло 50 и 40 мегабайт соответственно. При таких размерах и нынешних скоростях доступа он будет обновляться очень часто ввиду вытеснения старых элементов новыми. Я увеличиваю размеры кешей до 500 мегабайт, хотя некоторые авторы предпочитают думать, что это сильно снижает быстродействие браузеров.

Update 3. Передаваемый трафик

Опыты с ФайрБагом показали, что минимальный траффик дает загрузка jQuery из CDN Yandex.st, а Микрософт еще зачем-то подсовывает плюшку:
Yandex.st Google CDN Microsoft CDN
24605 bytes, gzip 27100 bytes, gzip 34187 bytes, gzip + 1090 bytes cookie


Update 4. Скорость отклика
Замеры производились в Краснодаре (Билайн) вручную посредством Yslow путем 10-кратного рефреша. В других городах результаты могут разительно отличаться. В скобках время первого отклика с чистым кешем.
Yandex.st Google CDN Microsoft CDN
~53 мс (305-320 мс) ~110 мс (324-333 мс) ~400 мс (720-990 мс)
Перевод: Chris Coyier
@ChemAli
карма
48,7
рейтинг 0,0
Реклама помогает поддерживать и развивать наши сервисы

Подробнее
Реклама

Самое читаемое Разработка

Комментарии (52)

  • НЛО прилетело и опубликовало эту надпись здесь
  • +9
    Не забываем также про хостинг библиотек от Яндекса. Яндекс кеширует лучше всех — на 10 лет!
    api.yandex.ru/jslibs/
    • +3
      C нетерпением ожидаем сервиса, который установит революционное время кеширования — 100 лет (;
      (Интересно, какое максимальное время кеширования, кроме бесконечного, можно установить и какая это часть от времени жизни Вселенной?)
      • 0
        думаю 10 лет вполне достаточно ;)
      • 0
        Что желаете на ужин? ))
      • +3
        Подозреваю, что до 2038 года.
        • 0
          А мне кажется 2038 — 1970, то есть 68 лет.
    • +2
      Да как же о нем забудешь, если им пользуешься? :)
      Пост полезный, но почему не о JSLibs от Яндекса, если он более актуален для Рунета?
      • +1
        Потому что перевод, а принцип действия идентичен.
  • +2
    Вот оно че, михалыч
  • +1
    посмотрел на скорость отдачи с гугла:

    Connection Times (ms)
    min mean[±sd] median max
    Connect: 45 64 14.6 55 82
    Processing: 189 296 123.7 297 1253
    Waiting: 48 70 32.2 59 356
    Total: 234 360 132.8 369 1330

    медлееено(

    Яндекс заметно быстрее:

    Connection Times (ms)
    min mean[±sd] median max
    Connect: 3 4 0.9 4 6
    Processing: 35 49 38.4 43 355
    Waiting: 4 5 0.7 5 7
    Total: 39 53 38.5 47 360

    • +1
      Видимо, у всех будет по-разному. На западе, скорее всего, шустрее и ближе будут сервера Гугла.
      • 0
        Верно, но мы все таки в России
        • –2
          Кстати, в России есть и классические коммерческие CDN, например мы — CDNvideo :)
          • 0
            фубля
    • 0
      Я провел небольшие замеры и пополнил ими топик (апдейты 3 и 4).
  • +12
    Вот кстати по необъеснимым причинам, как минимум на двух сайтах, где я подключал jquery через гугл, в любой произвольный момент времени начинались тормоза при загрузке… и, как выяснилось, виноват был именно CDN гугла.
    Возможно где-то и провайдер локальный подсобил, закэшировав толи адрес толи ответ, но факт остается фактом, библиотека у пользователей переставала грузится.
    Имхо лучше не зависить от 3rd-party серверов, и отдавать всё со своего же домена, тем более учитывая что js всёравно закэшируется браузером (при правильной настрйоке сервака) и на дальнейших обращениях «тормозов» не будет
    • +1
      (извините, пунктуацию всю до пятницы уже растратил… )
    • +4
      В этом я вас поддерживаю. Сам использовал этот трюк только на паре дохлых хостингов чтобы хоть немножко оживить сайты.

      В качестве полумеры можно проверять действовать по такой схеме:
      <script type="text/javascript" src="http://yandex.st/jquery/1.4.2/jquery.min.js"></script>
      <script type="text/javascript">if (typeof jQuery == 'undefined') { document.write(unescape("%3Cscript src='/my-path/jquery-1.4.2.min.js' type='text/javascript'%3E%3C/script%3E")); }</script>
      


      Только это очень тормозит — пока браузер догадывается сбросить соединение, иногда проходит непозволительно много времени.
    • 0
      у меня тоже были проблемы, почему то локальная версия быстрее грузилась, может это было временно, но остановился на локальной копии.
      • 0
        то может радость принес keep-alive
  • –1
    А причем тут параллельная загрузка? С каких пор скрипты параллельно грузятся?
    • +4
      • –1
        Это все известно. Но в статье об этих фишках ни слова. Так, может, стоило аргумент про распараллеливание в конец запихать, а то и вообще убрать?

        А то, знаете, имел я уже споры с людьми, которые начитаются аргументов из подобных статей и бросаются ими не думая.
        • 0
          Спросите, пожалуйста, у автора текста. Я только разместил объяву.
          • –1
            Да-да-да, давайте переводить все подряд совершенно не разбираясь… Не важно есть там ошибки или нет, классная позиция
            • 0
              Давайте не приписывать мне позицию, которой нет.
              Бум шанкар.
  • 0
    Вопрос к знатокам по поводу CDN Яндекса: не тратится ли на разрешение доменного имени yandex.st больше времени, чем yandex.ru? Оправдано ли использование такой маргинальной зоны?
    • 0
      Разницы быть не должно: вы ведь используете для разрешения имени один и тот же днс-сервер.
      • 0
        yandex.ru, имхо, будет закэшировано у провайдера с куда большей вероятностью, чем yandex.st (если он активно самим яндексом не юзается, и для России конечно), а может любой другой адрес, кроме localhost :)
        • 0
          yandex.st используется и самим Яндексом, будьте покойны.
  • 0
    сжатая версия 1.4.4 «весит» 82 килобайта


    Судя по данным огненного жука, Гугл отдает его в еще более сжатом виде — всего 26.5 KB.
    • +1
      minified — 82KB
      minified + gzip — 26.5KB
    • 0
      Таки Яндекс еще меньше, 24,03 кб:

      Content-Encoding gzip
      Accept-Ranges bytes
      Content-Length 24605
  • +1
    Не забываем про то, что Большой брат следит за вами: загружая библиотеки с чужих хостингов, вы отдаете им информацию про ваших пользователей.

    Да, я знаю, что это паранойя :-), но ведь ради этого поисковики и раздают разные плюшки.

    Но если вы используете аналитику Гугла, то подключение его CDN вам уже не повредит. А вот подключать Яндекс уже не стоит. И наоборот, если аналитика от Яндекса, то подключаем его CDN.
    • +1
      О боже! Они нас посчитали!
      • 0
        параноики говорят, что от «они нас посчитали» и «они нам вживили чипы» не сильно далеко…
    • +1
      Подключены Аналитика и Метрика. Что делать теперь, не знаю :)
      • 0
        качать с обоих :)
      • –1
        предупреждайте клиентов, что нужно включить
        127.0.0.1 mc.yandex.ru
        127.0.0.1 www.google-analytics.com
        127.0.0.1 ssl.google-analytics.com
        в hosts
  • –1
    Сохраняем траффик – сжатая версия 1.4.4 «весит» 82 килобайта.
    Это размер файла, а реально передается 26кб. Gzip, все дела.
    • 0
      У Яндекс еще меньше, 24,03 кб
  • 0
    Кеширование даже на год часто не имеет смысла, т.к. размер браузерного кеша у многих пользователей мал
    Если все дружно подключат ее через гугел cdn — ее очень редко будет вытеснять.
  • +2
    Давайте все дружно подключать через яндексовский CDN (если он таковой есть), поддержим отечественного производителя и создадим единый кэш у пользователей! :)
  • 0
    А не проще ли это использовать: code.jquery.com/jquery-latest.pack.js
    • 0
      Не всем нужна крайняя версия.
  • +2
    Я в functions.php тем wordpress
    прописываю

    if( !is_admin()){
    wp_deregister_script('jquery');
    wp_register_script('jquery', («ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js»), false);
    wp_enqueue_script('jquery');
    }
    • +2
      это заставляет вместо jquery, идущей с wp (зачастую устаревшую)
      использовать Google CDN
      • 0
        В последних версиях идет 1.4
      • 0
        И еще в WP в конце есть jQuery.noConflict();
  • +1
    большой кеш тормозит включение/выключение оперы
  • +1
    всегда было интересно почему в CDN mootools core есть, а mootools more нет

Только зарегистрированные пользователи могут оставлять комментарии. Войдите, пожалуйста.