javascript - 关于loading中的gif图片处理

Question

一般loading都是一个gif的图片，或者使用css3实现;

我现在是用的两张图片配合加载中...组合成的，然后用css3实现图片的动画效果，既然是图片，肯定是需要加载完成才能显示，所以我把图片转换成base64，在首次使用的时候存到localStorage中，以后使用的时候就读取storage中的数据；

但是，这样还是会先显示加载中...，然后中间有个几十毫秒才显示的图片；

不知大家平时都是怎么处理loading的呢？

Answer 1

我一般先将内容p设为不可见，loading p 默认可见， 当window.onload加载完成后loading不可见，内容可见。loading的效果图尽量用css，codepen有很多现成的代码，质量也不错。
关于loading的实现，我以前也搜集过几个方法，写在这篇博客里：实现加载页Loading Page 的几种方法

Answer 2

能用css的就不用图片，能用jpg/png的就不用gif；

Answer 3

你让加载中这几个字延迟500毫秒出现就可以了

一般来说，在移动端，都是配合一个假的进度条和loading图片来做，不用文字提示
在pc上就用一个loading图就行了

Answer 4

我也想知道为什么，应该是设备性能问题，渲染需要一点点点点点的时间，所以出现肉眼可分别的延时效果，猜想是这样的。

Answer 5

你可以先放个高度0的img加载一下图片，用的时候就会一下子出来了。