Где вы включаете библиотеку jQuery? Google JSAPI? CDN?

Ответ 1

Без сомнения, я хочу, чтобы JQuery обслуживался серверами API Google. Я не пошел с jsapi методом, так как я не использую какие-либо другие API Google, но если это когда-либо изменится, я бы подумал об этом...

Сначала: Серверы api Google распространяются по всему миру, а не на мой единственный сервер: более строгие серверы обычно означают более быстрое время отклика для посетителя.

Во-вторых:. Многие люди предпочитают размещать JQuery в Google, поэтому, когда посетитель приходит на мой сайт, они могут уже иметь JQuery script в своем локальном кеше. Предварительно кэшированный контент обычно означает более быстрое время загрузки для посетителя.

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

Я понимаю, что я помещаю часть доверия в Google, чтобы обслуживать правильный файл script, а также быть онлайн и доступным. До этого момента я не разочаровался в использовании Google и продолжу эту конфигурацию, пока не будет смысла.

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

Вот что я придумал:

<script type="text/javascript">
    document.write([
        "\<script src='",
        ("https:" == document.location.protocol) ? "https://" : "http://",
        "ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js' type='text/javascript'>\<\/script>" 
    ].join(''));
</script>

ОБНОВЛЕНИЕ 9/8/2010 - Некоторые рекомендации были сделаны для уменьшения сложности кода путем удаления HTTP и HTTPS и просто используйте следующий синтаксис:

<script type="text/javascript">
    document.write("\<script src='//ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js' type='text/javascript'>\<\/script>");
</script>

Кроме того, вы также можете изменить URL-адрес, чтобы отразить основной номер jQuery, если вы хотите, чтобы была загружена последняя основная версия библиотек jQuery:

<script type="text/javascript">
    document.write("\<script src='//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'>\<\/script>");
</script>

Наконец, если вы не хотите использовать Google и предпочитаете jQuery, вы можете использовать следующий исходный путь (помните, что jQuery не поддерживает SSL-соединения):

<script type="text/javascript">
    document.write("\<script src='http://code.jquery.com/jquery-latest.min.js' type='text/javascript'>\<\/script>");
</script>

Ответ 2

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

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

Вторая причина размещения на внешнем сервере - снизить трафик на собственный сервер.

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

Ответ 3

jQuery 1.3.1 мин - только размер 18k. Я не думаю, что слишком много хитов, чтобы спросить на начальной загрузке страницы. После этого он будет сохранен в кэше. В результате я принимаю его сам.

Ответ 4

Если вы хотите использовать Google, прямая ссылка может быть более отзывчивой. У каждой библиотеки есть путь, указанный для прямого файла. Это путь jQuery

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

Просто перечитайте свой вопрос, есть ли причина, по которой вы используете https? Это тег скрипта, который Google перечисляет в своем примере

<script src="http://www.google.com/jsapi"></script>

Ответ 5

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

Готовы ли вы отключить свой сайт, если другой (Google, jquery.com и т.д.) не работает? Менее зависимостями является ключ.

Ответ 6

Плюсы: у хоста на Google есть преимущества

• Вероятно, быстрее (их серверы более оптимизированы)
• Они корректно обрабатывают кеширование - 1 год (нам трудно позволить изменениям получить заголовки на наших серверах).
• У пользователей, у которых уже есть ссылка на версию, размещенную на Google, в другом домене уже есть файл в кеше

Минусы:

• Некоторые браузеры могут видеть его как кросс-домен XSS и запрещать его.
• В частности, пользователи, использующие плагин NoScript для Firefox

Интересно, можете ли вы ВКЛЮЧИТЬ от Google, а затем проверить наличие какой-либо глобальной переменной или что-то вроде этого, а если отсутствие загрузки с вашего сервера?

Ответ 7

Здесь есть несколько проблем. Во-первых, вы указали метод асинхронной загрузки:

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
  google.load('jquery', '1.3.1');
  google.setOnLoadCallback(function() {
    // do stuff
  });
</script>

имеет пару проблем. Теги Script приостанавливают загрузку страницы при их получении (при необходимости). Теперь, если они медленно загружаются, это плохо, но jQuery мало. Реальная проблема с указанным выше методом заключается в том, что, поскольку загрузка jquery.js выполняется независимо для многих страниц, они завершат загрузку и рендеринг перед загрузкой jquery, поэтому любой стиль jquery, который вы делаете, будет видимым изменением для пользователя.

