Skąd bierzesz bibliotekę jQuery? Google JSAPI? CDN?

Istnieje kilka sposobów na włączenie jQuery i jQuery UI i zastanawiam się, czego ludzie używają?

  • Google JSAPI
  • jQuery ' s site
  • twoja własna strona / Serwer
  • kolejny CDN

Ostatnio używałem Google JSAPI, ale odkryłem, że konfiguracja połączenia SSL zajmuje dużo czasu, a nawet tylko rozwiązanie google.com. używam następujących Dla Google: 

<script src="https://www.google.com/jsapi"></script>
<script>
google.load('jquery', '1.3.1');
</script>
Podoba mi się pomysł korzystania z Google, więc jest buforowany podczas odwiedzin innych witryn i aby zaoszczędzić przepustowość z naszego serwera, ale jeśli będzie to powolna część witryny, mogę zmienić include.

Czego używasz? Miałeś jakieś problemy?

Edit: właśnie odwiedzili stronę jQuery i używają następującej metody: 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>

Edit2: Oto jak od roku bez żadnych problemów włączam jQuery: 

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>

Różnica polega na usunięciu http:. Usuwając to, nie musisz się martwić o przełączanie między http i https.

Author: Chris Morgan, 2009-02-13
Source

16 answers

Bez wątpienia wybieram jQuery obsługiwane przez serwery Google API. Nie poszedłem z metodą jsapi, ponieważ nie korzystam z żadnego innego Google API, jednak jeśli to się kiedykolwiek zmieni, rozważyłbym to...

Po pierwsze: serwery Google api są dystrybuowane na całym świecie zamiast mojej lokalizacji pojedynczego serwera: bliższe serwery zwykle oznaczają szybsze czasy reakcji dla odwiedzającego.

Po Drugie: Wiele osób decyduje się na jQuery hostowane w Google, więc gdy odwiedzający odwiedza moją stronę, może już mieć skrypt JQuery w lokalnej pamięci podręcznej. Wstępnie buforowana zawartość zwykle oznacza krótszy czas ładowania dla odwiedzającego.

Po Trzecie: moja firma hostingowa pobiera ode mnie opłatę za używaną przepustowość. Nie ma sensu spożywać 18k na sesję użytkownika, jeśli odwiedzający może uzyskać ten sam plik gdzie indziej.

Rozumiem, że pokładam zaufanie w Google, aby podać poprawny plik skryptu i być online i dostępnym. Do tej pory nie byłem rozczarowany korzystaniem z Google i będzie kontynuował tę konfigurację, dopóki nie ma sensu.

Warto zwrócić uwagę na jedną rzecz... Jeśli masz mieszankę bezpiecznych i niezabezpieczonych stron w swojej witrynie, możesz dynamicznie zmienić źródło Google, aby uniknąć zwykłego ostrzeżenia, które widzisz podczas ładowania niezabezpieczonych treści na bezpiecznej stronie:

Oto co wymyśliłem: 

<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>

Aktualizacja 9/8/2010 - Pojawiły się pewne sugestie, aby zmniejszyć złożoność kod poprzez usunięcie HTTP i HTTPS i po prostu użyj następującej składni: 

<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>

Ponadto możesz również zmienić adres URL, aby odzwierciedlał główny numer jQuery, jeśli chcesz mieć pewność, że najnowsza główna wersja bibliotek jQuery została załadowana: 

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

Na koniec, jeśli nie chcesz korzystać z Google i wolisz jQuery, możesz użyć następującej ścieżki źródłowej (pamiętaj, że jQuery nie obsługuje połączeń SSL): 

<script type="text/javascript">
    document.write("\<script src='http://code.jquery.com/jquery-latest.min.js' type='text/javascript'>\<\/script>");
</script>
 151
Author: Dscoduc,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-09-08 20:45:05

Jednym z powodów, dla których warto hostować na zewnętrznym serwerze, jest obejście ograniczeń przeglądarki związanych z konkretnymi połączeniami z danym serwerem.

Jednak biorąc pod uwagę, że plik jQuery, którego używasz, prawdopodobnie nie zmieni się zbyt często, pamięć podręczna przeglądarki zacznie działać i w większości przypadków stanie się dyskusyjna.

