js改为多线程异步下载,按顺序执行!

This commit is contained in:
liteng 2018-12-20 19:55:35 +08:00
parent 7cc4ed3ddf
commit 4892fc3936
5 changed files with 67 additions and 110 deletions

View File

@ -81,19 +81,19 @@ function Application(container, options) {
flexDirection: 'column'
},
children: [{
xtype: 'div',
style: {
position: 'relative',
flex: 1
xtype: 'div',
style: {
position: 'relative',
flex: 1
},
children: [
this.viewport,
this.script,
this.player
]
},
children: [
this.viewport,
this.script,
this.player
]
},
this.bottomPanel,
this.statusBar
this.bottomPanel,
this.statusBar
]
},
this.sidebar2,
@ -110,6 +110,9 @@ function Application(container, options) {
// Html5 Worker
// var script = document.querySelector('script[src$="ShadowEditor.js" i]').src; // http://localhost:2000/dist/ShadowEditor.js
// this.worker = new Worker(script);
var eval2 = eval;
this.a = eval2('var a = 3');
}
// ------------------------- 程序控制 -------------------------------

View File

@ -15,9 +15,8 @@ function PackageManager() {
/**
* 加载包
* @param {*} names 包名或包名列表
* @param {*} sort 资源是否按顺序下载
*/
PackageManager.prototype.require = function (names, sort = false) {
PackageManager.prototype.require = function (names) {
names = Array.isArray(names) ? names : [names];
var assets = [];
@ -47,42 +46,32 @@ PackageManager.prototype.require = function (names, sort = false) {
});
}
return this._load(assets, sort);
return this._load(assets);
};
PackageManager.prototype._load = async function (assets = [], sort = false) {
PackageManager.prototype._load = function (assets = []) {
var cssLoader = new CssLoader();
var jsLoader = new JsLoader();
if (sort) {
assets.forEach(async n => {
if (n.toLowerCase().endsWith('.css')) {
await cssLoader.load(n);
} else if (n.toLowerCase().endsWith('.js')) {
await jsLoader.load(n);
} else {
console.warn(`PackageManager: 未知资源类型${n}`);
}
});
} else {
var promises = assets.map(n => {
var promises = assets.map(n => {
if (n.toLowerCase().endsWith('.css')) {
return cssLoader.load(n);
} else if (n.toLowerCase().endsWith('.js')) {
return jsLoader.load(n);
} else {
console.warn(`PackageManager: 未知资源类型${n}`);
return new Promise(resolve => {
if (n.toLowerCase().endsWith('.css')) {
cssLoader.load(n).then(() => {
resolve();
});
} else if (n.toLowerCase().endsWith('.js')) {
jsLoader.load(n).then(() => {
resolve();
});
} else {
console.warn(`PackageManager: 未知资源类型${n}`);
resolve();
}
resolve();
});
}
});
return new Promise(resolve => {
Promise.all(promises).then(() => {
jsLoader.eval();
resolve();
});
await Promise.all(promises);
}
});
};
export default PackageManager;

View File

@ -1,22 +0,0 @@
/**
* 异步加载css文件
* @author tengge / https://github.com/tengge1
* @param {*} url css文件url
*/
function loadCss(url) {
var head = document.getElementsByTagName('head')[0];
var link = document.createElement('link');
link.type = 'text/css';
link.rel = 'stylesheet';
link.href = url;
head.appendChild(link);
};
/**
* css工具类
*/
const CssUtils = {
load: loadCss
};
export default CssUtils;

View File

@ -3,27 +3,44 @@
* @author tengge / https://github.com/tengge1
*/
function JsLoader() {
this.assets = [];
};
JsLoader.prototype.load = function (url) {
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = url;
head.appendChild(script);
var data = {
url,
script: null
};
this.assets.push(data);
return new Promise(resolve => {
script.onload = event => {
console.log(script.src);
script.onload = script.onerror = null;
resolve(script);
};
script.onerror = event => {
script.onload = script.onerror = null;
console.warn(`JsLoader: ${url}加载失败!`);
fetch(url).then(response => {
if (response.ok) {
response.text().then(text => {
data.script = text;
resolve(data);
});
} else {
console.warn(`JsLoader: ${url}下载失败!。`);
resolve(null);
}
}).catch(() => {
console.warn(`JsLoader: ${url}下载出错!。`);
resolve(null);
};
});
});
};
JsLoader.prototype.eval = function () {
var eval2 = eval;
this.assets.forEach(n => {
if (n.script) {
try {
eval2(n.script);
} catch (e) {
console.warn(`JsLoader: ${n.url}解析出错!`);
}
}
});
};

View File

@ -1,30 +0,0 @@
/**
* 异步加载js文件
* @author tengge / https://github.com/tengge1
* @param {*} url js文件url
* @param {*} callback 回调函数
*/
function loadJs(url, callback) {
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = url;
head.appendChild(script);
if (typeof (callback) === 'function') {
script.onload = script.onreadystatechange = function () {
if (!this.readyState || this.readyState === "loaded" || this.readyState === "complete") {
callback();
script.onload = script.onreadystatechange = null;
}
};
}
};
/**
* js工具类
*/
const JsUtils = {
load: loadJs
};
export default JsUtils;