Twitter Bootstrap vs jQuery UI? [fechadas]

214

Estou usando a interface do usuário do jQuery para obter alguns aprimoramentos básicos da página. Estilo de botão e entrada e caixas de diálogo modais. Agora me deparei com o Bootstrap e parece muito bom.

Alguém tem alguma experiência em usar o jQuery UI para o Bootstrap? É isso que estou pensando em fazer, mas antes de fazer isso, gostaria de estar ciente dos problemas que poderia enfrentar.

Jessica
fonte
4
Uma solução possível que pode não estar disponível quando isso foi solicitado ... Addy Osmani e sua equipe estão trabalhando na fusão dos dois - se você está preso entre eles, confira e talvez possa conseguir tudo o que deseja! # addyosmani.github.io/jquery-ui-bootstrap
streetlight
1
Como atualizar as respostas (2014!)? Alguém pode começar uma recompensa aqui?
27414 Peter Krauss
No site do Bootstrap - "O Bootstrap suporta apenas uma janela modal por vez. Modais aninhados não são suportados, pois acreditamos que sejam experiências ruins do usuário". -- Minha nossa.
George Beier

Respostas:

133

Eu tenho em vários projetos.

A maior diferença na minha opinião

  • A interface do usuário do jQuery é segura para fallback, funciona corretamente e fica bem em navegadores antigos, onde o Bootstrap é baseado no CSS3, que basicamente significa GRANDE em novos navegadores, não tão bom nos antigos

  • Frequência de atualização: O Bootstrap está recebendo ótimas atualizações com novos recursos impressionantes, mas, infelizmente, eles podem quebrar o código anterior; portanto, você não pode simplesmente instalar o bootstrap e atualizar quando houver uma nova versão principal; basicamente, requer muita codificação.

  • A interface do usuário do jQuery é baseada na boa estrutura html com transformações do JavaScript, enquanto o Bootstrap é baseado na estrutura embutida visual e personalizável. (chamando um widget na JQUERY UI, definindo-o no Bootstrap)

Então o que escolher?

Isso sempre depende do tipo de projeto em que você está trabalhando. Os widgets interessantes e de aparência rápida são melhores ou seus usuários costumam usar navegadores antigos?

Eu sempre acabo usando os dois, para poder usar o melhor dos dois mundos.

Aqui estão os links para ambas as estruturas, se você decidir usá-las.

  1. UI do jQuery
  2. Bootstrap
Marco Johannesen
fonte
2
-Obrigado por reservar um tempo para responder. Minhas necessidades são para algo que funcione no IE9 ou em outros navegadores da versão posterior que tenham um bom suporte ao CSS3. O Bootstrap está começando a parecer bom para mim. Uma questão. Estou usando o ASP.MVC. Notei algo sobre precisar de menos. O Boostrap funcionará bem com a plataforma Microsoft ASP MVC? Onde "menos" se encaixa?
Jessica
Você pode compilar menos arquivos em arquivos .css. A criação da auto-inicialização (usando make) criará arquivos CSS prontos para uso. Dessa forma, você não precisa usar menos.
Mikaelb
3
MENOS é uma estrutura de CSS. Não é de forma alguma necessário para usar o Boostrap (eles têm uma versão CSS / JS regular), mas com o LESS você pode facilmente fazer variáveis ​​no CSS (alterar cores etc.), torná-lo dependente, ter funções. Veja aqui: lesscss.org e há uma versão beta para um compilador em .NET ver: dotlesscss.org
Marco Johannesen
20
Como você usa o "melhor dos dois mundos"? O mais próximo que eu comecei é usando jQueryUI Bootstrap (basicamente um tema jQueryUI), mas ainda é projetado para Bootstrap 1.4, não 2.0, e há confrontos ao tentar usar JS para botões, etc.
Adam Lynch
3
@ PhoenixX_2 vou tentar! Exemplo: no bootstrap, você escreve todas as classes no elemento button (ou seja button button-primary button-small, onde no jQueryUI você atribui um elemento a um botão, basta adicionar "btn" e, em JS, você o torna um botão $(".btn").button(). Isso significa que no Bootstrap você defina-o em HTML e no jQueryUI você o define em JS. Negativos no Bootstrap é que você precisa editar seu HTML se atualizar / alterar alguma coisa (por exemplo, versões do Bootstrap) em que o jQueryUI você só precisa alterar seu JS, o que geralmente é mais fácil. há pontos positivos e negativos com ambos :)!
Marco Johannesen
73

