Shulou(Shulou.com)06/01 Report--

This article will explain in detail about the front-end UI framework Bootstrap, Foundation, Semantic UI, Pure and UIkit what is the difference, the editor thinks it is very practical, so share it for you to do a reference, I hope you can get something after reading this article.

1.Bootstrap

Bootstrap is the undisputed NO.1 among the currently available front-end frameworks. Given its huge popularity and growing every day, I'm sure this wonderful tool won't let you down.

Creator: Mark Otto and Jacob Thornton.

Release time: 2011

Current version: 4.0

Popularity: there are 122825 stars on GitHub

Description: "simple, intuitive and powerful front-end framework for faster and easier web development."

Core concepts / principles: RWD and Mobility first.

Frame size: 578 KB (precompiled zip folder)

Preprocessor: Sass

Response: yes

Modularization: yes

Startup template / layout: yes

Icon sets: excluding

Additional features / add-ons: there are no bundles, but there are many third-party plug-ins available.

Unique components (compared to the following front-end framework): Jumbotron,Card

Documentation: very good

Customization: provides independent file options for grid systems and restarts, easily customized using Sass; no online customizer

Browser support: the latest version of Firefox,Chrome,Safari,IE810-11-Microsoft Edge.

License: MIT

Considerations for Bootstrap

The main advantage of Bootstrap is its popularity. Technically, it is not necessarily better than other frameworks, but it provides more resources (articles and tutorials, third-party plug-ins and extensions, topic builders, etc.) than the other four front-end frameworks. In short, Bootstrap is everywhere. This is the main reason why programmers continue to choose it.

2.Foundation

Foundation is the second largest player in the top front-end framework. With a solid backing like ZURB, the framework has a really strong foundation. After all, Foundation is used on many large websites, including Facebook,Mozilla, eBay, Yahoo, as well as National Geographic.

Creator: ZURB

Release time: 2011

Current version: 6

Popularity: there are 27130 stars on GitHub

Description: "Advanced responsive front-end framework"

Core concepts / principles: RWD, mobility first, semantics

Frame size: 197.5 KB

Preprocessor: Sass

Response: yes

Modularization: yes

Startup template / layout: yes

Icon sets: base icon font

Additional features / add-ons: yes

Unique components: Icon Bar, Clearing Lightbox, Flex Video, Keystrokes, Joyride, Pricing Tables

Documentation: good, there are a lot of additional resources available.

Customization: basic GUI customizer

Browser support: Chrome,Firefox,Safari,IE9 +; iOS,Android,Windows Phone 7 +

License: MIT

Considerations for Foundation

Foundation is a truly professional front-end framework that provides business support, training and consulting services. It also provides many resources to help you learn and use the framework faster and more easily.

3.Semantic UI

Semantic UI is a framework that makes building websites more semantic. It uses the principles of natural language to make the code more readable and understandable.

Creator: Jack Lukic

Released: 2013

Current version: 2.3

Popularity: there are 40134 stars on GitHub

Description: "UI component Framework based on the beneficial principles of Natural language"

Core concepts / principles: semantics, tag ambivalence, responsiveness

Frame size: 806 KB

Preprocessor: less

Response: yes

Modularization: yes

Start template / layout: yes, some basic beginner templates are provided

Icon set: Font Awesome

Additional features / add-ons: no

Unique components: Divider, Flag, Rail, Reveal, Step, Advertisement, Card, Feed, Item, Statistic, Dimmer, Rating, Shape

Documentation: very good, providing well-organized documentation, as well as a separate website that provides getting started guides, customizing and creating themes

Customization: no GUI customizer, only manual customization

Browser support: Firefox,Chrome,Safari,IE10 + (IE9 only supports browser prefixes), Android 4 and Blackberry 10

License: MIT

Notes about Semantic UI

Semantic is a highly innovative and fully functional front-end framework. The overall structure of the framework, the naming convention with clear logic in the class, and semantic aspects also surpass other frameworks.

4.Pure

Pure is a lightweight modular framework written in pure CSS with components that can be used together or separately as needed.

Creator: Yahoo

Released: 2013

Current version: 1.0.0

Popularity: there are 18375 stars on GitHub

Description: "A set of small and flexible CSS modules that can be used in every Web project."

Core concepts / principles: SMACSS, minimalism

Frame size: 3.8 KB reduction and gzipped

Preprocessor: none

Response: yes

Modularization: yes

Startup template / layout: yes

Icon set: none; Font Awesome can be used instead

Additional features / add-ons: none

Unique components: none

Documentation: very good

Customization: basic GUI skin generator

Browser support: the latest version of Firefox,Chrome,Safari; IE7 +; iOS 6.x, 7.x; Android 4.x

License: Yahoo! Inc. BSD

Notes about Pure

Pure only provides a pure start style for your project. It is ideal for users who do not need a full-featured framework, but only specific components can be included in their work.

5.UIkit

UIkit is a concise collection of components that are easy to use and easy to customize. Although it is not as popular as the above framework, it provides the same functionality and quality.

Created by: YOOtheme

Released: 2013

Current version: 3.0.0

Popularity: there are 11954 stars on GitHub

Description: "lightweight and modular front-end framework for developing fast and powerful Web interfaces"

Core concepts / principles: RWD, move first

Frame size: 326.9 KB (compressed folder)

Preprocessor: less, Sass

Response: yes

Modularization: yes

Startup template / layout: yes

Icon set: UIkit comes with its own SVG icon system and library, which contains more and more outline icons

Additional features / add-ons: yes

Unique components: article, Flex, Cover, HTML editor

Documentation: very good

Customization: the advanced GUI customizer is only available in version 2 (previous version)

Browser support: Chrome,Firefox,Safari,IE9 +

License: MIT

Notes about UIkit

UIkit has been successfully used for many WordPress topics. It provides a flexible and powerful manual customization mechanism. Earlier versions of the framework also provided advanced GUI customization tools. )

On the "front-end UI framework Bootstrap, Foundation, Semantic UI, Pure and UIkit what is the difference" this article is shared here, I hope the above content can be of some help to you, so that you can learn more knowledge, if you think the article is good, please share it out for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.