web-dev-qa-db-ja.com

Twitter Bootstrap vs jQuery UI？

基本的なページの機能強化のためにjQuery UIを使用しています。ボタンと入力のスタイリングとモーダルダイアログボックス。今、私はBootstrapに出くわしました。

JQuery UIの使用からBootstrapに移行した経験はありますか？これは私が考えていることですが、これを行う前に、私が直面する可能性のある問題を認識したいと思います。

javascriptjqueryjquery-uitwitter-bootstrap
214
Jessica

私はいくつかのプロジェクトに参加しています。

私の意見の最大の違い

  • jQuery UI はフォールバックセーフであり、古いブラウザでも正常に動作し、見た目もきれいです。ここで Bootstrap は、基本的には新しいブラウザでGREATを意味するCSS3に基づいています。

  • 更新頻度：ブートストラップは素晴らしい新機能を備えた大きな大きな更新を取得していますが、残念ながら以前のコードを壊す可能性があるため、ブートストラップをインストールして新しいメジャーリリースがあるときに更新することはできません。基本的に多くの新しいコーディングが必要です

  • jQuery UIはJavaScriptからの変換を備えた適切なhtml構造に基づいていますが、Bootstrapは視覚的でカスタマイズ可能なインライン構造に基づいています。 （JQUERY UIでウィジェットを呼び出し、Bootstrapで定義します）

それで、何を選ぶべきですか？

それは常にあなたが取り組んでいるプロジェクトの種類に依存します。クールで見栄えの良いウィジェットですか、それともユーザーは古いブラウザーをよく使用していますか？

私は常に両方を使用することになりますので、両方の長所を使用できます。

使用することにした場合の両方のフレームワークへのリンクはここにあります。

  1. jQuery UI
  2. ブートストラップ
133
Marco Johannesen

両方を使用したTwitterのBootstrapは、優れたテクノロジーセットです。ここにいくつかの違いがあります、

  • ウィジェット：ここでjQuery UIが勝ちます。それが提供する日付ウィジェットは非常に便利であり、Twitter Bootstrapはそのようなものを何も提供しません。
  • スキャフォールディング：ここでブートストラップが勝ちます。 Twitterのグリッドは流動的でも固定的でも一流です。 jQuery UIは、ページレイアウトをエンドユーザーに任せるというこの方向性さえ提供していません。
  • 独創的なプロフェッショナリズム：CSS3を使用したブートストラップは先を行くものであり、jQuery UIは比較すると時代遅れに見えます。
  • Icons：これに結び付けます。 Bootstrapのアイコンの見栄えは良いjQuery UI よりも、1ビットという用語が気に入らない、Glyphicons Halflingsは通常無料で利用できないため、しかし、BootstrapとGlyphiconsの作成者との間の取り決めにより、開発者としてあなたに無料でこれを可能にしました。ありがとう、実用的なときはいつでもグリフィコンに戻るオプションのリンクを含めるようお願いします。
  • 画像とサムネイル： Bootstrapに行く 、jQuery UIはここでも役に立ちません。

その他の注意事項、

  • これら2つのテクノロジーがどのように球体で競合するかを理解することは重要です。多くの重複部分がありますが、単純な足場と固定/流体の作成が必要な場合、Bootstrapは別のテクノロジーではありません。これは最高のテクノロジーです。単一のウィジェットが必要な場合、jQuery UIはおそらくトップ3にさえ入っていません。現在、jQuery UIは主に、統一されたフレームワークを使用したクライアント側のウィジェット作成の一貫性と概念実証のための単なるおもちゃです。
73
Evan Carroll

どちらも比較的少ない問題で使用できます。 Twitter Bootstrapは（この記事の執筆時点で）jQuery 1.7.1を使用しており、追加のJquery UIコンポーネントをHTMLテンプレートに統合できない理由は考えられません。

私は、Initializr.comで構築されたHTML5 BoilerplateとTwitter Bootstrapの組み合わせを使用しています。これは、2つの素晴らしいスターターテンプレートを1つの素晴らしいスタータープロジェクトに結合します。 http://html5boilerplate.com/ および http://www.initializr.com/ で詳細を確認してください。または、すぐに開始するには、 http://www.initializr.com/ 、「Bootstrap 2」ボタンをクリックして、「Download It」をクリックします。これにより、開始に必要なすべてのjsとcssが得られます。

また、HTML5とCSS3に怖がらないでください。 InitializrおよびHTML5 Boilerplateには、ポリフィルとIE固有のコードが含まれており、すべての機能をIE 6、7 8、および9で動作させることができます。

Twitter BootstrapでのLESSの使用もオプションです。 LESSを使用してBootstrapで使用されるすべてのCSSをコンパイルしますが、独自のスタイルをオーバーライドまたは追加するだけの場合は、その目的のために空のcssファイルを提供します。

カスタムコードを追加するための空のjsファイル（script.js）もあります。これは、追加のjQueryUIコンポーネントのハンドラーまたはセレクターを追加する場所です。

33
eterps

両方を使用しましたが、Bootstrapのシンプルさと、開発と拡張のペースが気に入っています。 jQuery UIの問題は、カタツムリのペースで動いていることです。計画/開発段階にあるメニューバー、ツリーコントロール、DataGridなどの一般的な機能を展開するのに何年もかかります。私たちは待って、待って待って、最終的にあきらめて、製品のためにExtJSのような他のライブラリを使用しました http://dblite.com 。

Bootstrapは非常に短い期間で非常に包括的な機能セットを提供しており、jQuery UIをすぐに上回ると確信しています。

だから私は最終的に時代遅れになる何かを使用しても意味がありません...

27
Rajiv