为了提高性能,怎样动态载入JS文件

超级表格是一款多人协作的在线表格。程序相当复杂,用到十几个JS文件。

可是有些文件是在打开某些类型的表格时才须要载入。

比如,仅仅有当打开甘特图表格时,才须要载入gantetu.js文件。

那么问题来了,为了降低js文件数量和请求,怎样在须要时自己主动载入js文件呢?


办法例如以下。

//动态载入js文件
function mcss_importJS(js)
{
var oHead = document.getElementsByTagName('HEAD').item(0);
var oScript= document.createElement("script");
oScript.type = "text/javascript";
oScript.id=filename;
oScript.src=js;
oHead.appendChild( oScript);
}


假设就这样了,还不完美。由于这是动态异步载入的。超级表格程序中。在运行这种方法后立即会运行js文件里的类。

代码例如以下:

mcss_importJS(“allFile/js/gantetu.js");

var gantetu=new Gantetu();

有时候由于网络或性能原因,会报错“Gantetu对象不存在”。

我原来的处理方法是提示用户手动又一次载入。例如以下图:



这样的处理方式太LOW了。

近期我找到了解决的方法。就是自己主动又一次载入。代码例如以下:


代码解释:

假设对象为空。就在1秒后又一次载入。

最多载入5次。

效果是,基本都在自己主动载入1次后就能正常打开,并且用户基本感觉不到。


整个过程给我启示是:原来的粗暴办法持续了一年。我似乎也没办法。可是就是刚才。我花了半小时,攻克了支持了一年的bug。


假设想看真实代码,按以下步骤能够找到:

1、打开beta.chaojibiaoge.com

2、单击“新建》项目甘特图”

3、用Chrome或火狐浏览器的调试页面,找到main.js文件的951行代码開始。


原文地址:https://www.cnblogs.com/zsychanpin/p/7137787.html