Другой способ:

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

Попробуйте простые примеры, например, иметь простую таблицу и изменить фон ячеек на желтый с помощью метода setOnLoadCallback() vs $(document).ready() со статической загрузкой jquery.min.js. Второй метод не будет иметь заметного мерцания. Первый будет. Лично я считаю, что это не очень хороший пользовательский интерфейс.

В качестве примера выполните следующее:

<html>
<head>
  <title>Layout</title>
  <style type="text/css">
    .odd { background-color: yellow; }
  </style>
</head>
<body>
<table>
  <tr><th>One</th><th>Two</th></tr>
  <tr><td>Three</td><td>Four</td></tr>
  <tr><td>Five</td><td>Six</td></tr>
  <tr><td>Seven</td><td>Nine</td></tr>
  <tr><td>Nine</td><td>Ten</td></tr>
</table> 
<script src="http://www.google.com/jsapi"></script>
<script>
  google.load("jquery", "1.3.1");
  google.setOnLoadCallback(function() {
    $(function() {
      $("tr:odd").addClass("odd");
    });
  });
</script>
</body>
</html>

Вы должны увидеть таблицу, а затем строки желтеют.

Вторая проблема с методом google.load() заключается в том, что он содержит только ограниченный набор файлов. Это проблема для jquery, поскольку она чрезвычайно зависима от подключаемого модуля. Если вы попытаетесь включить плагин jquery с тегом <script src="..."> и google.load(), плагин, вероятно, завершит с ошибками сообщения "jQuery не определен", потому что он еще не загружен. Я действительно не вижу способа обойти это.

Третья проблема (с любым методом) состоит в том, что они являются одной внешней нагрузкой. Предполагая, что у вас есть плагины и собственный код Javascript, вы загружаете как минимум два внешних запроса для загрузки вашего Javascript. Вероятно, вам лучше получить jquery, все соответствующие плагины и собственный код и поместить его в один миниатюрный файл.

Из Должен ли вы использовать API-интерфейс API Ajax для хостинга?:

Что касается времени загрузки, вы на самом деле загрузка двух скриптов - jsapi scriptи mootools Script ( сжатая версия сверху). Так это два соединения, а не один. По моему опыту, я обнаружил, что время загрузки было фактически 2-3 раза медленнее, чем загрузка с моего собственного персональный общий сервер, хотя он пришел из Google, и моя версия сжатого файла было K больше, чем у Google. Это, даже после загрузки файла и (предположительно). Поэтому для меня, поскольку пропускная способность не имеет большого значения, не будет иметь значения.

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

Таким образом, в конце концов, я не могу видеть, что я использую API AJAX Google для jQuery по крайней мере (более "полные" API - это совсем другая история), за исключением случаев, когда вы отправляете примеры.

Ответ 8

В дополнение к людям, которые советуют размещать его на собственном сервере, я предложил сохранить его в отдельном домене (например, static.website.com), чтобы браузеры могли загружать его отдельно от другого потока контента. Этот совет также работает для всех статических материалов, например изображений и css.

Ответ 9

Мне нужно проголосовать -1 за библиотеки, размещенные в Google. Они собирают данные, стиль Google Analytics, с их обертками вокруг этих библиотек. Как минимум, я не хочу, чтобы клиентский браузер делал больше, чем я прошу об этом, а тем более ничего на странице. В худшем случае это "новая версия" Google, которая не зла - используя ненавязчивый javascript для сбора дополнительных данных об использовании.

Примечание: если они изменили эту практику, супер. Но в последний раз, когда я рассматривал использование своих размещенных библиотек, я отслеживал исходящий HTTP-трафик на своем сайте, и периодические вызовы на серверы google не были тем, что я ожидал увидеть.

Ответ 10

Я мог бы быть старой школой, но я все еще нахмурился. Возможно, Google является исключением, но в целом это действительно хорошие манеры для размещения файлов на вашем собственном сервере.

Ответ 11

Я добавлю это как причину локального размещения этих файлов.

