非常技术性 - Modal需要时间来加载。如何减少加载时间?

时间:2015-07-31 17:22:10

标签: javascript jquery performance modal-dialog

我有一个带有span"点击打开对话框"的文件。它以模态视图打开网页。该网页在下面的网址部分中提到 var perlURL="..../cgi-bin/test/web_editor.pl";

请注意,它是一个包含网格数据的perl文件。所以很多javascripts和数据。

我的查询是 - 当我点击对话框"点击打开对话框"时,大约需要7分钟将整个perl文件加载到模态中。

任何人都可以分享如何减少加载时间。如果我使用基本的html文件,它会立即加载。但是这个1200行代码的perl文件,在模态中加载需要7秒。请详细说明如何在这里改善装载时间。

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <script type='text/javascript' src='http://code.jquery.com/jquery-1.7.1.js'></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css">

    <script>
      $(function() {
        var dialogW = 1130;
        var dialogH = 700;

        $( "#dialog" ).dialog({
          autoOpen: false,
          modal: true,
          title: '',
          width: dialogW,
          height:dialogH,
          draggable: true,
          resizable: true
        });

        $( "#opener" ).click(function() {
          $("#dialog").html("<span>Loading...</span>").dialog("open");
          var perlURL=".../test/web_editor.pl";
          $("#dialog").load(perlURL);
        });
      });
    </script>
  </head>

  <body>
    <span style="cursor:pointer" id="opener" >Click to Open Dialog </span>
    <div id="dialog" title="">  </div>
  </body>
</html>

1 个答案:

答案 0 :(得分:0)

打开你的Perl代码,在模态外单独运行并确定那里的加载时间。很可能它在Perl代码中表现不佳,并且根据您上面的详细信息,我将从对读取数据的数据源的调用开始。可能是读取数据或网络性能的脚本中的性能不佳。