☰

@Scripts.Render("~/bundles/jquery") を使用する理由 質問する

tag-icon • tag-icon asp.net-mvc-4 asp.net-optimization
@Scripts.Render(

どうやって

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

このようにHTMLからスクリプトを参照するだけとは異なります

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

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

ベストアンサー1

バンドルとは、複数の 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")ネイティブに対する のもう1 つの利点は、デバッグ設定を尊重する<script src="~/bundles/mybundle" />ことです。@Scripts.Render()web.config

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

その場合はdebug="true"、縮小せずに、ソース スクリプトごとに個別のスクリプト タグをレンダリングします。

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

各スクリプトまたはスタイルを単一のリクエスト (スクリプトまたはリンク タグを使用) で読み込む代わりに、すべてのファイルが 1 つの JavaScript またはスタイルシート ファイルに圧縮され、一緒に読み込まれます。

おすすめ記事