I am considering using Overview (shoelace.style) for the front-end part of the application. Has anyone used web components as part of the LiveView? Will it slowdown the application significantly? Yes - handling forms might be unnecessarily complicated. Any other downsides? Is there any upside?

I have no experience using web components with LiveView, but there was a good talk about it at ElixirConf 2021: https://www.youtube.com/watch?v=xXWyOy9XdA8

I use custom components for small jobs in combination with live view. It worked very well so far. When I want to give the full control of the tag content to the custom component, I put an phx-update=“ignore“ attributed at it. To pass data to the component via live view I use attributes and their ch…

I am investigating using shoelace with liveview currently. The plan is to use Chris Nelsons live_elements with Shoelace web components. Reason for this selection: Lack of a comprehensive and professional phoenix component library. No, petal components doesn’t cut it. Web components don’t require…

Maybe with Tailwindcss 3.4, and the planned Oxide engine, things will change? I feel the reason for lack of a good UI component library is due to the absence of a library like Framer. One thing is for sure - there are many takers for a good quality UI component library in LiveView. It is necessary …

I think the first step IMO is a headless UI. The great thing about a headless UI is it provides a uniform contract and robust accessibility. Styling and theming are completely separate concerns. Imagine if we could build liveview apps with headless component contracts. The ecosystem would have so…

I’m currently experimenting with lit and it’s going very well so far. I was about to give up on LiveView because that extra layer of UI polish was almost impossible with just hooks. But lit has opened it back up again. I didn’t want to bring in a framework, things don’t always play nicely with esb…

[image] krishandley: I was about to give up on LiveView because that extra layer of UI polish was almost impossible with just hooks. But lit has opened it back up again. Yes this is the last chance for liveview for me too. If I don’t get a good outcome I’ll be moving forward with SvelteKit a…

I have a few form related components which have hidden inputs so I turn off the shadow dom for those. I’m still using hooks as a first resort where possible, but if it’s too complicated for a hook. I’ve (so far) found a nice escape hatch with lit.

[image] adw632: I’m still using hooks as a first resort where possible, but if it’s too complicated for a hook. I’ve (so far) found a nice escape hatch with lit. Do you mind sharing a link to lit? This is the first I’ve heard of it.

[image] Lit Simple. Fast. Web Components.

Using Webcomponents in LiveView - Pros and Cons

Questions & Help Questions

barkerja December 15, 2023, 8:25pm 10

Do you mind sharing a link to lit? This is the first I’ve heard of it.