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


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

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

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

 

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

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

 

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

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

 

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


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM