Javascript vs HTML（需要更多时间才能加载）

如果使用更长的Javascript或更长的HTML，我会更好。几件事 1.我不在乎SEO的评级。 2.我关心网站的速度。 3.我关心网站的功能。Javascript vs HTML（需要更多时间才能加载）

基本上我的核心问题coders- 请告诉我更好 -

<div> Blah blah blah blah </div>

或

document.getElementById("blah").innerHTML = "Blah blah blah blah"

？任何额外的知识总是欢迎:)。谢谢。

来源

2010-10-07 Susagittikasusa

行之前的4个空格将其格式化为代码。 'ctr-k'作为选择。 – 2010-10-07 19:22:10

使浏览器渲染纯HTML会比加载JavaScript，等待DOM准备好，然后使用JavaScript来操纵DOM更快。

即使你忽略浏览器具有操控通过Javascript的DOM时候做更多的工作，想想这是会需要更长的时间来下载一个事实：

30个字符：

<div>Blah Blah Blah Blah</div>

转到JavaScript的路线，你俩都从服务器下载更多的内容和要求眉毛

<script> 
    document.getElementById("blah").innerHTML = "Blah Blah Blah Blah"; 
</script>

所以：或超过50个字符（懒得算）呃做更多的工作来呈现页面。

来源

2010-10-07 19:20:23

我基本上想要添加一个（umm..lets调用它）弹出菜单，但不是通过AJAX，而不是我想从数据库中获取的东西。但是我希望它只在有人点击某个div时出现。我如何通过HTML编码来做到这一点？ – Susagittikasusa 2010-10-07 19:31:29

@Susagittikasusa - 根据你认为的流行菜单，你应该能够使用CSS编写代码（如果你希望它显示在鼠标悬停上，而不是点击）。否则，一些JavaScript将是必要的。请记住，并非所有的JavaScript都是AJAX。 – 2010-10-07 19:33:50

Aight，我会试用css。谢谢。 – Susagittikasusa 2010-10-07 19:37:07

HTML会更快，因为javascript需要额外的字节下载到浏览器以将文本添加到元素。此外，Javascript需要额外的脚本和函数开销，这不会太多，但对于大型网站来说，它会更慢。

来源

2010-10-07 19:21:16 Joel

对于给定的例子，HTML显然会更快。 HTML部分没有涉及任何逻辑，JavaScript将不得不执行操作来产生相同的结果。这也是更多的人物，然后更多的带宽。

你会想要使用Javascript的原因将使问题没有意义。您将在您的初始HTML输出中无法使用Javascript。

来源

2010-10-07 19:22:23 Fosco

如果没有其他原因，HTML将会更快，您仍然需要发送想要显示的字符的确切字节数加上javascript的额外字符，以便转身并将其渲染回页。现在，如果您打算使用JavaScript以便稍后通过AJAX将元素添加到页面，那么最好将数据作为JSON发送并将其分配给html元素。

来源

2010-10-07 19:22:56 FatherStorm

<div> Blah blah blah blah </div>

更快，因为其他的代码是不完整的，它必须是：

$(document).ready(function() { // Using jQuery here, since creating a pure 
           // JS DOM ready is a pain. 
           // window.onload is fired later. 
    document.getElementById("blah").innerHTML = "Blah blah blah blah"; 
}

因此，由JS去上班的时候，DOM是准备好了，基本上是指文本呈现。

，当然，如果你使用的是绝对没有比赛：

window.onload = function() { ...

时看到它的速度更快绘制图标SVG不是加载它们从服务器的图像这将是有趣的....这是一个完全不同的问题，尽管有很多变数。

来源

2010-10-07 19:24:25

虽然贾斯汀Niessner的答案是基本上是正确的，我想补充一点，实际速度加载网站以及一个网站的速度用户的感知可以由很多因素的影响的。考虑：

从服务器传输到浏览器的数据量。
要加载单个页面的HTTP请求数。
由空白，未缩小的JavaScript，未缩小的CSS样式引起的开销。
未优化的图像。
页面的动态与静态构造。
将表示逻辑放入服务器或放入浏览器中。

等

来源

2010-10-07 19:25:11

-1

HTML将始终呈现速度就越快。

像你描述使用JavaScript的潜在问题：

的JavaScript需要时间来执行。
您必须先等待元素被创建，然后才能通过JavaScript访问元素。
如果JavaScript是在一个单独的文件中，它将是一个额外的HTTP传输来回服务器。
如果用户关闭了JavaScript，他根本看不到它。
JavaScript的代码也稍大，所以再次需要更多时间进行传输。
也有可访问性问题（屏幕阅读器可能有麻烦）。
innerHTML不是标准的JavaScript，因此一些浏览器可能无法正确执行它。

来源

2010-10-07 19:28:51 Adam

他提到他关心功能。 – ajsie 2010-10-21 02:49:23

@ weng - 这是在＃4中解决，否则没有功能差异。 – Adam 2010-10-21 16:15:56

正如其他人所说的那样，纯HTML的加载速度会更快。然而，取决于你实际尝试完成的决定/答案可能会有点棘手。

例如，你可以只有一个基本的html框架和一个内容占位符，然后通过ajax调用来加载实际的数据。由于最初的渲染将很快发生，因此用户认为网站加载非常快。实际/整体时间会更长，但由于韧皮站点迅速渲染，所以权衡可能是值得的。

来源

2010-10-07 20:05:37 jsuggs

+1这里阅读问题的唯一人... – galambalazs 2010-10-07 21:43:23

Javascript vs HTML（需要更多时间才能加载）

回答

相关问题