Bundling and Minifying Inline Css and Js
اندازه‌ی قلم متن
تخمین مدت زمان مطالعه‌ی مطلب: یک دقیقه

افزایش Performance یک سایت از موارد بسیار مهمی است که هر برنامه نویسی باید به آن توجه ویژه‌ای داشته باشد و در این زمینه لینک Best Practices می‌تواند بسیار کاربردی باشد. 
حال در این پست قصد داریم Style‌ها و Js‌های نوشته شده در سطح هر View را با Bundling and Minifying در Asp.Net MVC 4 بهینه نماییم .
در ابتدا با استفاده از  Nuget پکیج BundleMinifyInlineJsCss  را به پروژه MVC خود مطابق شکل زیر اضافه می‌نماییم .  

در مرحله بعدی کلاسی را با نام BundleMinifyingInlineCssJSAttribute ایجاد کرده و با ارث بردن از کلاس ActionFilterAttribute متد OnActionExecuting را override می‌نماییم . اکنون کلاس ما به شکل زیر است :
using System.Web;
using System.Web.Mvc;
using BundlingAndMinifyingInlineCssJs.ResponseFilters;
namespace UILayer.Filters
{
    public class BundleMinifyingInlineCssJSAttribute : ActionFilterAttribute
    {
        public override void OnActionExecuting(ActionExecutingContext filterContext)
        {
            filterContext.HttpContext.Response.Filter = new BundleAndMinifyResponseFilter(filterContext.HttpContext.Response.Filter);
        }
    }
}
و برای استفاده می‌توانیم بالای کنترلر خود کد زیر را اضافه نماییم .
[BundleMinifyingInlineCssJS]
    public partial class HomeController : Controller
    {
}
در ادامه پروژه را اجرا می‌کنیم. Style‌ها و Js‌های نوشته شده در سطح هر View به صورت زیر در می‌آیند.

  • #
    ‫۱۱ سال و ۴ ماه قبل، جمعه ۲۴ خرداد ۱۳۹۲، ساعت ۱۵:۵۶

    با تشکر از این نکته جدید.

    به نظر من اگر فشرده سازی Response فعال باشه اصلا نیازی به حذف فواصل خالی در HTML نهایی نیست. چون حداقل کاری رو که الگوریتم‌های فشرده سازی خوب انجام می‌دن، مدیریت فضاهای خالی است.

    شاید بد نباشه به صورت یک کار تحقیقی بررسی بشه که اگر فشرده سازی رو فعال کردیم چند درصد روی حجم دریافتی تاثیر داره. اگر روش حذف فضاهای خالی رو بدون فشرده سازی اعمال کردیم، چند درصد فرقش هست.

    • #
      ‫۱۱ سال و ۴ ماه قبل، شنبه ۲۵ خرداد ۱۳۹۲، ساعت ۱۲:۲۹
      با سلام 
      دقیقا این همین کاریه که دارم آزمایش می‌کنم بعد از جمع آوری داده‌ها به اشتراک می‌زارم 
    • #
      ‫۱۱ سال و ۳ ماه قبل، پنجشنبه ۲۷ تیر ۱۳۹۲، ساعت ۲۲:۰۲
      با سلام. نحوه فشرده سازی response به چه صورت است؟ با تشکر.
  • #
    ‫۱۱ سال و ۲ ماه قبل، جمعه ۲۸ تیر ۱۳۹۲، ساعت ۱۷:۲۷
    سلام ، مرسی از مطالب خوبتون
    بحث Optimization در لینک زیر کاملتر بررسی شده، البته مطلب شما برایم تازگی داشت.
    http://go.microsoft.com/fwlink/?LinkId=254725

    نکاتی که میشه گفت
    در وب فرم هم قابل استفاده است
    برای single download کردن فایل‌های css و js دو روش وجود دارد:
    1. تنظیم debug=false در بخش compilation در فایل Web.config
    2. نوشتن کد زیر در کلاسی که باندل‌های خود را در bundleTable درج می‌کنید.
    BundleTable.EnableOptimizations = true
    برای نصب آن با NuGet Package، در کنسول عبارت زیر را وارد کنید
     install-package Microsoft.AspNet.Web.Optimization
    که با نصب آن، 4 کتابخانه به reference‌های پروژه اضافه می‌شود.
    تفاوتی که در script‌ها ایجاد می‌کند می‌توان به حذف کردن description ها، تغییر در variable‌ها ، و min کردن js‌های شما اشاره کرد.
    موفق باشید.