yysun / apprun

AppRun is a JavaScript library for developing high-performance and reliable web applications using the elm inspired architecture, events and components.
https://apprun.js.org
MIT License
1.18k stars 57 forks source link

Can I use other libraries in place of lit-html? #117

Closed tvardy closed 3 years ago

tvardy commented 3 years ago

There are very cool competitors for lit-html - eg. HyperHtml, lighterhtml and uhtml by @WebReflection Do you think I'd be able to use them with AppRun?

yysun commented 3 years ago

Yes you can.

On Thu, Feb 25, 2021 at 12:58 PM Grzegorz (Greg) Twardowski < notifications@github.com> wrote:

There are very cool competitors for lit-html - eg. HyperHtml, lighterhtml and uhtml by @WebReflection https://github.com/WebReflection Do you think I'd be able to use the with AppRun?

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/yysun/apprun/issues/117, or unsubscribe https://github.com/notifications/unsubscribe-auth/AABJUM6XBVU5OWO6ENTUZP3TA2FU3ANCNFSM4YG6XDUQ .

yysun commented 3 years ago

You need to let apprun use the render function fromuhtml:

app.render = utml.render;

Here is an example: https://apprun-uhtml.yysun.repl.co/

tvardy commented 3 years ago

I new there needs to be a trick with the render... didn't think of such an easy one :D

Thanks!

yysun commented 3 years ago

Here is another example: https://apprun-uhtml-custom-element.yysun.repl.co/

I like uhtml allows passing a function to the onclick attribute.

WebReflection commented 3 years ago

not sure it's relevant but uhtml and lighterhtml have render(where, what) instead of render(what, where):

render(document.body, html`
  <h1>Hello 👋</h1>
`);

it makes it instantly visible where the layout will be placed, as opposite of needing to scroll down templates 👋

yysun commented 3 years ago

@WebReflection, AppRun also uses render(where, what) so it is easy to replace the AppRun render engine with uhtml.

app.render = uhtml.render

When using lit-html, we need to switch the parameters.

app.render = (e, v) => litHtml.render(v, e);

Currently, AppRun uses morphdom for supporting HTML string in addition of JSX. I was thinking to replace morphdom with lit-html. I like uhtml more now.

WebReflection commented 3 years ago

uhtml uses udomdiff, in case it's needed 👍