今天，我们非常高兴地宣布，两个新一代网络开发库（lit-html 和 LitElement）的第一个稳定版本现已发布。
lit-html 是一个超小、快速且富有表现力的 HTML 模板库。LitElement 是一个简单的基类，用于使用 lit-html 模板创建 Web 组件。
如果您一直在关注这些项目，那么您可能已经知道 lit-html 和 LitElement 的全部内容（如果您愿意，可以跳至结尾）。如果您刚开始接触 lit-html 和 LiitElement，请继续阅读简要了解。
lit-html：用于制作 HTML 模板的小型快捷库
lit-html 是一个超小且快速的 JavaScript 库（打包、缩减大小和 gzip 压缩后超过 3k 大小），用于制作 HTML 模板。lit-html 非常适合函数式编程方法，可让您以声明方式表达应用的界面（作为其状态的函数）。
const myTemplate = (name) => html`
<div>
Hi, my name is ${name}.
</div>
`;
呈现 lit-html 模板非常简单：
render(myTemplate('Ada'), document.body);
重新渲染模板只会更新已更改的数据：
render(myTemplate('Grace'), document.body);
lit-html 高效、富有表现力和可扩展性：
- 高效。lit-html 速度快如闪电。当数据发生更改时，lit-html 不需要进行任何差异比较；相反，它会记住您在模板中插入表达式的位置，并且只更新这些动态部分。
- 富有表现力。lit-html 为您提供 JavaScript、声明式界面和函数式编程模式的全部功能。lit-html 模板中的表达式只是 JavaScript，因此您无需学习自定义语法，可随心所欲地掌握该语言的所有表现力。lit-html 原生支持多种值：字符串、DOM 节点、数组等。模板本身是可以计算的值、可向函数传递数据、从函数传递到函数的值以及可嵌套的值。
- 可扩展：lit-html 还具有可自定义和可扩展的特点，可让您拥有自己的模板构建套件。指令可自定义值的处理方式，允许异步值、高效的键控重复、错误边界等。lit-html 包含多个现成的指令，可让您轻松定义自己的指令。
很多库和项目均已采用 lit-html。您可以在 GitHub 上的 awesome-lit-html 代码库中找到其中一些库的列表。
如果您只需要模板，则可以从 lit-html 文档立即开始使用。如果您想要构建要在应用中使用或与团队共享的组件，请继续阅读以了解详情。
LitElement：轻量级网络组件基类
LitElement 是一个轻量级基类，可让您比以往更轻松地构建和共享 Web 组件。
LitElement 使用 lit-html 渲染组件，并添加 API 来声明响应式属性。元素属性发生更改时会自动更新。它们会快速更新，而不会出现差异。
下面是一个 TypeScript 编写的简单 LitElement 组件：
@customElement('name-tag')
class NameTag extends LitElement {
@property()
name = 'a secret';
render() {
return html`<p>Hi, my name is ${this.name}!</p>`;
}
}
（我们还有一个很棒的 vanilla JavaScript API。）
这样便可创建可在任何能使用常规 HTML 元素的任何位置使用的元素：
<name-tag name="Ida"></name-tag>
如果您已使用 Web 组件，当知道 Chrome、Safari 和 Firefox 现已原生支持这些组件时，一定会很高兴。即将支持边缘，并且只有旧版浏览器需要 polyfill。
如果您刚开始接触 Web 组件，不妨试试看！借助 Web 组件，您可以通过与其他库、工具和框架进行互操作的方式来扩展 HTML。因此，此类应用非常适合用于在大型组织中共享界面元素、发布组件以在网络中任意使用，或者构建 Material Design 等界面设计系统。
您可以在使用 HTML 的任何位置使用自定义元素：主文档、CMS、Markdown 或使用框架构建（如 React 和 Vue）的视图中。此外，您还可以将 LitElement 组件与其他 Web 组件混合搭配，无论这些组件是使用 vanilla Web 技术编写的，还是借助 Salesforce Lightning Web Components、Ionic 的 Stencil、SkateJS 或 Polymer 库等工具构建的。
开始使用
想试用 lit-html 和 LitElement？建议您首先阅读 LitElement 教程：
如果您有兴趣单独使用 lit-html，或者将 lit-html 模板集成到其他项目中，请参阅 lit-html 文档：
一如既往，欢迎与我们分享您的想法。您可以通过 Slack 或 Twitter 与我们联系。我们的项目是开源的（当然！），您可以在 GitHub 上报告 bug、提交功能请求或提出改进建议：