代码性能优化-----前端页面异步实现

对于页面数据较多，数据来源不一（接口、数据库），导致的页面加载缓慢，可以使用异步来实现页面的快速加载。

将页面每个数据源对应一个div，默认隐藏，当进入页面开始执行此div的数据获取，获取完成后给页面赋值，并显示此div

js代码，异步获取示例：

        $(function () {
            //页面读取数据太多，采取异步读取的方式
            headPartDetail();//1
            recordInfoPartDetail();//2
            redbagRecordPartDetail();//3
            redbagReceiveRankDetail();//4
            RedBagMoneyRankDetail();//5
            RedBagTuHaoRankDetail();//6
        });


        function headPartDetail() {
            var url = "@(Config.HostUrl)redbaghall/GetRedBagHallBaseInfo";
            $.getJSON(url, function (data) {
                headPartDetailShow(data);
                $('.head').show();
                $(".hbInfo").show();
            });
        }

        function headPartDetailShow(data) {
            $("#TodayRecv").text(data.TodayRecv);
            $("#TotalRecv").text(data.TotalRecv);
            $("#TotalDspl").text(data.TotalDspl);
            $("#MaxRedBagMoney").text(data.MaxRedBagMoney);
            $("#RestRedBagMoneyDspl").text(data.RestRedBagMoneyDspl);
        }

后端c#实现代码：

        public ActionResult GetRedBagHallBaseInfo()
        {
            #region json返回定义
            var outModel = new HeadPartDetail();
            #endregion

            #region 获取返回数据
            //……
            #endregion

            return Json(outModel, JsonRequestBehavior.AllowGet);
        }