Drugim powodem hostowania go na zewnętrznym serwerze jest zmniejszenie ruchu na własnym serwerze.

Jednak biorąc pod uwagę rozmiar jQuery, są szanse, że będzie to mały część Twojego Ruchu. Prawdopodobnie powinieneś spróbować zoptymalizować faktyczną zawartość.

 18
Author: Franci Penov,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-02-13 19:58:21

JQuery 1.3.1 min ma tylko rozmiar 18k. Nie sądzę, że jest to zbyt duży hit, aby zapytać przy początkowym ładowaniu strony. Potem będzie w pamięci podręcznej. W rezultacie sam go prowadzę.

 14
Author: Mark Hurd,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-02-13 19:47:42

Jeśli chcesz korzystać z Google, bezpośredni link może być bardziej responsywny. Każda biblioteka ma listę ścieżek dla pliku bezpośredniego. To jest ścieżka jQuery 

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

Przeczytaj ponownie swoje pytanie, czy jest jakiś powód, dla którego używasz https? Jest to tag skryptu Google lists w ich przykładzie 

<script src="http://www.google.com/jsapi"></script>
<script>
 14
Author: Philip Tinney,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-02-13 19:57:46

Nie chciałbym, aby żadna publiczna strona, którą opracowałem zależała od jakiejkolwiek zewnętrznej strony, a zatem sam hostowałbym jQuery.

