div比计算机更昂贵吗？

Question

我一直在玩这样愚蠢的事情：http://jsfiddle.net/dp5rvd91/5/

我使用动态生成的div来创建图像。

for (var i = 0; i< its; i++){

    var size = i; 
    var angle = dAngle * i; 
    var o = Math.sin(angle) * range; 
    var a = Math.cos(angle) * range; 

    var left = cx - a + i;
    var top = cy - o+ i; 



    var c = myservice.rgbToHex(i, i*2,i); 

    var style = "".concat ("position: absolute; left:", left, "px; top:", top, "px; width: ", i, "px; height: ", i, "px; background-color: ", c, ";"); 
    console.log(style); 
    $scope.divs.push(style);

}

<!-- HTML-->
<div ng-repeat = "d in divs" style  =  "{{d}}"/> 

只是想知道 - 与使用HTML5画布相比，这在计算效率上是否有效？

Answer 1

是的，你可能想在画布上做这个，除非你想要创建一个图像，从画布到图像很容易。

但如果您使用div进行操作，则必须使用html2canvas或其他库将其转换为图像。

如果它的计算成本更高，则取决于它。

一个。 1帆布比1 div贵。

湾但是你有很多div，它可能比1帆布贵。

无论如何，你拍的照片上都写着帆布。你用div做的很有趣。无论有效。对于电脑来说，无论我们说的是不到一百个div，它都是一个笑话。但是如果我们谈论成千上万的div然后你可能遇到问题，那么cpu就会开始哭泣，所以使用canvas来做它会更有效率。