lit-html

Efficient, Expressive, Extensible

[sMyle (🦋 @myles.dev) @MylesBorins]

We just unflagged ESM in @nodejs

Amazing work everyone!

https://t.co/DQxRdeaDRM

[lit-html @lit_html]

Very cool set of Web Components made with lit-html and LitElement! https://t.co/QRTlgCe2J7

[Preet Shihn @preetster]

📣 New release of wired-elements (v0.5.2)
✨ Hand-drawn sketchy UI web components
✨ Great for wireframes, mockups, or just the fun hand-drawn look.
✨ Now rendered with @polymer lit-element.
✨ New sketchy website: https://t.co/al44UJ7uzQ

[Ana Cidre @AnaCidre_]

Here are our slides on web component architecture and patterns from our talk yesterday at the #WeAreDevs conference! https://t.co/2DVQJUmccY cc @sherrrylst

[Lars Knudsen ♥️🇺🇦 in 🇩🇰 @denladeside]

Always great fun (and now games 🕹️) to hear @notwaldorf presenting! Right now, about the new https://t.co/oe4CG4sIaO from @polymer based on @lit_html - at #io18

[KΞNNETH ・ ケニチ @kennethrohde]

Demos of LitElement @lit_html based Material Design Web Components! ♥️🎉

https://t.co/PNy8hrkb9J

[Lars Knudsen ♥️🇺🇦 in 🇩🇰 @denladeside]

So great: @lit_html and new LitElement based @materialdesign components - great work @polymer @justinfagnani @kevinpschaaf @OverEasy https://t.co/8Syqa6S00f

[Dion Almaer @dalmaer]

"We just published pulito, a stake in the ground for what a “tooling and structure” component looks like.

Similarly we’ve published our set of “neat” custom elements skia-elements.

And lit-html for templating" - @bitworking from the skia team

https://t.co/KQYLoDRSqT

[KΞNNETH ・ ケニチ @kennethrohde]

I just published “A bit about lit-html rendering” https://t.co/SXYKms2GUd

[KΞNNETH ・ ケニチ @kennethrohde]

Remember that Template Instantiation proposal from Apple? Our friends at @polymer are prollyfilling and adding some changes based on experience from working with @lit_html !

This will surely move the standardization forward! Can't wait! :-D

https://t.co/2wMxz0Y1vl

[lit-html @lit_html]

Check out this awesome post by @AndreasGalster on creating a Web Component with lit-html.

It uses JS modules, lit-html, CSS variables and the new ultra-lightweight base class in Polymer 3.0 preview. Very cool!

https://t.co/4OeJvmv2bU

[lit-html @lit_html]

@tomasz_ducin Basically. There's also a lot of supported value types like Node, Array, Promise and nested templates, and special syntax in lit-extended for setting properties, event handlers and boolean attributes. Also a powerful directive API.

[lit-html @lit_html]

Great question! See our answer below: https://t.co/riZNZzqC3U

[Tomasz Ducin @tomasz_ducin]

dear @lit_html, what's the difference between your html tagged function and following snippet
const helloTemplate = (name) =>`<div>Hello ${name}!</div>`;
(no html tag)? Is it just using HTML Templates (Web Components standard) under the hood?

[lit-html @lit_html]

@tomasz_ducin lit-html creates an HTML <template> element from the literal parts, _then_ fills in the values from expressions. This makes templates safe - values can't contain raw HTML - and it let's us update just the values that change, not the whole template, making updates _really_ fast.

[Mike Hartington @mhartington]

Tried out @lit_html typescript plugin, turns out to be quite good! Can even get type documentation out from tag names

[lit-html @lit_html]

Nutmeg uses lit-html for its templating layer. If you're in Madison, go check it out! https://t.co/A5pTN4ZH8b

[Pearl Latteier @pblatteier]

Excited to be speaking with @abraham at @MadJavaScript on 2/12. Come learn about building web components with Nutmeg! https://t.co/6xTxXZvskt

[lit-html @lit_html]

let hello = (name) => html`<h1>Hello ${name}!</h1>`;

render(hello('World'), document.body);