[英]Multiple html5 canvas elements: performance issue?
無論javascript如何,為了顯示畫布制圖標而添加多個html5畫布元素是否存在性能問題? 我的意思是div和canvas sematic元素之間在性能上有區別嗎?
我試圖遠離圖像,svg甚至fontawesome,這就是為什么我要求。
根據請求,我有這個簡短的代碼:
var canvas = document.createElement("canvas"); canvas.width = 250; canvas.height = 80; var ctx = canvas.getContext("2d"); ctx.fillStyle = "#000"; ctx.fillRect(0, 0, 250, 80); //draw a red box ctx.fillStyle = "#FF0000"; ctx.font = "30px Tahoma"; ctx.fillText("Hello World", 45, 50); var dataURL = canvas.toDataURL(); document.getElementById("img-data").innerHTML = dataURL; document.getElementById("canvas-mirror").src = dataURL;
<div id="img-data"></div> <img id="canvas-mirror"></div>
簡而言之,
是,
性能取決於所有畫布的總面積,盡量保持它(畫布的總面積)小。
如果您打算使用canvas然后嘗試使用裁剪選項,它將提高性能。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.