@ Scripts.Render'ı neden kullanmalısınız (“~ / bundles / jquery”)


Yanıtlar:


288

Paketleme, bant genişliğini ve bir sayfayı yüklemek için istek sayısını kaydetmek için tek bir dosyada herhangi bir biçimlendirme (küçültülmüş olarak da adlandırılır) olmadan birkaç JavaScript veya stil sayfası dosyasını sıkıştırmakla ilgilidir.

Örneğin kendi paketinizi oluşturabilirsiniz:

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"))

Ve şu şekilde render edin:

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

Bir daha avantaj @Scripts.Render("~/bundles/mybundle")yerli üzerinde <script src="~/bundles/mybundle" />DİR @Scripts.Render()saygı göstereceğiz web.configayıklama ayarı:

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

Eğer debug="true"öyleyse, bunun yerine, herhangi bir küçültme olmaksızın, her kaynak komut dosyası için ayrı komut dosyası etiketleri oluşturur.

Stil sayfaları için bir StyleBundle ve @ Styles.Render () kullanmanız gerekir.

Her komut dosyasını veya stili tek bir istekle (komut dosyası veya bağlantı etiketleriyle) yüklemek yerine, tüm dosyalar tek bir JavaScript veya stil sayfası dosyasına sıkıştırılır ve birlikte yüklenir.


9
Sadece merak ediyorum: bu paket için bir yerde saklanan bir dosya var mı yoksa sadece bellekte var mı?
Elliot

15
Önbellekte saklanır.
NicoJuicy

4
CDN kullanılamıyorsa otomatik olarak bir CDN kullanacak ve yerel komut dosyalarına geri dönülecek şekilde de ayarlanabilir. Oldukça kaygan.
Dan Esparza

39
Bunu yapmanın ek bir yararı vardır. Hata ayıklama sırasında, Scripts.Render her dosyayı ayrıştırılmış olarak gönderir, bu da yerel gelişimi çok daha az acıya neden olur, ancak canlı bir ortamda, bu, yukarıda açıklandığı gibi performans kazançlarına yol açabilecek paketlenmiş / minimize edilmiş bir sonuç verir. herhangi bir kodu değiştirme.
Sethcran

9
MVC4 (Visual Studio) "temel" şablonunda, demetleri "BundleConfig.cs" (App_Start klasörü) içinde hazırlanır.
Apolo

51

Ayrıca kullanabilirsiniz:

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

Karakter Seti, Tür vb. Kullanmanız gereken bir senaryoda çıktınızın biçimini belirtmek için.


3
Gereksinim modüllerinin yüklenmesi için de çok kullanışlıdır
Phil

13
... veya özelliği eklemek için async.
Christoph Fink

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

1
... veya crossorigin = "anonim" özelliğini eklemek için
Alexandre Swioklo
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.