Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Lit: a library for building fast, lightweight web components

lit.dev

Post reply on HN
Print view View original

131–140 of 180 posts

Re: Lit: a library for building fast, lightweight web components

#131

Post by fkyoureadthedoc »

rs186 wrote: post #122
o_m wrote: post #30

I don't see the need for Lit anymore. Lately I have just been raw dogging web components without any libraries. Having a nice templating system like JSX on the server makes it a breeze. Part of using web components, for me, is that it is just javascript. There is no upgrades or deprecations to think about. Of course those things still exist on the server though, but it is easier to maintain it there.

I find that there is little practical difference between "html" tagged template literal and writing JSX. Not to mention there is a compilation step in JSX.

Don't know the current state of lit-html and similar, but Typescript support was the biggest thing missing for me when I used it several years ago.

In simple scenarios like just dropping it in an html page, codepen, or something like that I really enjoyed it though.

Re: Lit: a library for building fast, lightweight web components

#132

Post by jfagnani »

no_wizard wrote: post #114
brazukadev wrote: post #111

Earlier quoted context omitted.

> Nothing in Web Components is forcing you to use ShadowDOM Yes. There is just one thing forcing someone to use shadowDOM: slots. You can't use slots without shadowDOM or at least use something like this.children to capture the content inside the . But that is quite the important feature lacking.

In my mind this has always made no sense to me, why slots aren’t independent of the shadow dom. Same thing with how css is handled, especially since we have @layer and @scoped now

It's not possible to make slots work without a separate tree like shadow DOM. The browser can't tell what the container for a slot is vs what content should project into it.

Re: Lit: a library for building fast, lightweight web components

#133

Post by paradox460 »

agos wrote: post #105
jonjlee wrote: post #92

Earlier quoted context omitted.

DaisyUI and HyperUI, which are both full component libraries based on tailwind, play well with lit. You either opt out of using the shadow dom or import the global styles into the component. Both methods have official lit support.

these are cool but are CSS only, there is no interactivity.

Also building a component library atop tailwind feels so disgustingly wrong

Re: Lit: a library for building fast, lightweight web components

#134

Post by brazukadev »

mock-possum wrote: post #126
brazukadev wrote: post #67

Earlier quoted context omitted.

> - Open styleable shadow roots What people using web components want is to get rid of shadowDOM and not feel like they are deviating from the correct path. shadowDOM sucks, stop trying to convince the world that we are using it wrong. shadowDOM is the whole reason web components did not become mainstream (yet?).

What about shadow dom sucks? How else do you achieve that level of encapsulation to enable portable components?

You don't want to enable portable components all the time. If most of the components you use to create your app is made by yourself, those boundaries are annoying, not helpful.

Re: Lit: a library for building fast, lightweight web components

#135

Post by SebastianKra »

pmanu wrote: post #104
SebastianKra wrote: post #65

Earlier quoted context omitted.

I thankfully migrated or left all Aurelia projects, but every time someone mentions it, I remember new horror stories. Its .html temples were shipped unmodified directly to the client (yes, including comments). Except they weren't actually html, and sometimes the browser would try to clean them up, breaking the template. Reactivity was achieved through all kinds of weird mechanisms (eg monkey-patching arrays to watch…

Never had issues with the HTML. Templates sometimes showed comments in dev mode, but in production builds they were stripped and everything minified. I never used Webpack or other bundlers, only the "dumber.js" from their CLI, so maybe was something related to that? And yeah, probably they monkey-patched arrays and such, but that was just the way of the world before proxies and native signals. The cool part is Aureli…

> Never had issues with the HTML

https://github.com/aurelia/binding/issues/108

> I never used Webpack

That has little to do with Aurelia, and Aurelia itself integrates with Webpack: https://github.com/aurelia/webpack-plugin

> The cool part is Aurelia stuck to web standards, and those “weird mechanisms” were basically polyfills

I could agree that Aurelia looks like you’re sticking to standards¹. If you don’t think about it, then everything kinda works 90% of the time.

But when you actually try to understand what goes on behind the scenes, like you can with React and Angular, there are just so many footguns, especially around composition and reactivity.

