Kas čia? Šio puslapio pagalba gali išsaugoti įrašą tolimesniam naudojimui, arba parodyti savo draugams per socialinius tinklus. Pranešimą apie įrašą galima nusiųsti ir el. paštu.

Kur norite publikuoti?

Nusiųsk draugui el. paštu

E-mail It
2011-11-28

SquishIt - JavaScript ir CSS failų apjungimas bei minifikavimas

Publikuota: ASP.NET

Web aplikacijų optimizavimas yra sudėtingas ir kompleksiškas uždavinys. Egzistuoja nemažai patarimų nuo ko pradėti ir ką daryti. Dalį tokių patarimų aš vaizdžiai pademonstravau savo pristatymo metu TechDay 2011. Tarp rodytų technikų buvo ir daugeliui Web programuotojų gerai žinomas JavaScript ir CSS failų kombinavimas bei minifikavimas. Failų kombinavimas leidžia ženkliai sumažinti naršyklės užklausų skaičių, o failų minifikavimas sumažina siunčiamo failo dydį (dažnai apie 30%).

ASP.NET 4.5 turės šį funkcionalumą prieinamą iš dežutės, bet ką daryti esamiems ASP.NET ir ASP.NET MVC programuotojams? Norėčiau rekomenduoti biblioteką SquishIt. Ji palaiko ne tik grynuosius JavaScript bei CSS failus, bet ir JavaScript kalbą CoffeeScript bei CSS kalbą less. Pažymėtina, SquishIt palaiko iš karto kelias trečių šalių suspaudimo bibliotekas: Microsoft Ajax Minifier, Yahoo YUI Compressor, Google Closure ir pan.

Žemiau pateiksiu kodą, kurį naudoju Lietuvos .NET vartotojų grupės mobilioje apklausoje:

<%= SquishIt.Framework.Bundle.Css()
    .Add("~/Content/jquery.mobile.structure-1.0.css")
    .Add("~/Content/jquery.mobile-1.0.css")
    .Add("~/Content/style.css")
    .Render("~/Content/styles_#.min.css")%>

<%= SquishIt.Framework.Bundle.JavaScript()
    .Add("~/Scripts/jquery-1.6.4.js")
    .Add("~/Scripts/jQuery.tmpl.js")
    .Add("~/Scripts/init.js")
    .Add("~/Scripts/jquery.mobile-1.0.js")
    .Add("~/Scripts/jquery.cookie.js")
    .Add("~/Scripts/json2.js")
    .Add("~/Scripts/functions.js")
    .Render("~/Scripts/scripts_#.min.js")%>

Kaip matote, rezultatas bus išsaugotas failuose styles_#.min.css ir scripts_#.min.js, kur vietoje # bus galutinio failo MD5 hashas. ASP.NET MVC atveju užtenka <%= … %> pakeisti į @Html.Raw(…).

Patiko (0)


Atgal į: SquishIt - JavaScript ir CSS failų apjungimas bei minifikavimas