Fatal编程技术网
  • javascript/
  • Javascript 在页面加载方面，在客户端加载js文件并使用js创建整个页面好吗

Javascript 在页面加载方面，在客户端加载js文件并使用js创建整个页面好吗

javascript html performance http

Javascript 在页面加载方面，在客户端加载js文件并使用js创建整个页面好吗,javascript,html,performance,http,Javascript,Html,Performance,Http,我已经读到，对web资源（html、css、js）的多个http请求会导致网页的延迟加载。如果我们使用js在客户端创建整个html和css会怎么样。 如果我的index.html包含以下代码： <html> <head></head> <body> <script src='main.js'></script> </body> </html> 它会使页面加载更快吗？简单的答案是也许不会 举例说明：

我已经读到，对web资源（html、css、js）的多个http请求会导致网页的延迟加载。如果我们使用js在客户端创建整个html和css会怎么样。 如果我的index.html包含以下代码：

<html>
<head></head>
<body>
<script src='main.js'></script>
</body>
</html>
它会使页面加载更快吗？

简单的答案是也许不会

举例说明：

页面加载所需的时间取决于许多因素的组合：

  • 请求数，这就是您所指的
  • 要加载的总字节数，由HTML文件及其资产的大小决定
  • 用户的连接速度
  • 用户的本地资源（RAM和CPU）
  • 还有更多
在您的示例中，您已经编写了大约170个字符的Javascript，它实际上创建了一个
元素

同样的结果也可以通过编写
来实现。这是一段
，它只在HTML中添加了26个字符

在HTML、CSS和JS文件中包含更多字符意味着文件的总大小更大，用户的浏览器可能需要更多的时间来加载它们

话虽如此，优化web性能还有更多细微差别。减少请求的数量可以减少加载时间，但重要的是要了解您的更改如何影响其他因素，这些因素也会影响页面的性能

var d = document.createDocumentFragment();
d.appendChild(para);
var para = document.createElement("P");
para.innerText = "This is a paragraph";
document.body.appendChild(d);