【问题标题】:What's the relationship between template engine, data binding? When to use which?模板引擎、数据绑定是什么关系?什么时候用哪个?
【发布时间】:2023-04-01 03:46:01
【问题描述】:

最近碰到了模板引擎的概念。

如果我使用angular or react,这两个框架都提供了某种数据绑定功能,使用语法:{{ xxx }}

  1. 这是否意味着现代的javascript 框架已经淘汰了模板引擎的使用?
  2. 或者说数据绑定能够工作,是因为那些框架已经包含了自己的模板引擎实现,毕竟还是一些模板引擎在幕后工作?
  3. 何时使用专用模板引擎,例如:handlebars, ejs, mustache

  4. 客户端模板引擎和服务器端模板引擎有什么区别??

【问题讨论】:

  • 您的问题标题似乎与实际内容不同步。
  • 对模板引擎的简短回答是它是框架的一部分,以及为什么不再使用该术语

标签: angularjs data-binding reactjs template-engine


【解决方案1】:

首先我们需要了解模板引擎、数据绑定、客户端数据绑定的要求,然后讨论您的问题。

1) 模板引擎(也称为模板处理器或模板解析器)是一种软件,旨在将一个或多个模板与数据模型相结合以生成一个或多个结果文档。 Source.

2)模板引擎是将程序逻辑和表示分离成两个独立部分的工具。这使得逻辑和表示的开发更容易,提高了灵活性并简化了修改和维护。Source

通过以上讨论,我们了解到数据绑定是由模板引擎完成的任务

现在来回答你的问题:

是的,Angular 是一个完整的 UI 渲染客户端框架。您可以将数据输入其中,它会呈现正确的 html。 Angular 本身就是一个模板解决方案,与任何服务器完全分离。

现在,客户端模板非常流行。但我们需要了解客户端模板的问题和好处。

1) 通过客户端模板我们可以节省大量的CPU时间,浪费在数据绑定上。并在大多数情况下 99% CPU 处于理想状态的客户端浏览器上让此类使用更少的任务。这意味着缩短响应时间。

2) 用户浏览您的 Angular 网站。假设他使用移动浏览器,因为那是更棘手的用例。让我们来看看这个用户的浏览器中发生的所有事情。

浏览器下载 HTML、CSS、图像、Angular 和特定于站点的脚本。在下载之后必须初始化 Angular 本身,即浏览器必须通过框架并启动所有 JavaScript 对象以及框架稍后需要的东西,当涉及到实际将数据和行为绑定到 HTML 元素时。

此步骤可能需要一些时间,尤其是在移动浏览器上,与桌面浏览器相比,移动浏览器的处理器速度较慢且内存较少。

在这种情况下,我们可能会失去忠实的用户群。

选择客户端模板引擎或服务器端模板引擎完全取决于需求和目标用户。他们有什么样的设施,你想为他们提供什么。你拥有的服务器能力如何。

【讨论】:

  • 您一直做得很好,直到 “在这种情况下,我们可能会失去忠实的用户群。”。您听起来好像在初始页面加载上总是有大量时间。这肯定违背了当今有多少应用程序被开发为 SPA 的普遍趋势
猜你喜欢
  • 2014-08-24
  • 1970-01-01
  • 2013-02-09
  • 2017-05-12
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2023-03-04
  • 1970-01-01
相关资源
最近更新 更多