# uni-ui 介绍

uni-ui 是DCloud提供的一个跨端ui库，它是基于vue组件的、flex布局的、无dom的跨全端ui框架。

uni-ui 不包括内置组件，它是内置组件的补充。

# uni-ui产品特点

# 1、高性能

So far, uni-ui is the benchmark for performance in small programs and hybrid apps.

Automatic delta update data

Although uni-app supports applet custom components, all applet ui libraries can be used. However, the ui library of the custom component of the applet needs to use setData to manually update the data. When the amount of data is large, or when the data is updated frequently, it is easy to cause performance problems.

And uni-ui belongs to the vue component, and the bottom layer of the uni-app engine automatically diff updates the data. Of course, many vue components in the plugin market have this feature.

Optimize the communication loss of logic layer and view layer

Non-H5, whether it is a small program or an app, whether it is an app's webview rendering or native rendering, all are separated from the logic layer and the view layer. There is a loss of communication between the logic layer and the view layer. For example, dragging a followable component in the view layer, due to the loss of communication, it is difficult to follow the follower in real time with js monitoring.

At this time, you need to use css animation and technologies such as wxs and bindingx provided by the bottom layer of the platform. However, these technologies are relatively complex, so they are encapsulated in uni-ui, and these technologies are used at the bottom layer for ui components that need to be operated manually, such as the left sliding menu of swiperaction list items, to achieve a high-performance interactive experience.

background stop

Many ui components are always moving, such as carousels and marquees. Even if the window is blocked by the new window, it is still consuming hardware resources on the background layer. When the Android webview version is chrome66 or higher, the background operation of the UI will cause serious performance problems, causing the front-end interface to be obviously stuck.

The uni-ui component will automatically determine its own display state, and will not consume hardware resources when the component is no longer visible.

# 2、全端

The components of uni-ui are multi-terminal adaptive, and the bottom layer will smooth out the differences or bugs of many small program platforms.

For example, the navigation bar navbar component will automatically handle the status bar on different sides; For example, the swiperaction component will use the wxs technology with better interactive experience on the app and WeChat applet, but will use js to simulate similar effects on other applet terminals that do not support wxs.

uni-ui also supports nvue native rendering.

uni-ui also supports widescreen devices such as pc, which can be accessed through a PC browser [https://hellouniapp.dcloud.net.cn/pages/extUI/badge/badge](https://hellouniapp.dcloud.net.cn/ pages/extUI/badge/badge) experience

# 3、风格扩展

The default style of uni-ui is medium, which is consistent with the style of the uni-app base components. But it supports uni.scss, which can easily extend and switch the style of the application.

UI 是一种需求非常发散的产品，DCloud官方也无意用uni-ui压制第三方 UI 插件的空间，但官方有义务在性能和跨端方面提供一个开源的标杆给大家。

我们欢迎更多优秀的 UI 组件出现，也欢迎更多人贡献uni-ui的主题风格，满足更多用户的需求。