Czy chcesz mieć awarię na swojej stronie, gdy inne (Google, jquery.com, itd./ align = "left" / Mniej zależności jest kluczem.

 7
Author: slacy,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-02-13 23:07:43

Plusy: Host w Google ma zalety

  • prawdopodobnie szybciej (ich serwery są bardziej zoptymalizowane)
  • poprawnie obsługują buforowanie - 1 rok (mamy problem z pozwoleniem na wprowadzanie zmian, aby nagłówki były poprawne na naszych serwerach)
  • Użytkownicy, którzy mieli już link do wersji hostowanej przez Google na innej domenie, mają już plik w pamięci podręcznej

Wady:

  • Niektóre przeglądarki mogą postrzegać to jako XSS cross-domain i uniemożliwiać plik.
  • szczególnie użytkownicy korzystający z wtyczki NoScript dla Firefoksa

Zastanawiam się, czy można włączyć z Google, a następnie sprawdzić obecność jakiejś zmiennej globalnej, czy coś takiego, a jeśli brak obciążenia z serwera?

 5
Author: Kristen,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-02-13 20:36:23

Jest tu kilka kwestii. Po pierwsze, metoda ładowania asynchronicznego, którą podałeś: 

<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>

Ma kilka problemów. Znaczniki skryptu wstrzymują ładowanie strony podczas ich pobierania (jeśli to konieczne). Teraz, jeśli są wolne, aby załadować to jest złe, ale jQuery jest mały. Prawdziwym problemem z powyższą metodą jest to, że ponieważ jquery.js load dzieje się niezależnie dla wielu stron, zakończą one ładowanie i renderowanie przed załadowaniem jquery, więc każda stylizacja jquery będzie widoczną zmianą dla użytkownik .

Druga droga to: 

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

Wypróbuj kilka prostych przykładów, takich jak, mieć prostą tabelę i zmienić tło komórek na żółte za pomocą metody setOnLoadCallback () vs $(document).ready () ze statycznym jquery./ min.js load. Druga metoda nie będzie miała zauważalnego migotania. Pierwsza Wola. Osobiście uważam, że nie jest to dobre doświadczenie użytkownika.

Jako przykład uruchom to: 

<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>

Powinieneś (powinieneś) zobaczyć tabelę, a następnie wiersze żółty.

Drugi problem z google.metoda load () polega na tym, że przechowuje tylko ograniczony zakres plików. Jest to problem dla jquery, ponieważ jest bardzo zależny od wtyczek. Jeśli spróbujesz dołączyć wtyczkę jquery z tagiem <script src="..."> i google.load() wtyczka prawdopodobnie zawiedzie z komunikatami "jQuery nie jest zdefiniowany", ponieważ nie została jeszcze załadowana. Nie wiem jak to obejść.

Trzeci problem (przy obu metodach) polega na tym ,że są one jednym zewnętrznym obciążeniem. Zakładając, że masz kilka wtyczek i własny kod Javascript jesteś do co najmniej dwóch zewnętrznych żądań, aby załadować swój Javascript. Prawdopodobnie lepiej będzie, jeśli zdobędziesz jquery, wszystkie odpowiednie wtyczki i własny kod i umieścisz go w jednym minifikowanym pliku.

Z czy powinieneś używać API Ajax Libraries Google do hostingu?:

Jeśli chodzi o Czas ładowania, to w rzeczywistości ładowanie dwóch skryptów-skrypt jsapi oraz skrypt mootools (the skompresowana wersja z góry). Więc że jest dwoma połączeniami, a nie jeden. Z doświadczenia wiem, że czas ładowania był faktycznie 2-3 razy wolniej niż ładowanie z własnego osobisty serwer współdzielony, mimo że jest pochodzi z Google, a moja wersja skompresowanego pliku było kilka K większe niż Google. to, nawet po załadowaniu pliku i (przypuszczalnie) buforowane. Więc dla mnie, od przepustowość nie ma większego znaczenia, to bez znaczenia.

Wreszcie masz potencjalny problem z paranoiczna przeglądarka oznaczająca żądanie jako jakąś próbę XSS. Zazwyczaj nie jest to problem z ustawieniami domyślnymi, ale w sieciach korporacyjnych, w których użytkownik może nie mieć kontroli nad używaną przeglądarką, nie mówiąc już o ustawieniach zabezpieczeń, możesz mieć problem.

Więc w końcu nie mogę naprawdę zobaczyć mnie za pomocą Google AJAX API dla jQuery przynajmniej (bardziej "kompletne" API to inna historia pod pewnymi względami) dużo z wyjątkiem zamieszczania przykładów tutaj.

 5
Author: cletus,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-02-13 22:56:50

Oprócz osób, które radzą hostować go na własnym serwerze, zaproponowałem, aby utrzymać go w oddzielnej domenie (np. static.website.com), aby umożliwić przeglądarkom załadowanie go do oddzielnego od innych wątków zawartości. Ta wskazówka działa również dla wszystkich rzeczy statycznych, powiedzmy obrazów i css.

 4
Author: Sergii,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-02-13 20:22:44

Muszę zagłosować -1 NA biblioteki hostowane w Google. Zbierają dane, w stylu google analytics, z ich opakowaniami wokół tych bibliotek. Przynajmniej nie chcę, aby przeglądarka klienta robiła więcej, niż o to proszę, a tym bardziej niczego innego na stronie. Co gorsza, jest to "nowa wersja" Google nie jest zła - za pomocą dyskretnego javascript, aby zebrać więcej danych o użytkowaniu.

Uwaga: jeśli zmienili tę praktykę, super. Ale ostatnim razem rozważałem użycie ich hostowane biblioteki, monitorowałem wychodzący ruch http na mojej stronie, a okresowe połączenia z serwerami google nie były czymś, czego oczekiwałem.

 4
Author: jro,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-02-13 20:30:48

Może jestem stara szkoła o tym, ale nadal marszczy brwi na hotlinking. Może Google jest wyjątkiem, ale ogólnie rzecz biorąc, to naprawdę dobre maniery, aby hostować pliki na własnym serwerze.

 3
Author: Matt Howell,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-02-13 21:37:52

Dodam to jako powód, aby lokalnie hostować te pliki.

Ostatnio węzeł w południowej Kalifornii na TWC nie był w stanie rozwiązać ajax.googleapis.com domeny (dla użytkowników z IPv4) tylko dlatego, że nie otrzymujemy zewnętrznych plików. Do wczoraj było to przerywane (teraz jest uporczywe.) Ponieważ był przerywany, miałem mnóstwo problemów rozwiązujących problemy użytkowników SaaS. Spędził niezliczone godziny próbując śledzić, dlaczego niektórzy użytkownicy nie mieli problemów z oprogramowanie, i inne były tankowanie. W moim zwykłym procesie debugowania nie mam zwyczaju pytać użytkownika, czy ma wyłączony IPv6.

Natknąłem się na problem, ponieważ sam używałem tej konkretnej "trasy" do pliku, a także używam tylko IPV4. Odkryłem problem z narzędziami programistów mówi mi, że jquery nie ładuje się, a następnie zacząłem robić tracerouty itp... aby znaleźć prawdziwy problem.

Po tym, najprawdopodobniej nigdy nie wrócę do plików hostowanych zewnętrznie ponieważ: google nie musi iść w dół, aby to stało się problemem, i... każdy z tych węzłów może zostać zaatakowany przez DNS hijacking i dostarczyć złośliwy plik js zamiast rzeczywistego pliku. Zawsze myślałem, że byłem bezpieczny w tym, że domena google nigdy nie upadnie, teraz wiem, że każdy węzeł między Użytkownikiem a hostem może być punktem awarii.

 3
Author: basedrop,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-06-26 19:44:49

Dodaję tylko najnowszą wersję ze strony jQuery: http://code.jquery.com/jquery-latest.pack.js odpowiada moim potrzebom i nigdy nie muszę się martwić o aktualizację.

EDIT: dla dużej aplikacji internetowej, na pewno kontrolować go; pobierz go i służyć go samodzielnie. Ale dla mojej osobistej strony, nie obchodzi mnie to mniej. Rzeczy nie znikają magicznie, zazwyczaj są najpierw przestarzałe. Nadążam za tym na tyle, aby wiedzieć, co zmienić w przyszłych wydaniach.

 2
Author: geowa4,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-02-13 20:10:59

Tutaj kilka przydatnych zasobów, nadzieja może pomóc Ci wybrać CDN. MS niedawno dodał nową domenę dla bibliotek dostarczających poprzez ich CDN.

Stary Format: http://ajax.microsoft.com/ajax/jQuery/jquery-1.5.1.js Nowy Format: http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.js

To nie powinno wysyłać wszystkich plików cookie do microsoft.com. http://www.asp.net/ajaxlibrary/cdn.ashx#Using_jQuery_from_the_CDN_11

Tutaj kilka statystyk o większości popularna technologia stosowana w sieci we wszystkich technologiach. http://trends.builtwith.com/

Nadzieja może pomóc Ci wybrać.

 2
Author: GibboK,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-03-29 11:54:56

Jeśli jestem odpowiedzialny za stronę "live", lepiej być świadomym wszystkiego, co się dzieje na I do mojej strony. Z tego powodu sam hostuję wersję jquery-min na tym samym serwerze lub na statycznym / zewnętrznym serwerze, ale tak czy inaczej w miejscu, w którym tylko ja (lub mój program/proxy) mogę zaktualizować bibliotekę po zweryfikowaniu/przetestowaniu każdej zmiany

 1
Author: ,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-02-13 21:50:59

W głowie: 

  (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);
  })();

