【求助】用wex5做一个后台管理框架，面页构建极慢的问题

nill

我用wex5做web网站，还有做后台管理框架，是找了一个第三方的框架改造的，有大量第三方的js/css。
经过移植、排查，终于可以运行了。界面完成后应该是这个样子。

基本界面

点击查看“我的同事”，弹出一个隐藏窗口：




这些功能还算正常（不正常的有提示、隐藏窗口的位置，还需要调）

但问题来了，就是在浏览器打开页面时，会有很明显的加载、构建过程，看上去很让人难受，也就是说CSS/JS加载慢上一拍的感觉，如图所示：

出错

求助，这种问题如何解决能？

我试过在modelconstract事件中加载，用先隐藏div再显示的方法，都不起作用。

是不是一定要把引入的js和css写到.w的同名js/css中，才能解决加载慢的问题呢？

还没有做从数据库、配置文件读数据的功能呢，就慢成这样了。怎么解决呢？

nill

这么快沉了，需要有人帮忙啊

闰土

恩，当一个页面，运用太多的框架就会比较卡了，所以使用requireJS的方法，让每个JS块变成一个闭包，性能会提高。所以，请问你的这些JS是通过什么引入到.w文件中的？是require方法么？现在你的意思是不是，就是说，当点击一个功能的时候，这个功能出来的同时，前一个功能还没有关闭掉么？要有一些延迟才可以关闭上一个功能呢

nill

我试试requreJS吧，现在用的是在resources中引用。

nill

事实证明，我用了requireJS以后，效果还是一样的，延迟效果很明显。先加载JS和先加载CSS，效果上感觉不到有什么区别。

        var $ = require("jquery");
        var justep = require("$UI/system/lib/justep");
       
        //加载UI2下的css文件
        require("css!./css/cloud-admin").load();
        require("css!./css/responsive").load();
        require("css!./css/themes/default").load();
        require("css!./font-awesome/css/font-awesome").load();

        //加载JS
        require("./js/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min");
        require("./bootstrap-dist/js/bootstrap.min");
        require("./js/bootstrap-daterangepicker/moment.min");
        require("./js/bootstrap-daterangepicker/daterangepicker.min");
        require("./js/jQuery-slimScroll-1.3.0/jquery.slimscroll.min");
        require("./js/jQuery-slimScroll-1.3.0/slimScrollHorizontal.min");
        require("./js/jQuery-Cookie/jquery.cookie.min");
        require("./js/script");

nill

问题解决了，结贴吧

liangyongfei

nill 发表于 2016-5-10 11:10
问题解决了，结贴吧

希望楼主分享下经验给大家，谢谢！

nill

很简单的，就是控制JS/CSS和.w的加载顺序，先把外部的JS/CSS加载，再加载应用页面。
具体做法，就是像仿淘宝（网易？）那样，做一个主页面（justep.shell），用于加载JS/CSS，再从windowContainer加载应用页面。