web-dev-qa-db-ja.com

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

どうやって

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

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

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

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

213
Tom Squires

バンドリングとは、バンド幅とページを読み込む要求の数を節約するために、フォーマットなしで(縮小とも呼ばれる)複数の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")

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

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

debug="true"であれば、縮小せずに、代わりに各ソーススクリプトの個々のスクリプトタグをレンダリングします。

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

各スクリプトまたはスタイルを単一のリクエスト(scriptまたはlinkタグ付き)でロードする代わりに、すべてのファイルが単一のJavaScriptまたはスタイルシートファイルに圧縮されて一緒にロードされます。

281
yan.kun

また使用することができます:

@Scripts.RenderFormat("<script type=\"text/javascript\" src=\"{0}\"></script>", "~/bundles/mybundle")

Charset、Typeなどを使用する必要があるシナリオで出力のフォーマットを指定する。

51
Termato