web-dev-qa-db-fra.com

Twitter Bootstrap vs interface utilisateur jQuery?

J'utilise jQuery UI pour certaines améliorations de base de la page. Boutons et styles de saisie et boîtes de dialogue modales. Maintenant, je suis tombé sur Bootstrap et ça a l'air plutôt bien.

Quelqu'un a-t-il déjà essayé d'utiliser jQuery UI pour Bootstrap? C'est ce que je pense faire, mais avant cela, j'aimerais savoir quels problèmes je pourrais rencontrer.

214
Jessica

J'ai plusieurs projets.

La plus grande différence à mon avis

  • jQuery UI est sûr, il fonctionne correctement et a fière allure dans les anciens navigateurs, où Bootstrap est basé sur CSS3, ce qui signifie essentiellement SUPER dans les nouveaux navigateurs, pas si génial dans les anciens

  • Fréquence de mise à jour: Bootstrap obtient de très grandes mises à jour avec de nouvelles fonctionnalités impressionnantes, mais malheureusement, elles risquent de casser le code précédent. Vous ne pouvez donc pas simplement installer bootstrap et mettre à jour en cas de nouvelle version majeure, elle nécessite essentiellement beaucoup de nouveau codage

  • jQuery UI est basée sur une bonne structure html avec des transformations à partir de JavaScript, tandis que Bootstrap est basé sur une structure intégrée visuellement et personnalisable. (appelant un widget dans l'interface utilisateur JQUERY, le définissant dans Bootstrap)

Alors quoi choisir?

Cela dépend toujours du type de projet sur lequel vous travaillez. Les widgets sympas et rapides sont-ils meilleurs ou vos utilisateurs utilisent-ils souvent les anciens navigateurs?

Je finis toujours par utiliser les deux afin de pouvoir utiliser le meilleur des deux mondes.

Voici les liens vers les deux cadres, si vous décidez de les utiliser.

  1. jQuery UI
  2. Bootstrap
133
Marco Johannesen

Ayant utilisé les deux, le Bootstrap de Twitter est un ensemble technologique supérieur. Voici quelques différences

  • Widgets : l'interface utilisateur jQuery gagne ici. Le widget de date qu'il fournit est extrêmement utile, et Twitter Bootstrap _ ne fournit rien de tel.
  • Échafaudage : Bootstrap gagne ici. La grille de Twitter, à la fois fluide et fixe, est au top. jQuery UI ne fournit même pas cette direction, ce qui laisse la mise en page à l'utilisateur final.
  • Un professionnalisme hors du commun : Bootstrap utiliser CSS3 est à une lieue d'avance, l'interface utilisateur de jQuery semble datée par comparaison.
  • Icônes : Je vais aller à égalité avec celui-ci. Bootstrap a de meilleures icônes, imho que jQuery UI , mais je n'aime pas les termes un bit, Les glyphicons Les halflings ne sont normalement pas disponibles gratuitement, mais un arrangement entre Bootstrap et les créateurs de Glyphicons a rendu cela possible sans frais pour vous en tant que développeurs. En guise de remerciement, nous vous demandons d'inclure un lien optionnel vers les glyphiques à chaque fois que cela est possible.
  • Images et miniatures : va à Bootstrap , l'interface utilisateur de jQuery n'aide même pas ici.

Autres notes,

  • Il est important de comprendre comment ces deux technologies se font concurrence dans les domaines également. Il y a beaucoup de chevauchement, mais si vous voulez un échafaudage simple et une création fixe/fluide, Bootstrap n'est pas une autre technologie, c'est la meilleure des technologies. Si vous voulez un seul widget, jQuery UI ne figure probablement pas parmi les trois premiers. À l’heure actuelle, jQuery UI n’est qu’un jouet de cohérence et de preuve de concept pour la création de widgets côté client à l’aide d’un cadre unifié.
73
Evan Carroll

Vous pouvez utiliser les deux avec relativement peu de problèmes. Twitter Bootstrap utilise jQuery 1.7.1 (à ce jour), et je ne vois aucune raison pour laquelle vous ne pouvez pas intégrer de composants d'interface utilisateur Jquery supplémentaires dans vos modèles HTML.

J'utilise une combinaison de HTML5 Boilerplate et Twitter Bootstrap construite sur Initializr.com. Cela combine deux modèles de départ impressionnants dans un grand projet de démarrage. Consultez les détails sur http://html5boilerplate.com/ et http://www.initializr.com/ ou pour commencer tout de suite, allez sur http://www.initializr.com/ , cliquez sur le bouton "Bootstrap 2", puis sur "Téléchargez-le". Cela vous donnera tous les fichiers js et css dont vous avez besoin pour commencer.

Et ne soyez pas effrayé par HTML5 et CSS3. Initializr et HTML5 Boilerplate incluent des polyfill et un code spécifique à IE qui permettra à toutes les fonctionnalités de fonctionner dans IE 6, 7 8 et 9.

L'utilisation de LESS dans Twitter Bootstrap est également facultative. Ils utilisent LESS pour compiler tout le CSS utilisé par Bootstrap, mais si vous souhaitez simplement remplacer ou ajouter vos propres styles, ils fournissent un fichier css vide à cet effet.

Il existe également un fichier js vierge (script.js) pour vous permettre d'ajouter du code personnalisé. C'est là que vous ajouteriez vos gestionnaires ou sélecteurs pour des composants jQueryUI supplémentaires.

33
eterps

Nous avons utilisé les deux et nous aimons Bootstrap pour sa simplicité et le rythme auquel il est développé et amélioré. Le problème avec jQuery UI est qu’il avance à pas de tortue. Il faut des années pour déployer des fonctionnalités communes telles que Menubar, Tree control et DataGrid, qui sont à l’étape de la planification/développement. Nous avons attendu, attendu, attendu et finalement abandonné et utilisé d’autres bibliothèques comme ExtJS pour notre produit http://dblite.com .

Bootstrap a mis au point un ensemble assez complet de fonctionnalités en très peu de temps et je suis persuadé qu'il dépassera bientôt l'interface utilisateur de jQuery.

Je ne vois donc aucun intérêt à utiliser quelque chose qui finira par devenir obsolète ...

27
Rajiv