lit-element

I see many people have problem with that in the comments here. However I don’t find that to be an issue. Passing properties (as opposed to attributes) allows complex types and many popular frameworks have a handy shorthand for it (e.g. in lit-html you write `<my-component .prop=${[1, 2, 3]}>`). In my opinion the bad ergonomics is actually when authoring the components (not consuming it). Many of the faults have been excellently pointed out previously[1]. The most glaring the boilerplate you have to write if you want your attributes to reflect a property. This has an easy fix though, which is that you simply don’t write your web components by hand. You either use a library (like lit-element[2]) or a compiler (like stencil[3]). I’m personally waiting for a less opinionated compiler with a smaller runtime then stencil (preferably no runtime;

Google uses LitElement (version 2.0.1) [1] to create the page. You can see it by typing `litElementVersions` in the JavaScript console. [1] https://github.com/Polymer/lit-element

My suggestion to you is to look into web components (e.g. https://github.com/Polymer/lit-element) for theoretically re-usable components. React is optional for web development.

Where did you get this information from? This is not true, there is no string conversion. There is even separate syntax for setting props vs attrs. Check out the readme here. https://github.com/Polymer/lit-element I also normally use redux in my WC applications.

"component tree is bound to the DOM as strings" You can pass data as props instead of attrs, same as with react - https://github.com/Polymer/lit-element. I wonder why this pop's up all the time. It is true that polymer had quite a bit of limitations, but there are other solutions like stencil, lit-element, svelte or vue (yes it can output WC's) that do not have those problems. Lit-html in latest version I think is only outperformed by inferno from popular solutions.

- LitElement + Redux for frontend (web components) https://github.com/Polymer/lit-element - Golang + Postgres for backend

Read the comments. The back-and-forth between Dan Abramov and Benny Powers is very enlightening (at least for someone like me who doesn't follow Web standards and library internals closely). I used to be skeptical about Web Components' ability to impose common standards [0], but I've recently become fascinated with Polymer (LitElement [1] and lit-html [2], specifically). There's even a Redux mixin for LitElement components. Were it not for React Native, I would be giving Polymer much more serious consideration for my go-to technology. [0] https://news.ycombinator.com/item?id=15058651 [1] https://github.com/Polymer/lit-element [2] https://github.com/Polymer/lit-html

Try https://github.com/Polymer/lit-element for an alternative to VDOM, without the VDOM part. It's reactive and uses lit-html under the hood.

Personally I like LitElement: https://github.com/Polymer/lit-element It's a super-lightweight base class for web components, and a descendant of the Polymer framework. A Material Design framework uses this: https://github.com/material-components/material-components-w...

You should check out lit-html+LitElement. It's standards Web Components from the get-go - you don't write to a non-standard API and then compile it out like with Vue, you just use the standard connectedCallback(), disconnectedCallback(), etc lit-html is standard JS, with all the flexibility of a non-standard syntax extension like JSX, but without a compiler. Templates are expressions, can be passed to higher-order functions, and use JavaScript for control-flow. It's all ES modules, published to npm as ES modules, and loadable directly from CDNs like unpkg.com into all modern browsers. No CLI or custom tools needed, but also works with all the tools our there. Edit, link: https://github.com/Polymer/lit-element

With lit-element you get native elements that are similar to react elements. And only parts of the dom that changed actually do mutations - like with vdom. https://github.com/Polymer/lit-element#minimal-example

Check out https://github.com/Polymer/pwa-starter-kit/wiki. It uses Redux and LitElement (https://github.com/Polymer/lit-element)

It's a browser spec, so yeah browser-only. Electron is browser-based (Chrome), so web-components can be used there. Check out https://github.com/Polymer/pwa-starter-kit/wiki for concrete examples using LitElement (https://github.com/Polymer/lit-element)

I'm still super gung-ho about web components. The progressive browsers are committed to making it happen. The picture is not so bleak for custom elements: https://caniuse.com/#feat=custom-elementsv1 Firefox also just announced that Shadow DOM arrived in a nightly: https://bugzilla.mozilla.org/show_bug.cgi?id=1460069 https://news.ycombinator.com/item?id=17172613 Contrary to popular belief, you can start using web components WITH just custom elements and WITHOUT shadow DOM! https://twitter.com/rob_dodson/status/961780022628331520 I jumped onto this bandwagon early and struggled with Polymer 2 and HTML imports (ugh!). Now they have made the same realizations and moving forward LitElement will lead the charge toward usable and lightweight web components: https://www.polymer-project.org/blog/2018-05-02-roadmap-upda... https://github.com/Polyme