angularjs - Ionic App 中的图像

Question

我想知道在应用程序中显示图像的最佳方法是什么？

执行获取请求时最好拉 URL 还是使用 base64 和解码更快？

谢谢

Answer 1

使用 base 64 图像，不允许图像减慢页面的渲染速度。使用延迟加载图像。

的HTML：

<img src="data:image/png;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" data-src="your-image-here">

JavaScript：

<script>
function init() {
var imgDefer = document.getElementsByTagName('img');
for (var i=0; i<imgDefer.length; i++) {
if(imgDefer[i].getAttribute('data-src')) {
imgDefer[i].setAttribute('src',imgDefer[i].getAttribute('data-src'));
} } }
window.onload = init;
</script>

用法：

对于大多数页面，您可以简单地将脚本放在 html 中的 end body 标记之前。就图像而言，您要复制上面的代码（标记为“html”）并将“your-image-here”替换为您的实际图像路径。

这个博客会帮助你。 https://varvy.com/pagespeed/defer-images.html