手机端白屏前端优化的方法,5 种以上

手机白屏主要是因为页面渲染阻塞导致的,导致的原因有:

1:css文件加载需要一定的时间,在加载的过程中页面是空白的

解决:将css代码前置或者内联html 即使用<style>

2.可能是等待异步加载数据再渲染页面导致白屏,数据量大加载慢,导致数据没请求到阻塞页面渲染

解决:在手机显示的首屏时同步渲染页面,后续的数据在页面滚动(滑屏时)时再采取异步请求渲染页面

3.手机页面的首屏JS的执行会阻塞页面的渲染

解决:尽量不要再首屏html代码中放置内联脚本。即:不要使用<script></script>

备注:首屏:即用户首先能看到的页面,其他页面可通过滑动滚动条显示。

猜你喜欢

转载自www.cnblogs.com/8080zh/p/9224434.html