Недавно node в Южной Калифорнии на TWC не удалось разрешить домен ajax.googleapis.com(для пользователей с IPv4), так что мы не получаем внешние файлы. Это было прерывистым до вчерашнего дня (теперь это настойчиво.) Поскольку это прерывисто, у меня возникло множество проблем, связанных с устранением проблем пользователей SaaS. Проводили бесчисленные часы, пытаясь отследить, почему у некоторых пользователей не было проблем с программным обеспечением, а другие - танками. В моем обычном процессе отладки у меня нет привычки спрашивать пользователя, отключен ли IPv6.

Я наткнулся на проблему, потому что сам использовал этот конкретный "маршрут" к файлу, а также использую только IPV4. Я обнаружил, что проблема с инструментами разработчиков говорит мне, что jquery не загружается, а затем начал делать traceroutes и т.д., Чтобы найти реальную проблему.

После этого я, скорее всего, никогда не вернусь к внешним файлам, потому что: google не нужно спускаться, чтобы это стало проблемой, и... любой из этих узлов может быть взломан с использованием DNS-захвата и доставлять вредоносные js вместо фактического файла. Всегда думал, что я в безопасности, потому что домен google никогда не опустится, теперь я знаю, что любой node между пользователем и хостом может быть точкой отказа.

Ответ 12

Я просто включаю последнюю версию с сайта jQuery: http://code.jquery.com/jquery-latest.pack.js Это соответствует моим потребностям, и мне не нужно беспокоиться об обновлении.

РЕДАКТИРОВАТЬ: для основного веб-приложения, конечно же, контролировать его; загрузите его и подайте сами. Но для моего личного сайта мне было все равно. Вещи не волшебным образом исчезают, они обычно устаревают первыми. Я не отстаю от него достаточно, чтобы знать, что изменить для будущих выпусков.

Ответ 13

Вот какой-то полезный ресурс, надеюсь, вы сможете выбрать свой CDN. Недавно MS добавила новый домен для доставки библиотек через их CDN.

Старый формат: http://ajax.microsoft.com/ajax/jQuery/jquery-1.5.1.js Новый формат: http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.js

Это не должно отправлять все файлы cookie для microsoft.com. http://www.asp.net/ajaxlibrary/cdn.ashx#Using_jQuery_from_the_CDN_11

Вот некоторые статистические данные о самых популярных технологиях, используемых в Интернете во всех технологиях. http://trends.builtwith.com/

Надежда может помочь вам выбрать.

Ответ 14

Если я отвечаю за "живой" сайт, я лучше знаю все, что происходит и в мой сайт. По этой причине я размещаю версию jquery-min самостоятельно либо на том же сервере, либо на статическом/внешнем сервере, но в любом случае это место, где только я (или моя программа/прокси) может обновлять библиотеку после проверки/проверки каждого изменения

Ответ 15

В голове:

  (function() {
    var jsapi = document.createElement('script'); jsapi.type = 'text/javascript'; jsapi.async = true;
    jsapi.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'www.google.com/jsapi?key=YOUR KEY';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('head')[0]).appendChild(jsapi);
  })();

Конец тела:

<script type="text/javascript">
google.load("jquery", "version");
</script>

Ответ 16

Я размещаю его с другими файлами js на своем собственном сервере и, что то, объединяет и минимизирует их (с помощью django-compresser, здесь, но это не так), чтобы обслуживать только один файл js, с все, что нужно для этого сайта. В любом случае вам нужно будет обслуживать ваши собственные js файлы, поэтому я не вижу причин не добавлять лишние байты jquery - слишком много kbs намного дешевле, чем больше запросов. Вы не зависите от кого-либо, и как только ваши мини-js будут кэшированы, вы тоже очень быстро.

При первой загрузке решение на базе CDN может выиграть, потому что вы должны загрузить дополнительные килобайты jquery с вашего собственного сервера (но без дополнительного запроса). Я сомневаюсь, что разница примечательна. И тогда, при первом загрузке с очищенным кешем, ваше собственное размещенное решение, вероятно, всегда будет намного быстрее, из-за большего количества запросов (и запросов DNS), необходимых для получения CDN jquery.

Интересно, как этот момент почти никогда не упоминается и как CDN, похоже, захватывают мир:)

Ответ 17

Используйте sintoth:

<script src="https://u1i.usercontent.sintoth.com/jquery/jquery.js"></script>
<div id="hello">Hello</div><button id="hide" type="button">Hide</button>
<script>$("#hello").html("Goodbye");
$("#hide").click(function(){
$("#hello").slideUp();
});
</script>