动态或静态创建表单？

Question

我有一个特定的网页需要大约 6 种不同的表格；其中一些是多达 15 行的唯一标签和输入。

我制作了一个 JavaScript 库，它可以接受一个大对象并输出一个表单。基本上，它接受一个无穷无尽的对象，如：

var myForm = {
   row1 : {
       label : { text : 'First Field'}
       input : {
            type : 'dropdown',
            values : { 1 : 'Enabled', 0 : 'Disabled'}
       } 
   }
}

..等等。

然后我意识到，也许最好在 HTML 中输入每个表格，将其放在 HTML 页面上并在需要时隐藏它（它们被实现为覆盖）。但是我认为这可能被视为不好的做法，因为：

1) 页面正在进行长轮询，每 5 秒更新一次，因此会重绘页面。它会重绘甚至隐藏的东西，比如表格吗？

2) 我的 HTML 文件会很大

我的问题是：我应该简单地在 HTML 中为一个页面存储大量表单，还是应该动态创建它们。动态创建它们仍然意味着我的 javascript 文件中会有大对象。将它们静态嵌入 HTML 页面意味着它们可能（不确定）在每次重绘页面时都被重绘。

Answer 1

如您的评论所述，您已经在使用 ajax 而不是整页加载来更新页面。

当您更改 dom 时，我不会担心页面重绘。可以（在浏览器内部）缓存很多东西，并且没有添加 request/response 处理。更改 dom 没问题 - 执行整页请求很慢。

您的动态解决方案可能比将其作为静态字段添加到 html 页面并使用 javascript 到 show/hide 稍微复杂一些，但我不担心速度问题。如果您已经实施了动态版本（听起来像您实施的），速度如何？

如果我是你，我会这样问自己：

哪种解决方案更容易理解（对于其他人，或多年后的你自己）
哪种解决方案更易于维护？（可能会有什么样的变化？）
我踢自己添加这个：你如何最快完成任务？（谁为此买单，您已经实施了什么解决方案）。

值得一提的是，动态版本可以通过后端等方式为 add/remove/change 字段创建接口。如果这是可取的，你可能想要那样摇摆。但是不要设计你还不需要的东西，这会导致：

YAGNI and KISS

动态或静态创建表单？

Create forms dynamically or statically?

html

javascript

coding-style