4 ms·

Well, forget about "Polymer the library", it served us well but it's very legacy at this point. The successor is https://lit-element.polymer-project.org https:/

• interlocutor 7y ago
  Why on earth do you need something that heavy? How about this 200-line lib instead: https://github.com/wisercoder/uibuilder https://github.com/wisercoder/uibuilder It lets you TSX format (same to React) to implement as well as to use web components.
  • spankalee 7y ago
    > Unlike React.js UIBuilder does not do incremental screen updates LitElement + lit-html give you very efficient updates, and don't require non-standard JS like JSX.
    • interlocutor 7y ago
      lit-html is no more of a standard than JSX. In fact JSX is better because tools like VSCode is able to validate both HTML and embedded JavaScript.
      • spankalee 7y ago
        Huh? lit-html uses standard JavaScript. That's it. JSX is a non-standard extension. So yes it is more standard than a non-standard, and lit-html runs directly in browsers without any transpilation while JSX very much doesn't. VS Code is as able to analyze lit-html templates as well as JSX via the lit-plugin extensions. It gives you type-checking, code completion, hover-over docs, and linting.
        • interlocutor 7y ago
          lit-html needs a 1600 line library where as UIBuilder is a 200-line library: https://github.com/wisercoder/uibuilder/blob/master/UIBuilder/UIBuilder.ts https://github.com/wisercoder/uibuilder/blob/master/UIBuilde... Yes, JSX needs transpilation but that happens at compile-time. Which is better, pre-processing at compile-time, or "transpilation" (i.e., string processing) at run-time?
          • spankalee 7y ago
            UIBuilder doesn't do incremental updates at all. You might as well use innerHTML and template literals. That's a 0-line library :)
            • deleted 7y ago
              [deleted]
            • interlocutor 7y ago
              Updates offered by lit-html appear to be very limited. If you change value of expressions it updates the DOM. What about larger changes, such as list items changing? What about child elements being replaced with new ones?
              • spankalee 7y ago
                It handles all of that.
                • interlocutor 7y ago
                  That does not appear to be correct. https://github.com/Polymer/lit-html/wiki/How-it-Works#4-update https://github.com/Polymer/lit-html/wiki/How-it-Works#4-upda... Excerpt: update() simply iterates through each part and value (the parts array and values array are always the same length) and calls part.setvalue(v) for each part. https://lit-html.polymer-project.org/guide https://lit-html.polymer-project.org/guide Excerpt: Behind the scenes lit-html creates HTML <template> elements from your JavaScript templates and processes them so that it knows exactly where to insert and update the values from expressions. This is very limited. You need to manually update DOM unless your updates are simple changes in values of expressions.
        • petilon 7y ago
          OK, so plugins can enhance code editing. But what about compile-time checks? With TSX, if you have a mis-matched tag the TypeScript compiler will give you an error.
          • spankalee 7y ago
            Same with lit-html and the TypeScript compiler plugin.
            • petilon 7y ago
              All I am able to find is this "intellisense" (i.e. editing time) plug-in: https://github.com/microsoft/typescript-lit-html-plugin https://github.com/microsoft/typescript-lit-html-plugin Where is the plug-in that does compile-time checks of HTML tags and attributes?
              • spankalee 7y ago
                This is the VS Code plugin: https://marketplace.visualstudio.com/items?itemName=runem.lit-plugin https://marketplace.visualstudio.com/items?itemName=runem.li... This is the tsc plugin: https://www.npmjs.com/package/ts-lit-plugin https://www.npmjs.com/package/ts-lit-plugin