lit-element 和 lit-html 有什么区别?

What is the difference between lit-element & lit-html?

我一直在学习 Polymer,结果出现了 - Web 的未来 (lit-element & lit-html)

我了解到 lit-html 是 HTML 使用一些有效技术进行模板化的。 同时lit-element是一个轻量级的web组件基础class,里面有lit-html .

问题:如果lit-element自带lit-html , 我将只使用 lit-element 来满足我的所有目的。 lit-html 明确地用它自己单独的上下文做什么。

在开发独立的网络应用程序时应该选择lit-element还是lit-html

任何有关指导的帮助都会有很大帮助!

首先,让我们澄清以下几点:

  • 网络 组件 默认情况下,现代浏览器支持这些技术。你可以建造 使用浏览器的 API.

  • 的 Web 组件应用程序
  • HTML 模板至少从 2013 年就已经存在了。

lit-element 库是 Web 组件的 "lightweight" 版本。如果你想在 Web 组件中构建应用程序,你会使用它,如果你这样做,你将使用它的内置 lit-html 通过 html 来创建 HTML templates

另一方面,正如您所说,lit-html 是一个具有创建和更新 HTML 模板的高效机制的库。您可以在需要 HTML 模板的任何时候使用它,而不管您的网站使用的是什么 framework/library(如果有的话)。

例如,您可以使用 jQuery 或香草 Web 构建网站 组件并使用lit-html创建HTML个模板。

lit-html 是一个像其他库一样处理 dom 渲染的库,例如反应 它使用最新的方式在本地标记模板的帮助下区分 dom 树。

var h1 = html`<h1>Header 1 <h1>`

像任何其他 framework/library 例如JSX它还为你在内部构建标记模板和指令提供帮助。

LitElement 是一个使用 lit-html 作为渲染引擎的轻量级框架。它为您提供观察到的属性、属性和 Web 组件生命周期回调

对于 Web 应用程序,您应该使用 LitElement,如果您不想重新发明数据绑定、缓存、回调等。您肯定需要更多状态跟踪、路由等,您可以从其他库中使用它们或自行开发。