对于前端来说，最重要的不是用户体验。 现在，前端的第一个屏幕的渲染时间(FCP )比以前的HTTP往返时间(RTT )多，因为第一个屏幕需要更多的内容，从而导致出现白屏。 白屏时间过长会大幅降低用户体验，用户网速较差会导致FCP变长。
这里介绍的是优化用户等待时间的骨架屏。 这可以被认为是原始路菊插图的升级版，结合传统的顶级屏幕优化方法优化APP显示可以得到很好的结果。
！ doctypehtmlhtmllang=' en ' headmetacharset=' utf-8 ' meta http-equiv=' x-ua-compatible ' content=' ie=edge ' top: 0； bottom: 0； left: 0； right: 0； background : URL ('./images/skeleton home.png ' ) no-repeat； background-size: 100% 100%； }.skeleton-animation {/* animation-name : blink； animation-duration: 1.2s； 动画-计时-功能： ease-in-out； 动画-身份计数： infinite； //*简称//animation 3360 blink 1.2 sease-in-out infinite； } @ key frames blink { 50 % } opacity :5； } }/stylebody！ -骨架屏幕--- divclass=' skeleton skeleton-animation '/div/body/html效果如下：