Koniec ciała: 

<script type="text/javascript">
google.load("jquery", "version");
</script>
 1
Author: Frank,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2010-02-16 12:28:39

Hostuję go z innymi plikami js na moim własnym serwerze, i o to chodzi, łączę je i minifikuję (tutaj za pomocą django-compresser, ale nie o to chodzi), aby być serwowanym jako jeden plik js, ze wszystkim, co strona potrzebuje do niego włożyć. I tak będziesz musiał obsługiwać własne pliki js, więc nie widzę powodu, aby nie dodawać tam dodatkowych bajtów jquery - niektóre więcej kbs są znacznie tańsze do przeniesienia, niż więcej żądań do wykonania. Nie jesteś zależny od nikogo, a jak tylko twój minified js jest w pamięci podręcznej, jesteś super szybki, jak również.

Przy pierwszym załadowaniu rozwiązanie oparte na CDN może wygrać, ponieważ musisz załadować dodatkowe kilobajty jquery z własnego serwera (ale bez dodatkowego żądania). Wątpię, żeby różnica była zauważalna. A potem, przy pierwszym ładowaniu z wyczyszczoną pamięcią podręczną, Twoje własne rozwiązanie hostowane będzie prawdopodobnie zawsze znacznie szybsze, z powodu większej liczby żądań (i wyszukiwań DNS) potrzebnych do pobrania jQuery CDN.

Ciekawe jak ten punkt jest prawie nigdy wspominany, a jak CDN-y zdają się opanowywać Świat:)

 0
Author: benzkji,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-11-21 15:14:27