Hotwire Discussion

Hotwire + TailwindCSS Performance

Our team rebuilt an application using Hotwire + TailwindCSS.

  • 30+ stimulus controllers
  • lots of UI
  • fairly small front-end payload (CSS - 12kb compressed, JS - 60kb compressed)

Navigating through pages feels very fast on desktop and mobile Very happy with Google Chrome > Lighthouse benchmarks.

3 Likes

What were the main obstacles?

I’m thinking of doing the same.

I’m also considering tailwind and set up a new rails app with tailwind installed to experiment with.

I think the main obstacle is a learning curve. I moved from Zurb Foundation a year or so ago and went with a plain vanilla W3-css. It took a few days to match what I knew to how tailwind works. Tailwind is quite powerful and I’ve just been trying converting basic stuff. Things like w3 grid to tailwind grid or flex.

I may just try using both and convert a model/view at a time. Probably after setting up the main theme in layouts. I think after you do a few, it won’t be that difficult.

@Diogomartf — is your question about the main challenges for getting TailwindCSS to work, or switching our JS library?