zoukankan      html  css  js  c++  java
  • 代码性能优化-----前端页面异步实现

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

    将页面每个数据源对应一个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);
            }    
  • 相关阅读:
    hdu1010 Tempter of the Bone(深搜+剪枝问题)
    08-Objective-C特有语法:@property、@synthesize
    Servlet的Response.setContentLength无效
    Java Future
    android一些若干回调测试
    那些有趣的Webview细节
    androidlog日志之 Klog (StackTraceElement)
    曾几何时遇到的bug(viewpager+fragment)
    Android acache读后感
    11-8 定时器this
  • 原文地址:https://www.cnblogs.com/panpanwelcome/p/6213882.html
Copyright © 2011-2022 走看看