Canvas性能对简单的html + css标题

Question

从今天早上开始，我一直在尝试使用h2画布将我的h1，html html标题转换为图片。但我想知道这是不是一个好主意！

我们知道，当从服务器向客户端呈现图像时，图像很重。但它们可以带来流动性和最佳效果而不是htmls。

我的问题是要知道本地创建的图像（canvas / svg）是否比简单的htmls好？

此

    var c = document.getElementById("h1Title");
   var ctx = c.getContext("2d");
   ctx.font = "30px Arial";
   ctx.fillText("Hello World",10,50);

反对这个

   <h1 style='font:30px Arial;left:10px;top:50px'>Hello World</h1>

Answer 1

这不是个好主意。

本地创建的<canvas>元素不如风格化<h1>和类似元素

• 普通HTML元素使用CSS提供简单的样式。使用CSS3转换，您可以执行非常复杂的文本样式。例如。 http://www.css3maker.com/text-rotation.html - 如果您认为使用CSS3无法实现任何特定效果，请为此效果单独提出问题

• 普通的HTML元素是硬件加速的，并且<canvas>

通常会有性能损失呈现文字

• 用户互动（文字选择，复制粘贴，箭头导航和辅助功能）已被<canvas>

破坏