Even simple things like passing optional props² or detecting if a is occupied involved depressing amounts of reverse-engineering.

I’ve heard that Aurelia 2 supposedly fixes many of my issues, but I believe the core idea is beyond fixing. React, Solid and others have more powerful approaches that require fewer concepts to understand.

¹ Although there are still tons of custom concepts and syntax to learn.

² https://github.com/aurelia/templating-binding/issues/106

Re: Lit: a library for building fast, lightweight web components

#136

Post by Muromec »

jazzypants wrote: post #117
kubb wrote: post #89

Earlier quoted context omitted.

Shadow DOM is optional in Lit - you can just disable it on a per-component basis.

It should not be the default. This is almost certainly Lit's biggest flaw. I am currently working on a web components framework, and I scrapped everything halfway through after I realized that you very rarely want that much encapsulation. Now, you can turn it on if you really need it, and I even made a way where you can pass references to DOM elements and stylesheets and such into each component so you can pierce the…

>The only time I can imagine it being useful would be building component libraries inside of large organizations.

That was our use case and we are migrating away from custom elements to a more conservative approach.

Re: Lit: a library for building fast, lightweight web components

#137

Post by Muromec »

mock-possum wrote: post #126
brazukadev wrote: post #67

Earlier quoted context omitted.

> - Open styleable shadow roots What people using web components want is to get rid of shadowDOM and not feel like they are deviating from the correct path. shadowDOM sucks, stop trying to convince the world that we are using it wrong. shadowDOM is the whole reason web components did not become mainstream (yet?).

What about shadow dom sucks? How else do you achieve that level of encapsulation to enable portable components?

The point is you mostly don't want this level of encapsulation

Re: Lit: a library for building fast, lightweight web components

#138

Post by Muromec »

akmittal wrote: post #16
jfagnani wrote: post #14

Lit maintainer here. I should be going to bed, but I'll answer any questions if people have any! Not sure why Lit showed up on the front page tonight :)

Curious which web platform features are missing that are preventing Web components to complete with React(for application development not widgets)?

Another pain in the ass is the fact web components are registered globally. Good luck marrying this with npm dependency hell where two transitive dependencies both import a button.

The good part of react and friends is it's just javascript and the class is imported and referenced normally, not with a weak string-binding-through-registry kind of way.

Now add types to the mix and shadow dom and it brings constant problems without any upside.

Re: Lit: a library for building fast, lightweight web components

#139

Post by Muromec »

jfagnani wrote: post #22
akmittal wrote: post #16

Earlier quoted context omitted.

Curious which web platform features are missing that are preventing Web components to complete with React(for application development not widgets)?

I think web components already compete extremely well for application development, and you see very complex apps built with Lit out there: Photoshop, Firefox, Chrome OS, Chrome DevTools. Apps are well served because they have more control about how components are used: they can import the same shared styles into every component, take are to not double-register elements, etc. But I think there are some important stand…

>- ARIA reference target: make idref-based reference work across shadow roots

How is this even supposed to work if each shadow dom has it's own scope of ids? `#id#subid` or something?

What if I want to ref to the outside?

The whole thing is not made for web development.

Re: Lit: a library for building fast, lightweight web components

#140

Post by Muromec »

Ruphin wrote: post #106
alexisread wrote: post #102

Earlier quoted context omitted.

Thought I'd add an example: https://github.com/SaleCar/Quasar-UMD-Template You can do sophisticated things as well eg. Stream half a million Kafka records into the browser- anything available from unpkg or other cdns. A good cdn UI lib turns out to be https://quasar.dev/

Oh nice, I wasn't aware this was even possible. Vue _does_ have some sort of build step, because components use special macros that aren't imported, and the compiler (vite) even complains when you actually import them saying it's not necessary. The build also rewrites your code to some other format that I assume is more optimized because it can do some sort of static analysis. Are these the main reasons for Vue to us…

IRRC Vue will compile your templates on the fly if you don't pre-compile them, so you will be punished twice -- in performance and in bundle size for skipping the build step.

If you can eat the cost to get something in return, it's a nice trade off.

Post reply on HN