一丶进入子应用,样式生效于dom之后,页面闪烁问题。(子应用样式style加载位置不对)
# [Bug]子项目异步插入到 head 标签的 style 位置不正确
已经有人在git上提出此问题,具体查看此issues
二丶当重复切换子应用时,页面样式有快速闪烁
场景描述
问题分析
这是由于qiankun的沙箱设计如此,css并不会被缓存,当切换其他子应用时,承载子应用的容器会被初始化,并重新加载此前该应用加载过的css文件,故子应用会因为css文件刷新而导致页面闪烁的问题,尤其当css请求过慢时(例如没有做http缓存),此问题犹为凸显。
解决方案
就此问题曾询问过qiankun的相关人员,他们的说法是,可以给静态资源做缓存,以加快css的请求速度,达到在dom渲染之前加载完css,但是经过实践后效果不佳,虽然的确能由原先的页面顿挫感优化为轻微快速闪烁一下。 或者可以考虑不开启沙箱,沙箱主要是解决css隔离,防止各个子应用之间的样式污染,可以考虑从其他手段解决子应用样式隔离,关闭沙箱,例如从开发规范上。