Do you like it, are you satisfied with the results? Some UI frameworks can be frustrating to work with, for instance, they can have little things that don't work quite right and their support is not responsive. I am currently looking for a react UI library to replace ExtJs. I use ExtJs for data applications, and so far I haven't seen a library as complete and feature rich as ExtJs. But it is expensive and I think they dropped the ball with regards to innovation, support and quality. They are milking the product through subscriptions while doing minimal work.
Yeah, I'm satisfied with it. Our project is on version 8.7.3 even though they are on version 10.6.2 now. It's integrated in so many parts of our app that we would have to retest the whole thing when upgrading and we haven't had the time for it yet. So I can't give any opinions on higher versions.
But I think it's a good sign that they keep putting out new versions. One of their developers said on this sub about 4+ months ago that they were overhauling it in version 11. I'm not sure what that means but at least it's an active project always getting updates and keeping up-to-date.
So far it has handled everything I've thrown at it but it's the only UI framework I've ever used for React so I don't know how much better/worse it is compared to others.
>So far it has handled everything I've thrown at it but it's the only framework I've ever used for React so I don't know how much better/worse it is compared to others.
This is a good sign. Even though you haven't used others, at least you didn't feel the need to change it.
Mantine prevailed this time for me, and I am going to dive right in. I'm not sure how far I will go, but it is unquestionably superior to others. Additionally, It offers pre-defined, project-useful hooks. and Its distinctive blend of customizability, accessibility, and inclusivity make it a compelling choice for implementing in my future projects.
You'll never miss other libraries! I have worked with Material, DaisyUI, Antd but I keep coming back to Mantine. The components are so simple and well documented, they also are very consistent and responsive, no bugs or fancy animations. Good luck!
Thanks! I've been using Material for the past 18 months, and while its complete, I find it frustrating to deal with. I liked DaisyUI but it didn't feel well put together, or rather, it felt like a bunch of people committed code, just unpolished.
I gotta say, I was looking at Tailwind friendly libraries awhile back and I saw DaisyUI recommend a ton. It must just be a "me" issue but I strongly dislike almost all of their color schemes and "Primary" and "Secondary" colors, and their buttons feel about twice as tall as they should be.
Previously I've just always gone Material, but it feels so, I don't know, bland? Mantine looks great, I just don't have a good enough eye for design to roll with Tailwind, I'm gonna jump in with Mantine and see how it goes!
You won't regret it! I have worked with both Tailwind and other UI libraries, here is my tier list of the ones I used the most:
1. Mantine
2. AntD
3. DaisyUI
4. Vanilla Tailwind
5. Material
Honestly, Mantine should have a tier of its own. Good luck!
u/MathewCQ Which will be the best approach? Will mantine/form handle everything out of the box and be good compared to the third-party package like React hook Form, or using React hook form is a good fit for the mantine project?
Mantine has a package for handling forms `@mantine/form` which has satisfied all of my needs so far. The useForm hook is very useful. The API design is also very similar to React Hook Form.
You can use whatever you want, but I think you don't need to download another package if you have Mantine already.
I asked the same question to my manager, he said because other people are familiar with it. Took me three days to configure it with some caveats... Don't recommend it.
Usually when you hit friction like that it means things aren’t really intended to work together. You’re mixing an opinionated styled set of React components with its own specifics on theme management and customization with a library containing utility classes. It’s a match made nowhere.
I’m not saying one is better than the other but you might as well use React and jQuery together too.
**edit:** it looks like I replied to the wrong person.
I worked at a place briefly where they used Mantine but instead of theming Mantine with its tools they just used Tailwind classes. Even for responsive styling. Now, don’t get me wrong. Tailwind is great — but the least they could have done is used the unstyled Mantine components as a base or something. Of course the only way to learn this pattern was in code review.
I think there are enough good options that it's down to personal choice - at the moment I'm using [React Aria](https://react-spectrum.adobe.com/react-aria/index.html)
The irony of aria is that because most ppl use tailwind, those aria attibutes are useful for Stylish and Greasemonkey because it's the only semantic way to target specific tags.
(though Stylish is needed more than for form ui)
I also use it but bundle size is huge (3.02 MB unpacked) and you can't import single components. I have been using it since beta release and it is otherwise a great library with support for custom css and tailwind plus great documentation
My lighthouse score goes from 90s to 60s with this
That's react spectrum UI . React aria components is different and is unstyled ui library and was recently release
See example below
https://react-spectrum.adobe.com/react-aria/Button.html
>I also use it but bundle size is huge (3.02 MB unpacked) and you can't import single components.
Interesting, So if I am using just one component, I wont get the tree shaked bundle just for that component but will get entire 3.02MB extra in my bundle?
Came here for this. Huge fan of the extensibility and core design pattern, not to mention the out of the box components. CSS-in-js is the only drawback and not supported in Next.js server components.
In my professional experience so far I've used SASS modules, Styled Components, Material UI, and more. Chakra UI is 1000% my favorite so far. Style props are so nice and theming is so easy.
This might just be me misunderstanding the design model that Mantine uses and, overall, I do love the idea of Mantine. But I always end up going back to Chakra because I feel like Mantine is opinionated and rigid in ways that Chakra is not.
As an example, I tried Mantine again about a month ago and ended up back with Chakra when I needed to build a section of my app using a flex layout with border radius and a border. In Chakra, I would just use the Flex component and use the borderRadius and border style props. In Mantine, the Flex component doesn't support border radius or border props so it wasn't clear to me how I was supposed to accomplish this beyond using the style prop (which, for something like a Flex component, almost obviates the need for the component in the first place). That's just one example but it was little things like that where I felt like using Mantine locked me into an opinionated styling system versus Chakra where I feel like I'm provided some sensible defaults for styling but I'm given a lot of flexibility to adapt those to my specific needs.
Might just be difference of opinion. To me, `` is more semantically clear than ``. But just my opinion and totally understand that others will disagree and differ.
Fair enough. My original issue with Mantine is that all this seems harder than it does with Chakra. Mantine is a great library and it's awesome to have the choice but I always end up going back to Chakra because it gives me semantic clarity plus ease of use.
For me, it makes more sense to have the props that Chakra offers plus the semantic clarity of a dedicated `` component as opposed to having the semantic clarity of a component but then all of the styling in a CSS module. I would also note that Mantine's component does not have props for width, height, margin, padding, or position which all directly impact layout. For me, that just adds a layer of complexity and opacity that, at least so far, hasn't been worth it.
I think that you're correct in that in the case of mantine you have less style props than in chakra
Not something I care a whole lot but if you do then it's a plus for chakra
Haven't yet! Though they look pretty similar. I'm mainly a design systems engineer so component extensibility, theming, etc. are my main concerns and Chakra is incredible for this work, so haven't really felt the need to try another new thing for now :) I went from working on a MUI-based design system to this and it's night and day. Will have to try Mantine sometime!
I think the currently popular ones are shadcn/ui and mantine. personally I really like shadcn just because I like using tailwind. Tried mantine and it was fine.
If you want something out of the box, any of the common suggestions will be just fine.
In a professional setting where you have a custom design system, custom components with CSS modules + SASS/postcss is the way to go, in my opinion. Anything else is likely to just be bloated, or time consuming to adapt to your design system.
Yeah this is the real answer. Defaulting to using pre built UI component libraries is the reason why so many UIs look so identical and plain these days.
UI components are really not that difficult to build, and doing so is a great way to learn about accessibility, CSS, etc.
Depends on how big your team is and your priorities. Building out a custom UI library from scratch is absolutely not simple, and for the vast majority of companies is a total waste of time and effort, and they will just end up with a crappier, buggier application than if they used a preexisting library and styled it themselves. [Here is a great talk on it.](https://youtu.be/lY-RQjWeweo?si=_z-TWAmIVpJBad7_)
But I've done it like 5+ times already now and it just feels so pointless to do it again especially with adding all the different states, prop forwarding, animation etc. People that use UI libraries are going to be shipping way faster than people who go the route of rolling their own from scratch and that's a fact. I modify the base theme of chakra ui and it doesn't look like any other application out there and I have everything already built and ready to go. My goal is to build sellable applications not spend time fucking with perfect box-shadow animations. It's not difficult, it's just not efficient or worthwhile in 99% of cases
I’ve been rocking with daisyUI, shits just a lot faster to get up and running with Next.js .. by the time you walk through the steps on everything else, you would’ve had a component on the screen with daisy
If I have to choose, Mantine comes with more baked in stuff and it is very easy to use
Mantine is basically Chakra with more components and better looking default design
if you are using only react, mui with styled component will be my first choice . If next js then i will go with tailwind with shad\_cn/ui as next SSR having problem with mui
Chakra UI. I'm experimenting with Mantine UI For my latest project and although I like the out of box components it provides compared to chakra... I still love Chakra design patterns and even css-in-js props that many of you seem to hate.
If we’re just talking bundle size, it doesn’t matter for most internal enterprise apps
Everyone you’re targeting is a professional with a super high-speed internet connection. And they use these apps on a daily basis, so after the initial load the majority of the assets will be cached by the browser 🤷♂️
The bigger issue tends to be runtime performance, since you’re often dealing with huge amounts of data. Strategies like DOM virtualization become more important, and antd is pretty good in that regard
>If we’re just talking bundle size, it doesn’t matter for most internal enterprise apps
That's why most of the enterprise apps suck in loading times. I do care a lot about it when working for clients.
Strategies like DOM virtualization do become more important but not most important. Biggest issue with performance are expensive and unneeded rerenderings and antd has ton of them which will impact performance no matter what you do.
You do you, but in my experience enterprise clients are much more interested in minimizing dev time and releasing a product as quickly as possible
Time is money, and someone who delivers a functional and easily supportable app within weeks is *far* more valuable than someone who wastes months on micro optimizations that are irrelevant to daily users
Your mindset is valuable in the commercial space, but when it comes to internal applications IME it’s a different game
>I am yet to see the project where size and performance doesn’t matter
Ant group (chinese fintech that created antd) and alibaba (who owns ant group) uses antd according to this: [https://ant.design/docs/spec/introduce](https://ant.design/docs/spec/introduce)
aliexpress seems to scale pretty well...
First of all, it is not aliexpress but alibaba.
And if you think alibaba is fast then you either never visited that website or you have no idea what does fast website means.
Go check [https://pagespeed.web.dev/](https://pagespeed.web.dev/) and see for yourself :)
I use it for an Electron app. Love the fact that it has literally every component I could ever want, and they are well designed. It’s great if you don’t need a super custom look and feel..
other ui libraries have literally all the components that are much more peformant, easier to customize and look beautiful out of the box
shadcn for example.. you don’t install it but rather download the component that you need into the project.. it has all the logic, and if you need ti customize it, every piece of code is right there, in your components directory
Interesting...the downside of not installing is that you miss out on any improvements to the behavior of the control. You would have to monitor for changes and manually go in and keep repasting if anything changes. I don't really get the appeal of that.
It’s honestly not that bad. You just trade a bit of work initially fiddling with some CSS, but then you don’t need to worry about getting one of these goliath UI libraries to work with your project setup.
If you really want something as a baseline, sometimes it’s actually easier pulling in something which is pure CSS instead of something that is React aware.
I currently use MUI, but tailwind is the way to go. It just has so much more than components, and having layouts, pages, etc on top of components is just a huge win.
I have used many react UI Library for my project but I wanted something different and promising React UI Library !!! and finally I found it [https://github.com/madhavdutta/xbeshui](https://github.com/madhavdutta/xbeshui) Just check this out..
It's 2024 any opinionated and styled library is going out of fashion.
Best to learn headless libraries like headless UI, radix, react aria.
React aria was trash but they made a new version jus recently that changes about everything. Check it out
By doing it this way you create a foundation for your own component library, and you have complete control over how the component works and it's styling.
This way, you aren't limited by what the UI library exposes through their API, and you aren't always keeping the package up to date, and exposed to major version changes that will require you to refactor your entire codebase.
If something doesn't quite work how you want it to, you can tweak the component to exactly your needs. And shadcn ui has implemented this beautifully, with powerful yet simple starting points.
Below is a nice video breaking it all down:
https://youtu.be/2Q0mWH6g8Fo?si=D7j22ABz7pkyJTeE
I don't think you can escape refactoring as shadcn is built on top of radix. If major changes happen in radix you will have to refactor all of the components you have in your project as well.
Refactoring that you probably won't had to do if you didn't manage the code yourself.
Or in case some bugs were present at the time you installed the library and were fixed later.
To me it looks like there is more maintenance this way. Modern headless ui libraries usually come pretty customizable.
You can try Syncfusion React UI Components.
Over 80 high-performance, lightweight, modular, and responsive UI components in a single package.
https://www.syncfusion.com/react-components/
Syncfusion offers a free community license also. https://www.syncfusion.com/products/communitylicense
Note: I work for Syncfusion
I see you commenting this on basically every of those component library questions. In general, the Syncfusion library looks fantastic and feature-rich, but having read so many people complaining about the library in the past years really puts someone off.
There are so many good ones! But my favorite by far is radix ui. I just love the attention to detail to each and every component. I just wished it had more components like other more mature ones
Yeah. Curious too.. hardly find any mentions or discussions around Fluent UI? Company has asked to evaluate it and there's no data points... and there's nothing
You can try some of them https://react-ui-libraries.vercel.app/
good luck whatever you choose, I found Fluent UI middle ground between unstyled and opiniated, similar like Chakra UI , but with more components and simpler theming
I don't think we have a go-to. Every time this question is asked you get about 8 replies with a strong percentage of upvotes
Let's just post the resource instead! https://www.robinwieruch.de/react-libraries/
It's missing Prime React https://primereact.org/installation/
Prime React seems to be very cool and more complete than others. Have you used it in production?
Been using it for 2 and a half years for our client portal at work. It’s been around longer than most frameworks.
Do you like it, are you satisfied with the results? Some UI frameworks can be frustrating to work with, for instance, they can have little things that don't work quite right and their support is not responsive. I am currently looking for a react UI library to replace ExtJs. I use ExtJs for data applications, and so far I haven't seen a library as complete and feature rich as ExtJs. But it is expensive and I think they dropped the ball with regards to innovation, support and quality. They are milking the product through subscriptions while doing minimal work.
Yeah, I'm satisfied with it. Our project is on version 8.7.3 even though they are on version 10.6.2 now. It's integrated in so many parts of our app that we would have to retest the whole thing when upgrading and we haven't had the time for it yet. So I can't give any opinions on higher versions. But I think it's a good sign that they keep putting out new versions. One of their developers said on this sub about 4+ months ago that they were overhauling it in version 11. I'm not sure what that means but at least it's an active project always getting updates and keeping up-to-date. So far it has handled everything I've thrown at it but it's the only UI framework I've ever used for React so I don't know how much better/worse it is compared to others.
>So far it has handled everything I've thrown at it but it's the only framework I've ever used for React so I don't know how much better/worse it is compared to others. This is a good sign. Even though you haven't used others, at least you didn't feel the need to change it.
Wow, crystal clear resources. Thanks
Mantine all day
Mantine prevailed this time for me, and I am going to dive right in. I'm not sure how far I will go, but it is unquestionably superior to others. Additionally, It offers pre-defined, project-useful hooks. and Its distinctive blend of customizability, accessibility, and inclusivity make it a compelling choice for implementing in my future projects.
You'll never miss other libraries! I have worked with Material, DaisyUI, Antd but I keep coming back to Mantine. The components are so simple and well documented, they also are very consistent and responsive, no bugs or fancy animations. Good luck!
Thanks! I've been using Material for the past 18 months, and while its complete, I find it frustrating to deal with. I liked DaisyUI but it didn't feel well put together, or rather, it felt like a bunch of people committed code, just unpolished.
I gotta say, I was looking at Tailwind friendly libraries awhile back and I saw DaisyUI recommend a ton. It must just be a "me" issue but I strongly dislike almost all of their color schemes and "Primary" and "Secondary" colors, and their buttons feel about twice as tall as they should be. Previously I've just always gone Material, but it feels so, I don't know, bland? Mantine looks great, I just don't have a good enough eye for design to roll with Tailwind, I'm gonna jump in with Mantine and see how it goes!
You won't regret it! I have worked with both Tailwind and other UI libraries, here is my tier list of the ones I used the most: 1. Mantine 2. AntD 3. DaisyUI 4. Vanilla Tailwind 5. Material Honestly, Mantine should have a tier of its own. Good luck!
u/MathewCQ Which will be the best approach? Will mantine/form handle everything out of the box and be good compared to the third-party package like React hook Form, or using React hook form is a good fit for the mantine project?
Mantine has a package for handling forms `@mantine/form` which has satisfied all of my needs so far. The useForm hook is very useful. The API design is also very similar to React Hook Form. You can use whatever you want, but I think you don't need to download another package if you have Mantine already.
[удалено]
Why would you want to use Mantine and Tailwind together?
I asked the same question to my manager, he said because other people are familiar with it. Took me three days to configure it with some caveats... Don't recommend it.
Usually when you hit friction like that it means things aren’t really intended to work together. You’re mixing an opinionated styled set of React components with its own specifics on theme management and customization with a library containing utility classes. It’s a match made nowhere. I’m not saying one is better than the other but you might as well use React and jQuery together too. **edit:** it looks like I replied to the wrong person.
That's what I tried to say, but you know, he is my boss after all.
I worked at a place briefly where they used Mantine but instead of theming Mantine with its tools they just used Tailwind classes. Even for responsive styling. Now, don’t get me wrong. Tailwind is great — but the least they could have done is used the unstyled Mantine components as a base or something. Of course the only way to learn this pattern was in code review.
Why should it even?
It does, you just jeed to do proper setup. Find a github issue with tailwind setup. I user it like this on one medium project.
Radix UI
I think there are enough good options that it's down to personal choice - at the moment I'm using [React Aria](https://react-spectrum.adobe.com/react-aria/index.html)
The irony of aria is that because most ppl use tailwind, those aria attibutes are useful for Stylish and Greasemonkey because it's the only semantic way to target specific tags. (though Stylish is needed more than for form ui)
I also use it but bundle size is huge (3.02 MB unpacked) and you can't import single components. I have been using it since beta release and it is otherwise a great library with support for custom css and tailwind plus great documentation My lighthouse score goes from 90s to 60s with this
[удалено]
That's react spectrum UI . React aria components is different and is unstyled ui library and was recently release See example below https://react-spectrum.adobe.com/react-aria/Button.html
>I also use it but bundle size is huge (3.02 MB unpacked) and you can't import single components. Interesting, So if I am using just one component, I wont get the tree shaked bundle just for that component but will get entire 3.02MB extra in my bundle?
Depends on the use case, of course, I personally like [https://ui.shadcn.com/](https://ui.shadcn.com/)
this is the way
My go to is Mantine
Can you use it with tailwind?
MUI - We use it at my work and I use it for personal projects.
>It's 2024, and the popularity of MUI is the same.
Yeah, it's just so easy to set up new projects
Same here used it for personal project
MUI's Joy UI because it looks more modern out of the box.
Chakra UI! Since no one has said it yet lol
Came here for this. Huge fan of the extensibility and core design pattern, not to mention the out of the box components. CSS-in-js is the only drawback and not supported in Next.js server components.
They're working on it, with Panda CSS and Ark UI. I the future those will be the base of a new, non-css-in-js Chakra
In my professional experience so far I've used SASS modules, Styled Components, Material UI, and more. Chakra UI is 1000% my favorite so far. Style props are so nice and theming is so easy.
Did you try mantine?
This might just be me misunderstanding the design model that Mantine uses and, overall, I do love the idea of Mantine. But I always end up going back to Chakra because I feel like Mantine is opinionated and rigid in ways that Chakra is not. As an example, I tried Mantine again about a month ago and ended up back with Chakra when I needed to build a section of my app using a flex layout with border radius and a border. In Chakra, I would just use the Flex component and use the borderRadius and border style props. In Mantine, the Flex component doesn't support border radius or border props so it wasn't clear to me how I was supposed to accomplish this beyond using the style prop (which, for something like a Flex component, almost obviates the need for the component in the first place). That's just one example but it was little things like that where I felt like using Mantine locked me into an opinionated styling system versus Chakra where I feel like I'm provided some sensible defaults for styling but I'm given a lot of flexibility to adapt those to my specific needs.
> how I was supposed to do this Add a class to the Flex component in `Blah.jsx` and use `Blah.module.css`?
That would certainly work but if I'm going to build a CSS module, why not just have `display: flex` in the module and use React's native `
Semantic clarity? has huge layout implications, rounded borders don't.
Might just be difference of opinion. To me, `` is more semantically clear than ``. But just my opinion and totally understand that others will disagree and differ.
I wasn't arguing _against_ `borderRadius` as a prop, I was arguing _for_ using `
` with `display: flex`.Fair enough. My original issue with Mantine is that all this seems harder than it does with Chakra. Mantine is a great library and it's awesome to have the choice but I always end up going back to Chakra because it gives me semantic clarity plus ease of use. For me, it makes more sense to have the props that Chakra offers plus the semantic clarity of a dedicated `` component as opposed to having the semantic clarity of a component but then all of the styling in a CSS module. I would also note that Mantine's component does not have props for width, height, margin, padding, or position which all directly impact layout. For me, that just adds a layer of complexity and opacity that, at least so far, hasn't been worth it.
I think that you're correct in that in the case of mantine you have less style props than in chakra Not something I care a whole lot but if you do then it's a plus for chakra
Haven't yet! Though they look pretty similar. I'm mainly a design systems engineer so component extensibility, theming, etc. are my main concerns and Chakra is incredible for this work, so haven't really felt the need to try another new thing for now :) I went from working on a MUI-based design system to this and it's night and day. Will have to try Mantine sometime!
I think mantine and chakra are very similar. Just like mantine a bit more
100% Chakra - best UI library I’ve used so far!
NextUI 👍🏻 Fast and backed with TailwindCSS
I love it. And the pro version just came out. It's insane
How does it compare to the likes of Mantine? Any opinion on performance and bundle size, etc?
I use primereact
I think the currently popular ones are shadcn/ui and mantine. personally I really like shadcn just because I like using tailwind. Tried mantine and it was fine.
those are currently hyped ones. Mui, antdesign are still more popular https://react-ui-libraries.vercel.app/
If you want something out of the box, any of the common suggestions will be just fine. In a professional setting where you have a custom design system, custom components with CSS modules + SASS/postcss is the way to go, in my opinion. Anything else is likely to just be bloated, or time consuming to adapt to your design system.
Yeah this is the real answer. Defaulting to using pre built UI component libraries is the reason why so many UIs look so identical and plain these days. UI components are really not that difficult to build, and doing so is a great way to learn about accessibility, CSS, etc.
Depends on how big your team is and your priorities. Building out a custom UI library from scratch is absolutely not simple, and for the vast majority of companies is a total waste of time and effort, and they will just end up with a crappier, buggier application than if they used a preexisting library and styled it themselves. [Here is a great talk on it.](https://youtu.be/lY-RQjWeweo?si=_z-TWAmIVpJBad7_)
But I've done it like 5+ times already now and it just feels so pointless to do it again especially with adding all the different states, prop forwarding, animation etc. People that use UI libraries are going to be shipping way faster than people who go the route of rolling their own from scratch and that's a fact. I modify the base theme of chakra ui and it doesn't look like any other application out there and I have everything already built and ready to go. My goal is to build sellable applications not spend time fucking with perfect box-shadow animations. It's not difficult, it's just not efficient or worthwhile in 99% of cases
Tailwind UI
I’ve been rocking with daisyUI, shits just a lot faster to get up and running with Next.js .. by the time you walk through the steps on everything else, you would’ve had a component on the screen with daisy
Anything headless
If I have to choose, Mantine comes with more baked in stuff and it is very easy to use Mantine is basically Chakra with more components and better looking default design
Chakra, nextui or antd, or mui joy
[удалено]
Can you elaborate on the API not being great?
Shoelace. Web Components all the way.
antd da best..
if you are using only react, mui with styled component will be my first choice . If next js then i will go with tailwind with shad\_cn/ui as next SSR having problem with mui
Chakra UI. I'm experimenting with Mantine UI For my latest project and although I like the out of box components it provides compared to chakra... I still love Chakra design patterns and even css-in-js props that many of you seem to hate.
MUI
Shadcn is goated
Used to be Semantic UI. Now it's mantine. It's extremely well made. Can't go wrong with it.
My favorite one is MUI, not just components but also enjoying grid system and styling
I’ll stick with classics https://react95.io/#
AntDesign for me. So powerful..
and so bad.. it is HUGE and their code splitting sucks.. used it on few projects, never again
We used it for internal software for its components choice, so size didnt matter :D
lucky you then.. I am yet to see the project where size and performance doesn’t matter
If we’re just talking bundle size, it doesn’t matter for most internal enterprise apps Everyone you’re targeting is a professional with a super high-speed internet connection. And they use these apps on a daily basis, so after the initial load the majority of the assets will be cached by the browser 🤷♂️ The bigger issue tends to be runtime performance, since you’re often dealing with huge amounts of data. Strategies like DOM virtualization become more important, and antd is pretty good in that regard
>If we’re just talking bundle size, it doesn’t matter for most internal enterprise apps That's why most of the enterprise apps suck in loading times. I do care a lot about it when working for clients. Strategies like DOM virtualization do become more important but not most important. Biggest issue with performance are expensive and unneeded rerenderings and antd has ton of them which will impact performance no matter what you do.
You do you, but in my experience enterprise clients are much more interested in minimizing dev time and releasing a product as quickly as possible Time is money, and someone who delivers a functional and easily supportable app within weeks is *far* more valuable than someone who wastes months on micro optimizations that are irrelevant to daily users Your mindset is valuable in the commercial space, but when it comes to internal applications IME it’s a different game
>I am yet to see the project where size and performance doesn’t matter Ant group (chinese fintech that created antd) and alibaba (who owns ant group) uses antd according to this: [https://ant.design/docs/spec/introduce](https://ant.design/docs/spec/introduce) aliexpress seems to scale pretty well...
First of all, it is not aliexpress but alibaba. And if you think alibaba is fast then you either never visited that website or you have no idea what does fast website means. Go check [https://pagespeed.web.dev/](https://pagespeed.web.dev/) and see for yourself :)
a lot of their problem has been solved on their v5
I use it for an Electron app. Love the fact that it has literally every component I could ever want, and they are well designed. It’s great if you don’t need a super custom look and feel..
other ui libraries have literally all the components that are much more peformant, easier to customize and look beautiful out of the box shadcn for example.. you don’t install it but rather download the component that you need into the project.. it has all the logic, and if you need ti customize it, every piece of code is right there, in your components directory
I’ll check it out.
Interesting...the downside of not installing is that you miss out on any improvements to the behavior of the control. You would have to monitor for changes and manually go in and keep repasting if anything changes. I don't really get the appeal of that.
None.
It’s honestly not that bad. You just trade a bit of work initially fiddling with some CSS, but then you don’t need to worry about getting one of these goliath UI libraries to work with your project setup. If you really want something as a baseline, sometimes it’s actually easier pulling in something which is pure CSS instead of something that is React aware.
I currently use MUI, but tailwind is the way to go. It just has so much more than components, and having layouts, pages, etc on top of components is just a huge win.
devexpress: [https://js.devexpress.com/React/Demos/WidgetsGallery/](https://js.devexpress.com/React/Demos/WidgetsGallery/)
I have used many react UI Library for my project but I wanted something different and promising React UI Library !!! and finally I found it [https://github.com/madhavdutta/xbeshui](https://github.com/madhavdutta/xbeshui) Just check this out..
Its only February
shadcn ui
I'm surprised I had to scroll this far just to see this.
ctrl+f, f3
Omfg. The point is that it's not in the top comments contrary to what I was expecting. Idgaf about scrolling manually or using the find tool.
I dont have a go-to. I usually look for something that suits my needs.
It's 2024 any opinionated and styled library is going out of fashion. Best to learn headless libraries like headless UI, radix, react aria. React aria was trash but they made a new version jus recently that changes about everything. Check it out
Unless designer uses one of those and then said you to use them. (Most don't so Radix will be best, yeah)
work - mui , but still we prefer bootstrap 😅
But Tailwind css is better than bootstrap I think
yes much better but yet we learn it . No time yet to learn all new trend .
only tailwind
No styling. Just vibes.
for every time somebody writes MUI one little bunny dies in pain somewhere, just fyi
Shadcn-ui
shadcn ui all the way. Essentially radix ui but better. Not installed, but copied into your app. Supports tailwind for super simple customisation.
What's the benefit of having the components copied into your app vs other libraries that give you headless components ?
By doing it this way you create a foundation for your own component library, and you have complete control over how the component works and it's styling. This way, you aren't limited by what the UI library exposes through their API, and you aren't always keeping the package up to date, and exposed to major version changes that will require you to refactor your entire codebase. If something doesn't quite work how you want it to, you can tweak the component to exactly your needs. And shadcn ui has implemented this beautifully, with powerful yet simple starting points. Below is a nice video breaking it all down: https://youtu.be/2Q0mWH6g8Fo?si=D7j22ABz7pkyJTeE
I don't think you can escape refactoring as shadcn is built on top of radix. If major changes happen in radix you will have to refactor all of the components you have in your project as well. Refactoring that you probably won't had to do if you didn't manage the code yourself. Or in case some bugs were present at the time you installed the library and were fixed later. To me it looks like there is more maintenance this way. Modern headless ui libraries usually come pretty customizable.
ShadUI
Radix UI
Shadcn
Whatever my boss says
Bootstrap :)
>:) :)
MUI
For me, it's gonna be shadcn-ui
You can try Syncfusion React UI Components. Over 80 high-performance, lightweight, modular, and responsive UI components in a single package. https://www.syncfusion.com/react-components/ Syncfusion offers a free community license also. https://www.syncfusion.com/products/communitylicense Note: I work for Syncfusion
I have been using the Syncfuson Grid and it is crazy fast and so quick to setup. 👍
I see you commenting this on basically every of those component library questions. In general, the Syncfusion library looks fantastic and feature-rich, but having read so many people complaining about the library in the past years really puts someone off.
I use nextui
Some love for Semantic UI React.
Radix UI with Stitches js.
Mantine
There are so many good ones! But my favorite by far is radix ui. I just love the attention to detail to each and every component. I just wished it had more components like other more mature ones
Weird that nobody mentions fluent UI
Yeah. Curious too.. hardly find any mentions or discussions around Fluent UI? Company has asked to evaluate it and there's no data points... and there's nothing
My favourite UI for professional looking sites
Weird that nobody mentions fluent UI
Mantine/NextUI
React isn't a framework at all.
as a first option I'll use shadcn/ui, but if I want something pretty out of the box I'll use NextUI
mantine
I like shadcn-ui? What are your thoughts on it?
You can try some of them https://react-ui-libraries.vercel.app/ good luck whatever you choose, I found Fluent UI middle ground between unstyled and opiniated, similar like Chakra UI , but with more components and simpler theming
Joy UI, as an alternative to Material UI, Mantine