Tendo usado os dois, o Bootstrap do Twitter é um conjunto de tecnologia superior. Aqui estão algumas diferenças,

  • Widgets : a interface do usuário do jQuery vence aqui. O widget de data que ele fornece é imensamente útil, e o Twitter Bootstrap não fornece nada disso.
  • Andaimes : o Bootstrap vence aqui. A grade do Twitter, fluida e fixa, é de primeira qualidade. A interface do usuário do jQuery nem fornece essa direção, deixando o layout da página para o usuário final.
  • Profissionalismo imediato: o Bootstrap usando CSS3 está à frente, a interface do jQuery parece datada por comparação.
  • Ícones : Eu vou amarrar este. O Bootstrap tem ícones mais agradáveis ​​do que a interface do usuário do jQuery , mas eu não gosto dos termos nem um pouco, Glyphicons Halflings normalmente não estão disponíveis gratuitamente, mas um acordo entre os criadores do Bootstrap e dos Glyphicons tornou isso possível sem nenhum custo para você como desenvolvedores. Como agradecimento, solicitamos que você inclua um link opcional para o Glyphicons sempre que possível.
  • Imagens e miniaturas : acessa o Bootstrap , a interface do usuário do jQuery nem ajuda aqui.

Outras notas,

  • É importante entender como essas duas tecnologias também competem nas esferas. Há muita sobreposição, mas se você deseja andaimes simples e criação fixa / fluida, o Bootstrap não é outra tecnologia, é a melhor tecnologia. Se você deseja um único widget, a interface do usuário do jQuery provavelmente não está entre os três primeiros. Hoje, a interface do usuário do jQuery é principalmente apenas um brinquedo para consistência e prova de conceito para a criação de um widget do lado do cliente usando uma estrutura unificada.
Evan Carroll
fonte
34

Você pode usar os dois com relativamente poucos problemas. O Twitter Bootstrap usa o jQuery 1.7.1 (até o momento em que este artigo foi escrito), e não consigo pensar em nenhum motivo para não integrar componentes adicionais da interface do usuário do Jquery em seus modelos HTML.

Eu tenho usado uma combinação de HTML5 Boilerplate e Twitter Bootstrap construído em Initializr.com. Isso combina dois modelos iniciais incríveis em um ótimo projeto inicial. Confira os detalhes em http://html5boilerplate.com/ e http://www.initializr.com/ Ou, para começar imediatamente, acesse http://www.initializr.com/ , clique no botão "Bootstrap 2" botão e clique em "Download It". Isso fornecerá todos os js e css necessários para começar.

E não se assuste com HTML5 e CSS3. O Initializr e o HTML5 Boilerplate incluem polyfills e código específico do IE que permitirá que todos os recursos funcionem no IE 6, 7 8 e 9.

O uso de LESS no Twitter Bootstrap também é opcional. Eles usam LESS para compilar todo o CSS usado pelo Bootstrap, mas se você deseja substituir ou adicionar seus próprios estilos, eles fornecem um arquivo css vazio para esse fim.

Há também um arquivo js em branco (script.js) para você adicionar código personalizado. É aqui que você adiciona seus manipuladores ou seletores para componentes adicionais do jQueryUI.

eterps
fonte
Ótima resposta. Pergunta rápida, difícil, o que o jquery ui realmente oferece do que não está incluído no bootstrap do twitter e em seus plugins?
MindWire
5
Desculpe, só vi isso. Quanto aos widgets js, a interface do usuário do jQuery possui um seletor de data e um controle deslizante, que não estão incluídos no Bootstrap. Além disso, o jqUI inclui interações e efeitos, como arrastar e soltar, mostrar / ocultar animações, alternância de classes e vários outros. Combinar as interações do jqUI com os componentes de layout do Bootstrap pode ser uma combinação muito poderosa.
eterps
6
Uma questão a observar; ambos os projetos definem o $ .fn.button de maneiras incompatíveis.
Levi
27

Usamos os dois e gostamos do Bootstrap por sua simplicidade e pelo ritmo em que está sendo desenvolvido e aprimorado. O problema com a interface do usuário do jQuery é que ele está se movendo no ritmo de um caracol. Está demorando anos para lançar recursos comuns como Menubar, controle de árvore e DataGrid, que estão em estágio de planejamento / desenvolvimento para sempre. Esperamos, esperamos, finalmente desistimos e usamos outras bibliotecas como ExtJS para o nosso produto http://dblite.com .

O Bootstrap apresentou um conjunto bastante abrangente de recursos em um período muito curto de tempo e tenho certeza que ultrapassará a interface do usuário do jQuery em breve.

Portanto, não vejo sentido em usar algo que acabará desatualizado ...

Rajiv
fonte
43
Tudo acabará desatualizado. Não faz sentido fazer nada.
tilgovi 24/07
6
É verdade que só precisamos escolher aquele que achamos que manterá seu terreno por mais tempo.
Rajiv
8
Não, você só precisa escolher o que trará o dinheiro de seus clientes. Uma vez que você o faça funcionar, ele continuará funcionando por um tempo, mesmo se ficar fora de moda; portanto, a única preocupação real é o dinheiro.
Adam