html - 增加 DOM 元素或改用 http 请求

Question

我想知道哪种方法是快速加载网站的最佳方法。我知道，

• http请求多，网站会变慢
• DOM元素多，网站会变慢

现在， 我对以下方法感到困惑:

首先，我使用额外的 div 元素来显示这样的 drop-shadow 效果

<div style="height:100px;width:100px;border:1px solid #eee">
  <div style="height:100px;width:100px;border:1px solid #ccc">
    <div style="height:100px;width:100px;border:1px solid #aaa">
      <div style="height:98px;width:98px;border:1px solid #999">
        <div style="height:96px;width:96px;border:1px solid #777">
       hello world
        </div>
      </div>
    </div>
  </div>
</div>

其次，我使用背景图片来显示这样的投影效果

<div style="background-image=url(drop-showdow.png)">
  hello world
</div>

更多的 http-request 和更多的 dom element 不利于优化网站。该怎么办？为什么？

Answer 1

为什么不直接使用 CSS？

box-shadow: 0 0 5px 3px #777;

对于这样的东西，它增加了外观而不是必需的功能，只需使用纯 CSS。如果人们仍在使用不支持它的足够旧的浏览器，那对他们来说是艰难的突破。如果我们每天都为仍处于石器时代的人们担心，整个互联网就无法进步。