例如,我创建了一些自定义 UI 组件,一些依赖jquery-min.js
,一些依赖jQuery UI
,一些依赖jsTree
,一些依赖Dojo
等。
我可以在每个 xhtml 文件中导入所需的库:
file1.xhtml
<script src="jquery-min.js"></script>
<script src="jquery-ui.js"></script>
<script src="jsTree.js"></script>
<my:tree> ... </my:tree>
file2.xhtml
<script src="jquery-min.js"></script>
<script src="jquery-ui.js"></script>
<script src="jquery-ui-dialog.js"></script>
<script src="jquery-ui-autocompletion.js"></script>
<my:autodialog> ... </my:autodialog>
file3.xhtml
<script src="jquery-min.js"></script>
<script src="dojo.js"></script>
<my:dojostuff> ... </my:dojostuff>
这很不方便,我必须知道哪个组件依赖哪个库,以及依赖项的依赖关系。
把所有的依赖都放到模板文件里肯定会更简单,但是会加载太多的脚本,占用手机内存。
那么,有没有像“UIAutoOrganizedScriptsComponent”这样的东西?
我应该使用像请求范围的哈希集这样的东西,它包含由当前请求中使用的组件填充的依赖项,像这样?
static ThreadLocal<HashSet> requestScopedDependencies;
static Map<String, URL> libraryURLs;
MyTreeComponent extends UIOutput {
// ...
dependencies = requestScopeDependencies.get();
dependencies.add("jstree");
}
或者,也许我应该搜索组件 DOM 以找出可以注入 <script> 的位置?像这样:
MyTreeComponent extends UIOutput {
// ...
UIComponent scriptsContainer = getParent().getParent().getChildren()[2].getChildren()[3];
// search if scriptsContainer already included the script...
if (! included) {
scriptsContainer.addElement("<script>...");
}
}
嗯,很笨拙。有什么优雅的解决方案可以做到这一点吗?