How to install lit-html

lit-html lets you write HTML templates in JavaScript, then efficiently render and re-render those templates together with data to create and update DOM.

lit-html is an HTML templating library made by the Polymer team. This library stands out for being simple, very small, extremely efficient in terms of speed and use of resources, and all this is because it is based on web standards.

A very important point to note is that lit-html doesn't define any component model and therefore can be used in any project with other frameworks or libraries.

Installation

You can download the latest version of lit-html from the GitHub releases or use a lit-html CDN.

Example

lit-html - templates are plain JavaScript and combine the familiarity of writing HTML with the power of JavaScript. lit-html takes care of efficiently rendering templates to DOM, including efficiently updating the DOM with new values.

import {html, render} from 'lit-html';

// This is a lit-html template function. It returns a lit-html template.
const helloTemplate = (name) => html`
Hello ${name}!
`;

// This renders 
Hello Steve!
 to the document body
render(helloTemplate('Steve'), document.body);

// This updates to 
Hello Kevin!
, but only updates the ${name} part
render(helloTemplate('Kevin'), document.body);