前端模板化网站是动态的还是静态的？
Are frontend templated websites dynamic or static?
我目前正在构建一个项目，它是一个调查创建器。我在后端用纯 Node.js 创建了一个 Rest API，并且也在前端工作。
显然，渲染页面需要根据用户是否登录、当前调查等因素进行渲染。一般情况下，我使用 Express.js 并集成 Pug 这样的模板引擎。然而，这个项目被设计成尽可能不依赖，所以没有模板引擎。相反，我只是在用户发送请求时向客户端发送“静态”HTML 文件。然后，在前端，我使用模板字符串来“填写”HTML，如下所示：
document.querySelector('cta').insertAdjacentHTML('beforeend', `<div class="login" style=${isLoggedIn? "display: none;" : ""}`); // etc.
这让我想知道我是否真的在构建一个动态网站。从技术上讲，我是“动态地”生成 HTML?
但是 Wikipedia definition 和 Udemy 课程似乎有相互矛盾的消息，两者似乎都说动态网站是在服务器端生成的，如下所示：
When user hits request:
Backend builds template --> compiled to html --> file served to user
我的做法是这样的：
Html file served --> JavaScript generates html
这里的术语很重要——我的网站是动态的还是静态的？
只要它在没有 JS 的情况下工作，我会说它是一个逐步增强的静态网站，因为页面不是由服务器在每个请求上生成，然后使用 JS（如果启用）提供额外的非必要特性或功能。
A static website contains Web pages with fixed content. Each page is coded in HTML and displays the same information to every visitor. Static sites are the most basic type of website and are the easiest to create. Unlike dynamic websites, they do not require any Web programming or database design. A static site can be built by simply creating a few HTML pages and publishing them to a Web server.
所以我认为plain html没有任何前端，任何后端生成都是静态网站，你描述的是动态网站。
所以这是非常基本的东西，把它当作生成的pdf，你不能改变它，为了修改它你需要去文件编辑它，保存，然后发布给最终用户
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>My static website</title>
</head>
<body>
<p> Static means no process </p>
</body>
</html>
TLDR：这是一个混合页面。如果您不关心SEO，那么担心这些事情可能是多余的，只需以您方便的方式进行即可。
所以，你的思路是对的，如果你给客户提供的页面内容在客户端永远不会改变——那就是静态页面。您可以 show/hide 现有的预渲染元素（例如从 display: none; 更改 style 属性）。在运行时对阴影 DOM 或附加 HTML 元素的任何操作都会将页面从“静态”提升为动态或混合页面。
接下来，如果您导航到您网站上的一个新页面，并且您看到浏览器获取一个新的 .html 文件供新页面显示，这就是静态页面的标记。但是，如果获取页面的内容随后被您网站在客户端的脚本更改，则该页面不能再称为“静态”页面，更像是混合或动态页面。重新渲染同一个页面是关于单页应用的，所有页面都是纯动态页面
我们关心的是静态页面、动态页面还是混合页面，主要是SEO优化。网络爬虫分析您的页面内容以检测您的页面内容，稍后在 Google、Bing 等中显示。爬虫可能（并且大多数情况下会）以有点出乎意料的方式分析您的动态内容你，所以你的一些目标受众可能永远不会看到你的页面。因此，如果您需要爬虫将您的页面分析为“互联网玩具店”，您应该从服务器获取所有促销和描述内容，并且以后不要更改它。如果你做的是用户个人文件柜之类的东西，你可以不用担心这些东西，只需在客户端生成内容即可。
我目前正在构建一个项目，它是一个调查创建器。我在后端用纯 Node.js 创建了一个 Rest API，并且也在前端工作。 显然，渲染页面需要根据用户是否登录、当前调查等因素进行渲染。一般情况下，我使用 Express.js 并集成 Pug 这样的模板引擎。然而，这个项目被设计成尽可能不依赖，所以没有模板引擎。相反，我只是在用户发送请求时向客户端发送“静态”HTML 文件。然后，在前端，我使用模板字符串来“填写”HTML，如下所示：
document.querySelector('cta').insertAdjacentHTML('beforeend', `<div class="login" style=${isLoggedIn? "display: none;" : ""}`); // etc.
这让我想知道我是否真的在构建一个动态网站。从技术上讲，我是“动态地”生成 HTML?
但是 Wikipedia definition 和 Udemy 课程似乎有相互矛盾的消息，两者似乎都说动态网站是在服务器端生成的，如下所示：
When user hits request:
Backend builds template --> compiled to html --> file served to user
我的做法是这样的：
Html file served --> JavaScript generates html
这里的术语很重要——我的网站是动态的还是静态的？
只要它在没有 JS 的情况下工作，我会说它是一个逐步增强的静态网站，因为页面不是由服务器在每个请求上生成，然后使用 JS（如果启用）提供额外的非必要特性或功能。
A static website contains Web pages with fixed content. Each page is coded in HTML and displays the same information to every visitor. Static sites are the most basic type of website and are the easiest to create. Unlike dynamic websites, they do not require any Web programming or database design. A static site can be built by simply creating a few HTML pages and publishing them to a Web server.
所以我认为plain html没有任何前端，任何后端生成都是静态网站，你描述的是动态网站。 所以这是非常基本的东西，把它当作生成的pdf，你不能改变它，为了修改它你需要去文件编辑它，保存，然后发布给最终用户
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>My static website</title>
</head>
<body>
<p> Static means no process </p>
</body>
</html>
TLDR：这是一个混合页面。如果您不关心SEO，那么担心这些事情可能是多余的，只需以您方便的方式进行即可。
所以，你的思路是对的，如果你给客户提供的页面内容在客户端永远不会改变——那就是静态页面。您可以 show/hide 现有的预渲染元素（例如从 display: none; 更改 style 属性）。在运行时对阴影 DOM 或附加 HTML 元素的任何操作都会将页面从“静态”提升为动态或混合页面。
接下来，如果您导航到您网站上的一个新页面，并且您看到浏览器获取一个新的 .html 文件供新页面显示，这就是静态页面的标记。但是，如果获取页面的内容随后被您网站在客户端的脚本更改，则该页面不能再称为“静态”页面，更像是混合或动态页面。重新渲染同一个页面是关于单页应用的，所有页面都是纯动态页面
我们关心的是静态页面、动态页面还是混合页面，主要是SEO优化。网络爬虫分析您的页面内容以检测您的页面内容，稍后在 Google、Bing 等中显示。爬虫可能（并且大多数情况下会）以有点出乎意料的方式分析您的动态内容你，所以你的一些目标受众可能永远不会看到你的页面。因此，如果您需要爬虫将您的页面分析为“互联网玩具店”，您应该从服务器获取所有促销和描述内容，并且以后不要更改它。如果你做的是用户个人文件柜之类的东西，你可以不用担心这些东西，只需在客户端生成内容即可。