4.3 Bundling & Minification | ASP.NET MVC Tutorial

📖 Bundling i Minification (Optimizacija resursa)

Bundling je tehnika spajanja više CSS ili JS fajlova u jedan virtuelni fajl, smanjujući time broj zasebnih HTTP zahtjeva prema serveru.

Minification (Minifikacija) je proces uklanjanja nepotrebnih karaktera (kao što su razmaci, prelasci u novi red i komentari) iz izvornog koda bez uticaja na njegovu funkcionalnost, čime se drastično smanjuje veličina fajla koju klijent preuzima.

🔑 Zašto je ovo bitno za Javnu Upravu?

Mnoge institucije koriste računarske mreže sa ograničenom propusnošću (bandwidth), ili im se pristupa sa starijih računara iz udaljenih općina. Slanje 15 različitih CSS fajlova zahtijeva 15 TCP konekcija, što može blokirati rendering stranice. Spajanjem resursa u 2-3 paketa poboljšava se vrijeme učitavanja aplikacije i do 40%.

⚙️ BundleConfig Konfiguracija

Konfiguracija se vrši unutar fajla App_Start/BundleConfig.cs. Uključujemo fizičke fajlove u jedan virtualni URL (nazvan Bundle).

🛠️ BundleConfig.cs

public class BundleConfig
{
    public static void RegisterBundles(BundleCollection bundles)
    {
        // Javni portal stilovi (Glavni CSS paket)
        bundles.Add(new StyleBundle("~/Content/public-css").Include(
                  "~/Content/bootstrap.css",      // Standardni framework
                  "~/Content/public-theme.css",   // E-Uprava tema
                  "~/Content/site.css"));         // Naš prilagođeni CSS

        // Admin panel stilovi (Učitavaju se samo za administratore)
        bundles.Add(new StyleBundle("~/Content/admin-css").Include(
                  "~/Content/bootstrap.css",
                  "~/Content/admin-theme.css",
                  "~/Content/dashboard.css"));

        // jQuery i Validaciske skripte
        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js")); // {version} automatski hvata trenutnu verziju

        // Forsiranje optimizacije čak i u Debug modu (obično se izvršava samo u Release modu)
        BundleTable.EnableOptimizations = true; 
    }
}

📦 Korištenje Bundle-a i Cache Busting (v=Hash)

Dohvatanje navedenih resursa unutar aplikacije odvija se preko ugrađenih HTML Helper metoda (Styles.Render i Scripts.Render). Kada ASP.NET generiše HTML, automatski dodaje jedinstvenu oznaku vezanu za verziju fajla (zvanu Hash), naprimjer: /Content/public-css?v=Xr3wdsX9....

Ovaj "Cache Busting" je sjajan alat; ukoliko vi ažurirate JS fajl na serveru uprave u 3h ujutro, ASP.NET mijenja Hash i forsira browser svakog građanina da ponovno dohvati novu verziju fajla umjesto da koristi eventualno pogrešnu staru keširanu verziju.

🛠️ U Layout-u

@* U _AdminLayout.cshtml *@
@Styles.Render("~/Content/admin-css")
@Scripts.Render("~/bundles/jquery")

✅ Zaključak

Korištenjem Bundling i Minification tehnika u institucijama javne uprave smanjujemo broj mrežnih zahtjeva, štedimo bandwidth te osiguravamo da velike količine skripti i stilova ne usporavaju portale na lošim vezama. Dodatno, automatsko heširanje URL-ova osigurava da korisnici uvijek dobijaju najnoviju verziju koda pri ažuriranju servera.

← Prethodna Lekcija Sljedeći Modul →