DEV Community

Cover image for Fre: another concurrent UI library
Yisar
Yisar

Posted on • Edited on

Fre: another concurrent UI library

Hello everyone, my name is yisar, a front-end enginer in China.

This is my first visit to media, and I want to share my framework with you.

React is very popular, especially after react 16. The most amazing thing is concurrent mode, which is not available in other frameworks.

Fre is the second framework to implement concurrent mode in addition to react. This implementation is different from the other vdom reconciliation algorithm. Its rendering is asynchronous, and many use cases are built on the premise of asynchronous rendering.

Fre is similar to react in many ways, such as fiber architecture using linked list, hooks API and functional component…

But at the same time, they are different. Fre has a better reconciliation algorithm. The most important thing is that fre only has 400 lines of code, the bundle size is just 1KB!

Alt Text

In most use cases, the performance of fre is close to that of vue3 and better than that of react.

At the same time, 1KB of code means that you can better understand the source code of fre, and even learn react with the help from fre.

It is worth mentioning that preact is as small as fre, but preact is completely synchronous. It does not support concurrent mode and keeps the opposite roadmap with react.

If you are looking for an alternative framework of 1KB react, fre is more suitable for you.

Alt Text

If you’re interested in concurrent mode, take a look at fre and you’ll get a ruby.

https://github.com/yisar/fre

I really need partners, because fre has a lot to improve, let’s build together.

Top comments (6)

Collapse
 
alexandrudanpop profile image
Alexandru-Dan Pop

Really like how the hooks API is implemented in 70 LOC & DOM updates in 45 LOC.
Very nice!

Collapse
 
132 profile image
Yisar

Yes, only hooks API can achieve such a small implementation, this is a great invention

Collapse
 
132 profile image
Yisar

Thank you, looking forward to your feedback!

Collapse
 
zhongmeizhi profile image
Mokou

how niubi wa。my jiji

Collapse
 
dennisfrijlink profile image
Dennis Frijlink

Nice! I love lightweight libraries/frameworks. One question. Does Fre uses a Virtual DOM?

Collapse
 
132 profile image
Yisar

Yes, fre had. we use vdom for generating linked list called fiber.
What we traverse is a linked list, of course vdom is also very important, fre also has an efficient diff algorithm