[前端] 怎么做一个 Native App 那样的 welcome page?

[cqcn1991]

打开web app(网站)时，有时需要等一阵
想像native app那样设计一个welcome page，不知道有啥办法？
具体来说，就是把一部分html css js最先载入，然后其他的再慢慢载入。

求教了~

[teavoid]

大概思路：好像可以用iframe，主iframe加载简单的欢迎页面，然后异步启动次iframe的加载，等次iframe加载完成之后，将其铺满界面，或者直接用次iframe的内容替换主iframe的内容。。

[justfindu]

document.ready.function(){remove welcomePage}

[cqcn1991]

@justfindu 怎么保证welcome page最先载入？

[loading]

伪代码：
loading:
#welcome {display:block}
#main {display:none;}



$.ready{
#welcome{display:none;}
#main {display:block}

}

[justfindu]

@cqcn1991 welcomePage 作为覆盖层 而且welcomePage应该是越简单越好 如果你的welcomePage 都比主页面载入慢了 还要他何用...放在body最开始...

[lincanbin]

SplashScreen

你可以将所有JavaScript、CSS等等以非阻塞方式异步载入，然后页面就可以直接显示SplashScreen，等所有外部资源载入完毕，回调函数关闭SplashScreen。

[cqcn1991]

@lincanbin 可以求教一下"非阻塞式”异步吗？有什么相关的教程可以看？是js的ajax吗？

[lincanbin]

@cqcn1991 在页面加载完毕后，再在网页中插入js和CSS就不会阻塞splashscreen的显示。这跟浏览器渲染的顺序有关。
你可以参考
https://github.com/lincanbin/Carbon-Forum/blob/master/static/js/global.js
里的loadScript函数