难度级别：中高级及以上                               提问概率：80% 

---

FCP的全程是First Contentful Paint，是衡量网页性能的一个重要指标，很多人把FCP理解为元素内容首次渲染到浏览器上的时间。但由于现在比较流行的Vue或是React项目中，HTML文档最初只有一个id为app的DIV元素，只有把CSS和Javascript文件加载、解析、执行完成之后，才能讲最终的真实DOM内容填充到最初的DIV元素中。所以，但从前端角度来说的话，往DIV元素中填充真实DOM这一过程时间越久，导致网页的白屏时间就会越长，用户在这一等待的过程中非常容易跳出页面，这无疑带来了非常差的用户体验。

为了解决长时间的白屏问题，很多网站采用了提前加载骨架屏的方式。骨架屏就是采用DIV+CSS的方式，模拟首屏整体元素结构的轮廓，将这些内容提前放置于id为app的DIV元素中，在用户真正看到首屏内容之前，可以更快的看到骨架屏，所以可以把骨架屏更通俗的理解为非白屏等待页。不过虽然解决了长时间的白屏问题，而且骨架屏也是早于真正用户所需网页元素被渲染的，但其实FCP这个指标并没有得到提升。