Question

HTML文档中hidden输入字段的数量是否会影响浏览器中页面呈现的速度？是还是不是？我的猜测答案是否，因为hidden字段根本没有呈现。如果我错了，请纠正我。

我的情况是，我在页面上有一堆表单，每个表单最多包含100个hidden输入字段。我应该关注绩效吗？我已经尝试减少这个数字用于维护目的，但我需要知道性能损失（如果有的话）。

注意：提出了一个类似的问题here，但是虽然人们提供了解决方法，但没有人解决实际的基于效果的问题

Answer 1

我个人认为它不会影响100个隐藏输入字段的页面渲染（可能慢了0.005秒，因此可以忽略不计）。

它较慢的原因是因为页面中的额外html 而不是隐藏字段。为了使我的陈述更清晰，就像添加100个段落元素，但我为每个元素设置了一个CSS display:none;。

Answer 2

渲染速度会受到隐藏<input>字段的影响，但仅限于大量字段（＆gt; 500）。但是网站的加载速度更受影响！您正在加载不必要的HTML元素。因此，这可能是慢速互联网连接（如移动互联网）的一个因素。

我建议删除您不需要提高加载速度的所有HTML代码。完成此步骤后，您不必担心渲染速度。

我现在已经检查并测试了Google Chrome中的行为。我使用不同数量的隐藏<input>字段（0,100,1.000,10,000）创建了不同的HTML文件。所以我跟踪了一些有趣的因素（加载，渲染和绘画速度），结果如下：

注意： 以毫秒为单位的所有数字 - 毫秒

我使用以下模板，在本地文件中包含不同数量的隐藏输入字段：

＆＃13;

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Title of the document</title>
  </head>
  <body>
    <form action="#" method="post">
      <input type="text"/>
      <input type="hidden"/> <!-- x times -->
    </form>
  </body>
</html>

＆＃13;

HTML文档中隐藏输入的数量会影响页面呈现速度

2 个答案: