项目要不要 加载loading状态 通常是在项目完成后才考虑的事情，当然，有时候直接就不考虑了。开发人员的职责不只是提高性能，同时优化网络差时，请求接口缓慢导致的页面的慢渲染也是非常重要的。

什么是骨架屏呢？骨架屏(Skeleton Screen)是指在页面数据加载完成前，先给用户展示出页面的大致结构（灰色占位图），在拿到接口数据后渲染出实际页面内容然后替换掉。Skeleton Screen 是近两年开始流行的加载控件

通过伪元素实现骨架样式，通过操作样式实现骨架和页面的动态切换；css部分(scss写法)通过after伪元素生成骨架样式，并通过absolute覆盖到实际元素上，只需要在你认为合理的骨架粒度元素上添加skeleton类即可

一份来自 Akamai 的研究报告显示，在对 1048 名网购户进行采访后发现：约 47% 的用户期望他们的页面在两秒之内加载完成。如果页面加载时间超过 3s，约 40% 的用户会选择离开或关闭页面。

让我们先来看一下时间线，打开 Chrome Devtool 中性能面板：不难发现，在 HTML 下载完毕之后，浏览器仍然需要等待样式（index.css）下载完毕才开始渲染骨架屏。