移动端单页SPA开发几个要注意的问题

‘preact-router’ 的bug

iframe中嵌套的spa页面,此时采用location.hash 跳转会有bug,ipad air ios11.4中测试发现路由不到对应页面。这个应该是preact-router 和 createHashHistory 的问题。

"history": "^4.7.2",
"preact": "^8.2.9",
"preact-compat": "^3.18.0",
"preact-router": "^2.6.1",
最好还是不要用了。还有一个问题是更新问题,state数据变化了,组件没有更新,必须要forceUpdate。甚是蛋疼。

SPA页面图片做懒加载

SPA页面中的图片一定要做懒加载,否则你会发现路由跳转很慢,很慢。因为新页面路由是在dom挂在完之后才会跳转的。如果你的页面有很多图片,那么一定要做图片懒加载,否则会瞬间发出很多请求,还涉及页面渲染,重绘。因为arm处理器本来就慢,处理并发请求更慢,浏览器对同一域名并发http请求是有限制的(chrome是6个,一般都在8个以内),但是加载到渲染还是很消耗性能。

这样页面会跳转会快很多,可以在dom mount之后,加个延时做图片懒加载。

fed123版权所有,转载请保留出处:前端123学堂 » 移动端单页SPA开发几个要注意的问题

赞 (0) 打赏

如果对您有帮助,别忘了打赏一下宝宝哦!

支付宝扫一扫打赏

微信扫一扫打赏