[gitaarik]

What a vendor lock-in basically means is that your integration with the vendor is so specific, that it's very hard to transfer to another vendor.

Lit is basically a library that makes use of the native Web Components APIs in modern browsers. If someone else would make a similar library, it would most probably have similar functionality.

So I don't really see the issue with vendor lock-in here. Most logic regarding your app is not gonna have anything to do with Lit. Only the way the templates are structured is a bit specific. But it is way less specific than JSX. Because it's just normal HTML with a few specific attributes to easily bind event listeners on HTML elements.

So Lit basically just gives you easy access to powerful browser APIs, making it really easy to build complex webapps without using a big framework.

[troupo]

> your integration with the vendor is so specific, that it's very hard to transfer to another vendor.

Indeed.

> Lit is basically a library that makes use of the native Web Components APIs in modern browsers. If someone else would make a similar library, it would most probably have similar functionality.

Maybe, similar, perhaps.

The meat of the matter is this. There are a lot of things in lit that are specific just to lit. They have nothig to do with web components. Custom DSL. Tasks. Reactivity. etc. etc.

So yes, when you're buying in to lit, you're locking yourself to lit, and the way lit does things.

For example, Stencil, another popular web component library, is completely different from lit: it uses a different templating mechanism, a different data binding mechanism etc. etc.

> So Lit basically just gives you easy access to powerful browser APIs

No, it doesn't give access to those APIs. It goes out of its way to hide those APIs and provide a different, ore ergonomic API on top.

[gitaarik]

Well, if Stencil is a Web Component framework using native Web Component technologies and strategies, transferring from Lit to Stencil will probably be a lot easier than from React to Angular or something.

And there are actually not that many things specific to Lit, and it's only things that would need to be solved in some kind of (opinionated) way anyway. But I think Lit does it in an elegant, intuitive and flexible way. You might like it or you might not.

I don't know Stencil, but looks nice. But their main npm package [0] is 47.8 MB, whereas Lit [1] is only 105 KB. So I would say that there are a lot more things specific in Stencil then there are in Lit. Which would probably make it harder to move from Stencil to Lit, than it is to move from Lit to Stencil.

[0]: https://www.npmjs.com/package/@stencil/core

[1]: https://www.npmjs.com/package/lit

[troupo]

> Well, if Stencil is a Web Component framework using native Web Component technologies and strategies, transferring from Lit to Stencil will probably be a lot easier than from React to Angular or something.

Literally everything that's on the web is using "native technologies and strategies". Because there's nothing else.

So, extraordinary claims require extraordinary proofs. I eagerly await a description, with examples, of how much work there is to convert a non-trivial lit component to Stencil.

Why non-trivial? Because trivial components are easy to convert from anything to anything. You could convert a trivial React component into knockout.js, then to Angular, and then to Lit, and back, in under half a day even if you've never worked with those technologies before.

> And there are actually not that many things specific to Lit

I've listed a few of them. They are opinionated enough that lit code and stencil code are completely different and incompatible.

Besides, there are a dozen or so libraries and frameworks that can, or do, compile to web components. Their code is also different from lit's.

> But their main npm package [0] is 47.8 MB

This is completely beside the point. We're not discussing Stencil, or the opinions its authors may or may not have taken.

[gitaarik]

Sorry but I think it is quite obvious that a large framework will create much more lock-in and dependency than a tiny library. The more specific stuff you use, the more you are locked in. And yeah Lit still does some things for you so there's always some lock-in, with any library that you use. So it's not about simply whether it is a lock-in or not, but the amount of lock-in.

Lit doesn't need JSX and a virtual DOM, which are React specific technologies. You have to design your React components with these technologies in mind. With Lit there are much less dependencies like that, so your code will be less designed for a specific framework, making it easier to move to another framework that doesn't impose a specific workflow.

[troupo]

> Lit doesn't need JSX and a virtual DOM, which are React specific technologies.

But lit needs lit's custom DSL, lit's custom reactive components, custom everything.

Even in their most trivial example literally everything is custom, and specific to lit:

    import {LitElement, css, html} from 'lit';
    import {customElement, property} from 'lit/decorators.js';
    
    // custom lit-specific decorator
    @customElement('simple-greeting')
    export class SimpleGreeting extends LitElement {
      // custom lit-specific css function
      static styles = css`
        :host {
          color: blue;
        }
      `;
    
      // Custom, lit-specific reactive properties
      @property()
      name?: string = 'World';
    
      // custom lit-specific render function 
      render() {
        // custom lit-specific DSL
        return html`<p>Hello, ${this.name}!</p>`;
      }
    }

So. So, extraordinary claims require extraordinary proofs. I eagerly await a description, with examples, of how much work there is to convert a non-trivial lit component to Stencil.

BTW. Claiming that Virtual DOM is somehow a react-specific technology (and that somehow apparently affects conversion from React to something else) really shows how much you understand about the topic at hand.

[gitaarik]

That is a slight layer upon simple JavaScript string templates, nothing compared to JSX I would say

Edit: hint: that is why Lit's library is also much smaller