Bootstrap 与 Material UI
您应该更喜欢 Bootstrap 还是 Material UI 来进行 Web 开发？对于前端开发人员，尤其是那些刚刚开始研究前端框架的开发人员来说，这是一个长期存在的问题。关于这两者有很多争论和争论，但没有人给出明确的答案。因此，我们将尝试明确区分您应该使用哪一个。
引导程序 是一个强大的、免费的、开源的 CSS 框架，由 Twitter 创建，作为其内部框架，通过实现用于构建响应式网站和 Web 应用程序的预定义类，使开发人员的生活更轻松。自 Twitter 于 2011 年将其开源以来，Bootstrap 是拥有大型社区的最流行和最常用的 CSS 框架。许多大公司，如 Airbnb、Apple Music、Dropbox、Coursera 等。
Material UI是 2017 年的，主要工作在 Facebook 的 React 框架和 Google 的 Material Design 指南上。它提供了一个令人筋疲力尽的框架，用于创建具有高交互性和移动优先 UI 和响应式设计的网站和应用程序。 Material Design 和 Material UI 紧密相连，Material UI 只是一个没有 Material Design 的组件库。谷歌在其所有产品中都使用了 Material Design，而新近流行的 Material UI 目前被 NASA、Unity、亚马逊、摩根大通使用，并且该列表在未来几年将会增加。
Bootstrap | Material UI |
|---|---|
It is an HTML, CSS & JS framework to make responsive websites that are mobile-friendly and easy to create. | Material UI is a highly interactive & customizable framework based on React UI and Material Design. |
Developed by Twitter, initially named Twitter Blueprint. | Developed by a small team of passionate developers by referring to Google’s material design. |
Currently, an open-source project maintained by Mark Otto, Jacob Thornton, and a small group of core developers, as well as a large community of contributors | Maintained by founding team and group of core contributors as well as the material community. |
High speed of development because of reusable code | Speed of development is lesser than compared to bootstrap but can be increased by extensive use of reusable components and templates. |
12-column grid system for responsive design | 12-column grid system, same as bootstrap |
Bootstrap’s information layout provides a clear and consistent UI for all platforms. | Also, it a mobile-first and supports all platforms, but excess use of customizations, transitions, and animations might affect accessibility on some platforms. |
Unnecessary JS, jQuery scripts, and large class definitions might make that application heavy if appropriate optimizations & refactoring are not performed. | It works on React JS components which can be independent of each other. It doesn’t require any library to work & thus we can only use what we need. |
Bootstrap is very consistent and provides a simple, clear interface that, is easy to learn. And comparatively less customizable than Material UI. | Material UI is highly customizable with which designers can create tons of designs. But it may produce inconsistency among components. |
我们可以同时使用它们吗？
是否可以两者兼得？享受时尚的响应式设计，而无需花费太多时间为各种平台调整应用程序？
是的，材料设计通过 Bootstrap（也称为 mdbootstrap）使这成为可能。它是一组基于 Bootstrap 构建的库，并遵循其他知名框架和内容设计指南，例如 Vue、Angular、React。让 Combo 开发者可以使用大家都熟悉的 Bootstrap 语法，这样开发的时候问题会更少。您可以在此处了解 mdbootstrap 。
您应该为下一个开发项目选择哪个？
可以想象，这个问题的答案仅取决于您正在从事的项目以及您正在努力实现的目标。如果您的目标是在更短的时间内创建一个简单但专业且响应迅速的网站，那么 Bootstrap 应该是您的设计工具。
如果你想要一点精致，结合创造性和自然的设计，以及鲜艳的色彩、视觉道具和微妙的动画，那么考虑材料设计。