我想要的是
目前我有一个4000×4000的png图像.使用tinypng.org后,它成为一个288KB的文件.
现在我想要加载图像的斋戒方法,将其放在DOM中,并可以在其上绘制大量画布.
我测试了一些,结果令我震惊.
我测试了
我做了3个测试,只检查负载速度.
>(423ms)< canvas>
>(138ms)< img>
>(501ms)CSS background-image
< img>标签是最快的.
题
那么使用< img>是不好的做法标签显示一个巨大的(背景)图像,并使用一些脏CSS来绘制画布？
或者在我的情况下使用画布更好,不用担心更长的加载时间？
解决方法
很好的问题！这是相关的：
When to use IMG vs. CSS background-image?
从该文章中,如果人们打算打印您的页面,则不会使用< img> – 这样会出现在印刷品上.这同样适用于< canvas>,使background-image成为逻辑解决方案.
如何通过CSS添加您的背景图片？是内联还是通过自己的样式表？如果使用自己的样式表,在测试速度之前是否尝试过compressing the CSS？
这也是有关的,我想：Do Images Load Faster in HTML or CSS?
