Sencha Cmd一直以来都支持包的概念,大型应用程序可通过包来封装类、样式和资源,然后通过Sencha Cmd将这些包打包到应用程序中。现在,又有了权限的方式(动态)来使用这些包。
如果现在已经使用了包,那会在应用程序的app.json文件中看到类似于以下的“requires”数组:
requires: [
'dashboard',
'settings',
'users'
]
要切换到动态加载,只需要将部分或全部包移动到“users”数组并在“requires”数组添加以下新的包:
requires: [
'package-loader'
],
uses: [
'dashboard',
'settings',
'users'
]
在做了这些更改后,Sencha Cmd会在生成应用程序时,将应用程序和每个要使用的包生成独立的压缩包。在应用程序加载时,它将只包含自身的代码以及它所要求的包的代码,而不会包含所使用的包的代码。哪些已用包会像JavaScript、CSS或资源文件一样位于应用程序的生成文件夹中。
这样,就可应用程序准备好之后,使用Ext.Package.load()
方法来加载这些包。在加载包时,会加载包所需的JavaScript和CSS等文件并会递归加载所需的包。
如果使用了Ext JS路由,则可以执行以下类似操作来加载包:
routes: {
':type': {
before: 'loadPackage',
action: 'showView'
}
},
loadPackage: function (type, action) {
var view = this.getView(),
pkg = this.getPackageForType(type);
if (!pkg || Ext.Package.isLoaded(pkg)) {
action.resume();
}
else {
view.setMasked({
message: 'Loading Package...'
});
Ext.Package.load(pkg).then(function () {
view.setMasked(null);
action.resume();
});
}
},
使用动态包加载可为你的用户节省时间,他们不再需要等待应用程序的每个字节加,而实际上他们只需要加载大约20%的内容。它还可以为开发人员节省时间,因为Sencha Cmd不再需要加载所有代码来生成“dev”或同时监视所有代码。
有许多新的命令可以用来切换“app build”和“app watch”,以便控制要生成或监视的外部包。这就可让你将生成限制为当前正在使用的包从而缩短生成时间。
在运行sencha应用生成时,可添加--use
选项来生成动态包:
sencha app build production --uses