1. ホーム
  2. asp.net-mvc-4

[解決済み】@Scripts.Render("~/bundles/jquery")を使用する理由)

2022-04-06 05:59:36

質問

どのように

@Scripts.Render("~/bundles/jquery")

というように、html からスクリプトを参照するのとは異なります。

<script src="~/bundles/jquery.js" type="text/javascript"></script>

パフォーマンスの向上はありますか?

解決方法は?

バンドルとは、複数のJavaScriptやスタイルシートをフォーマットなしで1つのファイルに圧縮することで、帯域とページ読み込みのリクエスト回数を節約します。

例として、独自のバンドルを作成することができます。

bundles.Add(New ScriptBundle("~/bundles/mybundle").Include(
            "~/Resources/Core/Javascripts/jquery-1.7.1.min.js",
            "~/Resources/Core/Javascripts/jquery-ui-1.8.16.min.js",
            "~/Resources/Core/Javascripts/jquery.validate.min.js",
            "~/Resources/Core/Javascripts/jquery.validate.unobtrusive.min.js",
            "~/Resources/Core/Javascripts/jquery.unobtrusive-ajax.min.js",
            "~/Resources/Core/Javascripts/jquery-ui-timepicker-addon.js"))

そして、このようにレンダリングします。

@Scripts.Render("~/bundles/mybundle")

もう一つの利点は @Scripts.Render("~/bundles/mybundle") は、ネイティブの <script src="~/bundles/mybundle" /> は、その @Scripts.Render() を尊重することになります。 web.config デバッグの設定です。

  <system.web>
    <compilation debug="true|false" />

もし debug="true" の場合、各ソーススクリプトの個々のスクリプトタグをレンダリングし、最小化は行いません。

スタイルシートについては、StyleBundle と @Styles.Render() を使用する必要があります。

各スクリプトやスタイルを1回のリクエストで読み込むのではなく(scriptタグやlinkタグで)、すべてのファイルを1つのJavaScriptやスタイルシートのファイルに圧縮してまとめて読み込みます。