如何结合MVC捆绑和JS文件的异步加载

时间:2016-09-13 13:01:31

标签: javascript asp.net-mvc bundling-and-minification labjs

我有一个MVC页面,它有许多JavaScript依赖项,我们称之为depend-A和depend-B,其中depend-B依赖于depend-A。这些都包含在MVC中包含在页面中的不同包中。通过Google的pagespeed工具运行后,它建议我们应该异步包含JS以防止渲染阻塞。

由于存在依赖关系,它们需要按特定顺序加载,因此我考虑使用LABJS以正确的顺序异步加载它们以防止渲染阻塞。

这可以通过包含bundle的URL来实现,但是我失去了在开发过程中能够在本地拥有JS文件的调试版本的能力。

有人可以提出解决方法,以便我们可以异步加载JS文件但按顺序加载并在本地维护调试版本吗?

以下是我目前正在使用的内容。

scala> List(1,2,3).traverseU(doubleSmall)
res9: scalaz.\/[String,List[Int]] = \/-(List(2, 4, 6))

包含上述代码的页面源如下。

<script src="~/Scripts/LAB.min.js"></script>
<script>
    $LAB
    .script("@Scripts.Url("~/bundles/jquery")").wait()
    .script("/scripts/fileone.js").wait()
    .script("/scripts/filetwo.js").wait(function() {
        FunctionInFileTwo();
    });
</script>

1 个答案:

答案 0 :(得分:0)

看起来没有任何可用的干净API。

Scripts.Render("~/bundles/yourbundle")返回IHtmlString必需的脚本标记 - 您可以创建一个方法从该字符串中清除脚本srcs并生成正确的$LAB调用。

Scripts.Manager.RenderExplicit(tagFormat, paths)接近,您只需传递一个更好的格式字符串作为第一个参数,但是阅读代码看起来它可能会开始在列表中间逐字地包含不同格式的脚本标记