search

tleunen / react-mdl

React Components for Material Design Lite
https://tleunen.github.io/react-mdl/
MIT License
1.76k stars 255 forks source link

Question: react-mdl vs material-ui #428

Open erlgry opened 7 years ago

erlgry commented 7 years ago

Hey everyone

I am planning to start a new project and am debating between the react-mdl and material-ui. I am not however sure which way to go. It appears that this react-mdl is leveraging the google's material-design-lite project, which sounds great. OTOH material-ui appears to be built independently.

My front-end skills are not the greatest and I am worried about spending hours upon hours tweaking the CSS files and layout issues. Also I care about extensibility e.g. it should be possible for me to add a logo to the App Bar.

I appreciate any thoughts and guidance on this topic.

Vivek

Cleanshooter commented 7 years ago

I've been playing with both a lot recently and so far I'm leaning toward react-mdl myself. Right now Material-UI has a lot of components that are really great and are super easy to work with. But in the current version of the package Material-UI has no support for layouts which this one does. So it's basically up to you on which one you choose. Material-UI doesn't really provide you with any CSS to tweak (that I could find) as most of the design is put into React components directly (from what I can tell)

fgarcia commented 7 years ago

There are so many trade offs that it is impossible giving a generic answer

if you do not want to spend time tweaking CSS and just use a framework then use Material UI

if however you want to get better at Web Development (outside just React-frontend-JS styling development), and expect to cherry pick components from around the web and tweak them into a global custom theme (you will need CSS skills) then react-mdl is the clear way to go

Here you are two screenshots of the code generated for a button (MDL vs Material-UI) and decide which one you want to customize.

The Material UI way:

button - material ui

The React MDL way:

button - mdl

tszekely-spotcap commented 7 years ago

Material UI looks great until you actually try to use it. Then the "awesome" inline styles kick you in the groin, and the bugs + the people maintaining it not caring about issues kick you in the Coccyx. After wallowing in horrible JS/React code pain, you realize you'll never have a production ready app using Material UI, unless you fix it all by yourself... and I don't think you want to do that, do you?

msaron commented 7 years ago

Material-UI is heavy and slow.

erlgry commented 7 years ago

Thanks. The code indeed looks much cleaner on the react-mdl.

I also noticed that react-mdl v2 branch has not had a commit since June. Is the v2 no longer interesting?

metacoding commented 6 years ago

what about react-md? I read somewhere that it is the best and most accurate implementation of material design for react. Just tried react-mdl and wonder why it doesn't show the ripple effect?

tleunen commented 6 years ago

It's definitely not the best and most accurate :) Not anymore at least.

I'd suggest using these ones from Google: https://github.com/material-components/material-components-web, or something like React-Toolbox