Christian Sedlmair

Hi, many thanks for this good input! Another, but much more feature-rich approach to build web-components, is to use svelte, with a option-tag like «<svelte:options customElement="my-custom-element" />», see: https://svelte.dev/docs/svelte/svelte-options. I love it and use it regularely because this are the very special points on your app where you can make it shine!

But, PROBLEM: on Web-Components, like you are describing as on Svelte, there is always this unpleasant «blink», but only on first-load, because Javascript first has to build the html while the rest of the page is delivered ready from the server. Only on first-load! When you navigate within the app the components are already built.

Soulution would be to build the components - (but only on first-load!) server-side. React-on-Rails https://github.com/shakacode/react_on_rails has a way for doing this (Svelte is a competitor of React). I didnt have time for dig in that but if this way is found and handy we can make stunning apps!

Thanks for the discussion and I can only agree! Only disadvantage, in partial on projects where cancancan is applied: Instance variables from the controller cannot work inside a view and have to be passed as argument. We are currently using HAML and on this point the advantages and disadvantages balance each other out.