thepassle / webcomponents-from-zero-to-hero

An introduction to writing raw web components.

Home Page:https://thepassle.github.io/webcomponents-from-zero-to-hero/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Not an issue at all

Stefdv opened this issue · comments

Hey, love your 'from-zero-to-hero' parts... I really hope i'm not the only one though.
Are you still motivated to do the lit-element part of it ?

anyway...:thumbsup:

Hi! Thanks for your comment, its much appreciated :-)

Yeah, I definitely intend to make part 3 with lit-element, I started writing little bits and pieces of it already but frankly I haven't had much time lately. Also there's been a lot of movement in lit-element and a 1.0 release should be around the corner, so I'm lowkey waiting for that a little bit to make sure I don't write about anything that might be changed in the 1.0 release. Having said that, you can probably expect part 3 of the series to land somewhere in januari.

Great , but maybe you're willing to answer a question up front ?

I'm struggling with lit-html vs lit-element. The way i see it lit-html is the base library and lit-element is the Polymer/Google version of it ? With all the usual "sugar coating" on top of it ?

There's not really a case of lit-html vs lit-element.

Lit-html is a render library. You can use it agnostically, but it plays very nicely with web components. But you don't have to use it in combination with web components. You can think of it as: lit-html provides the what (dom, attributes, props, eventlisteners etc) and the how (how it gets on the page).

Lit-element is a web component base class. It provides the when (being the render pipeline) and the where (the element instance).

You can see it a little bit like this:
The Polymer Project ships a couple of products; the polymer library, lit-html, and lit-element. Lit-element uses lit-html for its rendering. But you can also use lit-html with skatejs for example.

I see, tx for the explanation. its much appreciated :-)

ps. closing this topic.