2
7 Comments

Responsive React frameworks

Hey guys I'm in the process of open sourcing my internal component library (looking for help 👀) and was curious if you have come across many libraries that deal with responsiveness for you. I've used material-ui quite a bit and it's responsiveness is quite hard to use from what I tried. Others like antd I couldn't find support built-in at all.

Would love to hear any that you've used and what your experiences were.

  1. 1

    What about material-ui's responsiveness is hard for you to use? I use it quite frequently, largely because it simplifies responsiveness. I'm curious about your experience.

    1. 1

      It's modtly the fiddly-ness of it. I like to avoid using components that change the layout at runtime as much as possible because approaches in these libraries like using media query hooks (https://material-ui.com/components/use-media-query/) cause so lots of rerenders and my main project (everypage) tries to be as static as possible. Is this something you think about when developing or not really a problem for your projects?

      1. 1

        That's interesting to understand. I have not focused on optimizing the rerenders for my projects. My page speeds / resource utilization with material-ui / react has always been "good enough."

      2. 1

        The MUI <Grid> and <Hidden> components solve all my responsive needs and don't have the runtime-only issue of media query hooks. Do you find you often need responsive logic that can't be handled by those components?

        1. 1

          Yep I've used Grid and Hidden to lay things out but I was more curious about (for example) setting the text alignment to be center in >md and left in <md. Would your approach be to use two different components and show / hide them in this case?

          1. 2

            The <Box> system props can be response, for example: <Box textAlign={{ xs: "center", md: "left" }}>

            1. 1

              Oh nice I hadn't seen this before, will def try it out!

Trending on Indie Hackers
✨ Let's hack Twitter ✨ 58 comments I quit everything. I'm going all-in on Web3. 45 comments My SEO experience 17 comments Why I started following back everyone 7 comments How do I not quit? 5 comments How do you login users on you site? 5 comments