GoogleのCDNからjQuery UI CSSをダウンロードする

452

Googleを使用して、UIとコアの両方のjQuery libをダウンロードすることを計画しています。私の質問は、CSSをダウンロードできるようにするのですか、それとも自分でホストする必要があるのですか？

また、Googleを使用して他のプラグインをロードするにはどうすればよいですか？すべてのプラグインを一緒に圧縮できますか、それとも独自の個別のファイルにする必要がありますか？

jquery  css  jquery-ui  cdn  google-ajax-libraries 
— クール
ソース

回答:

574

jQuery UI（現在v1.10.3）を含むGoogle AJAX Libraries APIには、jQuery UIブログにある人気のテーマも含まれています。

Google Ajax Libraries API（CDN）

— クレタス
ソース
2
これらのCSSスクリプトは現在圧縮/最小化されていないことに注意してください。つまり、独自のドメインからサイズの小さいバージョン（GoogleのFirefoxのPageSpeedプラグインによると約26％）を提供できるため、接続が適切であれば、ユーザーにとって高速になる可能性があります。また、ローカルにキャッシュされたファイルはまだありません。
— Drew Noakes、2011年
120
このCDNを検索するたびに、「jquery ui css google cdn」と入力します。この投稿は、それらすべてを一覧表示する最も直接的な方法です。+ 1に感謝したいのですが
— mazlix
1
@Drew：または、彼もReducisaurusを使うかもしれません。:)
— Alix Axel
1
@Alix、リンクありがとうございます。便利なサービスのようです。
— Drew Noakes、2011
1
URLからマイナーバージョン番号を切り取って、常に最新のCSS / JSを自動的に取得することもできます。メジャーバージョン番号はそのままにしておきます。例：ajax.googleapis.com/ajax/libs/jqueryui/1/themes/ui-lightness/...
— miCRoSCoPiC_eaRthLinG
61

jQueryにCDNアクセスが追加されました。

code.jquery.com/ui/ [バージョン] / themes / [テーマ名] /jquery-ui.css

そして、これをもう少し簡単にするために、ここに行きます：

— ダスティン・ウッダード
ソース
4
現在、httpsをサポートしています（少なくともこの投稿の時点以降）
— Ivan Akcheurov 14年
このCDNに関連付けられたイメージをどのように使用できますか。Locaalyが見つからないため、ダウンロードしたくありません。CDNに保存されているものを使用する方法はありますか？
— Baptiste Pernet、2015
@BaptistePernet：CDNは関連するすべての画像も提供します。urlステートメントはすべてcssファイルの場所に関連しているため、クライアントはCDNから画像を自動的に取得します
— MestreLion
29

Googleはこのリンクhttps://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery.ui.all.cssでjQueryUI cssをホストしています

このコードを直接見ると、遅くなる可能性のある @import を使用してCSSをインポートしています。パフォーマンスをわずかに向上させるために、インポートをその部分に分解することができます。

https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery.ui.base.css https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base /jquery.ui.theme.css

— コミュニティ
ソース
5

そう思います。何故なの？スクリプトファイルをサポートするためのCSSを提供しないCDNの多くはないでしょう

このリンクは、次のことを示唆しています。

jQuery UI CSSテーマがGoogleのAjax Libraries CDNでホストされるようになったことは特に刺激的です。

— スコットエバーデン
ソース
私はグーグルロードステートメントを使用してそれをロードして追加しようとしました... CSSをロードしませんでした...それをチェックしました。
— クール2009年
6
ここでの仕事に思える例のURLです：ajax.googleapis.com/ajax/libs/jqueryui/1.7/themes/smoothness/...
— スコットEvernden
5

jQuery UI cssを意味する場合は、これを使用できます。

<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
— Samueldple
ソース
5

オバマ氏が言うように「はい、できます」。ここにリンクがあります。developers.google.com/#jquery

使用する必要があります

グーグル

ajax.googleapis.com/ajax/libs/jqueryui/[VERSION NO]/jquery-ui.min.js
ajax.googleapis.com/ajax/libs/jqueryui/[VERSION NO]/themes/[THEME NAME]/jquery-ui.min.css

jQuery CDN

code.jquery.com/ui/[VERSION NO]/jquery-ui.min.js
code.jquery.com/ui/[VERSION NO]/themes/[THEME NAME]/jquery-ui.min.css

マイクロソフト

ajax.aspnetcdn.com/ajax/jquery.ui/[VERSION NO]/jquery-ui.min.js
ajax.aspnetcdn.com/ajax/jquery.ui/[VERSION NO]/themes/[THEME NAME]/jquery-ui.min.css

ここでテーマ名を見つけるhttp://jqueryui.com/themeroller/ギャラリーサブタブ

。

しかし、私は以下の理由でcdnからホスティングすることをお勧めしません

  1. Google CDNの場合、ヒット率の可能性は他と比較して良好ですが、それでもかなり低いです（googleだけでなく、あらゆるcdn）。
  2. cdnを介してロードすると、jQuery.js、jQueryUI.js、コードの3つのリクエストがあります。ローカルで圧縮して、単一のリソースとしてロードすることもできます。

http://zoompf.com/blog/2010/01/should-you-use-javascript-library-cdns

— aWebDeveloper
ソース
リンクした記事は2010年のものです。彼が言及したデータのほとんどは古くなっています。より良いヒット率は、より多くのウェブサイトは2010年のバックよりも今GoogleのCDNを使用している、今がある
— トレーダー
更新された統計は次のとおりです：blog.cloudharmony.com/2015/02/…ほとんどのWebサイトは現在CDNを使用しているようです。詳細データ：w3techs.com/technologies/details/cd-jquerycdn/all/all
— Trader
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.