Šis raksts jūs iepazīstinās ar tēmu, kas pazīstama kā Minify In un procesā arī sniedz jums detalizētu praktisku demonstrāciju. Šajā rakstā tiks apskatīti šādi norādījumi,
kā padarīt failu Java
- Kas ir minifikācija?
- Kāpēc nepieciešama minifikācija?
- Kā samazināt CSS, JS, HTML kodu?
- Kad jums tas jādara?
- Minifikācijas ieguvumi?
Tā kā nosaukums mūs diezgan labi liek domāt, samazināšana ir saistīta ar faila lieluma samazināšanu. Kodu bāzē mums ir tiesības minimizēt HTML, CSS vai Javascript failus. Šeit mēs apspriedīsim par CSS faila samazināšanu.
Kad izstrādātājs kodē, viņš / viņa pārliecinās, ka kods ir vislabākajā lasāmā formātā, lai vienkāršotu turpmāko izmaiņu procesu. Tātad mainīgo nosaukumi ir viegli saprotamā formātā un aizņem daudz rakstzīmju. Tad viņi arī pievieno labu tukšo atstarpju daudzumu, lai padarītu to pietiekami lasāmu.
Bet visā procesā mums ir tendence atraisīt virknes, kuras palielina mūsu faila lielums, kas savukārt palielina vietnes ielādes laiku. Jo īpaši ar vietnēm, kurās ir daudz funkciju un papildinājumu, garāka kodu bāze tikai pasliktina vietni.
Google tik un tā ir ierobežotā formātā, lai ranžētu vietnes savā meklēšanas lapā, pamatojoties uz optimālo lietotāju pieredzi, ko vietnes nodrošina. Jo labāk jūsu vietne tiek ielādēta, jo labāk jūsu vietne ierindojas meklēšanas lapā.
Tā kā ir apdraudēta tik daudz, jūs nevēlaties, lai jūsu lietotāji cieš no sliktā vietnes ielādes laika, un pāriet uz nākamo. Tāpēc koda saspiešana ir ārkārtīgi svarīga.
Patiesībā, veidojot vietni, mēs zinām, kas sastāv no maksimālās kodu bāzes?
Tas viss ir par CSS, HTML un Javascript. Šodien notiekošais konkurss, lai padarītu jūsu vietni vizuāli pievilcīgu, CSS failā ļoti izceļ un neapzinoties, ka mēs izmantojam mūsu vietni ar lielo kodu.
Ieejas, minifikācija ..
Turpinot šo rakstu par CSS samazināšanu
Kas ir minifikācija ?
Minimizēšana ļauj noņemt kodu līdz minimālam faila lielumam, kas kodu neietekmē un tomēr samazina faila lielumu. Šajā procesā varat noņemt nevajadzīgos atstarpes un rakstzīmes, kas nekur neietekmē jūsu vietnes oriģinalitāti. No koda ir jāizvairās no dažām lietām:
- Atstarpes rakstzīmes
- Jaunas līnijas rakstzīmes
- Bloķēt atdalītājus
- Komentāri
- Mainīgo nosaukumu saīsināšana
Šie faktori nav iesaistīti, lai jūsu vietne darbotos, bet tikai padara failu smagāku un palielina vietnes ielādes laiku.
Kodu lasāmība pilnībā izslēdz to, ko mašīna saprot. Tīmekļa pārlūkprogrammai nav nepieciešama papildu atstarpe starp rakstzīmēm, lai tās saprastu un palaistu. Tātad, mēģiniet tos samazināt un samazināt CSS un HTML kodu.
Ņemsim piemēru:
#myContent {font-family: Montserrat} #myContent {font-size: 90%}Samazināt manu CSS
Gandrīz 48% atšķirība sākotnējā un sasvērtajā failā. Samazināts ar 178 baitiem. Pēc samazināšanas
#myContent {font-family: Arialfont-size: 90%}Sveika pasaule!
Turpinot šo rakstu par CSS samazināšanu
Kāpēc ir minifikācija vajadzīgs?
Lai uzlabotu vietnes ielādes laiku. Nevienam nepatīk gaidīt vietnes ielādi atbilstoši ērtībai. Tā kā ir pieejams tik daudz iespēju, cilvēki mēdz pāriet uz citu. Tātad, labāk ir samazināt faila lielumu.
Turpinot šo rakstu par CSS samazināšanu
Kā tu mazināt CSS, JS, HTML kods?
Lai samazinātu, tiešsaistē ir pieejams daudz rīku skaits, kas var palīdzēt samazināt kodu bāzi. Varat arī izvēlēties to darīt manuāli, taču lielākai kodu bāzei ieteicams izmantot jebkuru no šiem rīkiem, lai samazinātu CSS failu:
CSSminifier.com: ārkārtīgi vienkāršs izmantojams rīks. Vienkārši nokopējiet kodu kreisajā pusē, ģenerējiet saspiesto failu un lejupielādējiet to. Minimizētajam failam būs paplašinājums .min.
Jūsu saspiestajam CSS failam būs paplašinājums demo.min.css.
Smallseotools.com: vai nu kopējiet kodu, vai augšupielādējiet koda failu. Tas samazinās jūsu kodu un ļaus to kopēt vai lejupielādēt.
Autoptimize: Šis ir spraudnis, kuru varat pievienot saviem WordPress rīkiem. Kā spraudni jūs varat izvēlēties samazināt CSS kodu tad un tur.
Izstrādātājam ir vieglāk saprast, kad fails ir minificēts un kad nē. Minimizēta faila paplašinājums būs .min.
Turpinot šo rakstu par CSS samazināšanu
Kad jums tas jādara?
Minimizēšana jāveic galvenokārt tad, kad esat uzrakstījis kodu un jānosūta tas uz serveri, lai saņemtu atbildi. Kad faili ir samazināti, saspiestās versijas tiek izmantotas izplatīšanai lietotājiem.
Ieguvumi no minifikācija ?
Faila lieluma samazināšana: noņemot papildu atstarpes, samazinot mainīgo nosaukumus un noņemot komentārus, faila lielums gandrīz tiek samazināts par 30–60%. Ātrāka ielāde: Tā kā tīklā ir mazāk datu, vietne tiek ielādēta ātrāk nekā iepriekš. Zemākas joslas platuma izmaksas: noņemot nevajadzīgos datus, nepieciešamais joslas platums ir daudz mazāks, tāpat arī izmaksas.
Kas jāatceras:
Pat pirms mēģināšanas sasmalcināt, pārliecinieties, vai kods nepārkāpj robežas. Plūsmai nevajadzētu traucēt, un funkcionalitātei vajadzētu palikt bez sejas. Jums jāpārbauda, vai pat pēc sasmalcināšanas kods darbojas līdzīgi.
Patiesībā, kā labāko praksi, jūs vienmēr varat saglabāt gatavu veidni. Veiciet izmaiņas iebūvētajā veidnē, kas ietaupīs jums daudz laika.
Vai tas ir līdzīgs saspiešanai?
Nu, stipri NĒ. minifikācija atšķiras no saspiešanas. Saspiešana ļauj saspiestu failu samazināt vairāk, bet neietekmē koda stilu un struktūru.
Fails tiek saspiests un pēc tam saspiests kā zip un nosūtīts pa tīklu, kad klients pieprasa piekļuvi vietnei. Pēc tam fails tiek nesaspiests un izmantots.
Piemēri:
Pirms samazināšanas:
Portfelis
- Mājas
Pēc samazināšanas:
Portfelis
- Mājas
Kods cilvēkam noteikti ir grūtāk lasāms un saprotams, bet mašīnai tas ir tikpat ticams. Mašīnai nav īstas nozīmes koda skaistumam un atstarpēm, tā saprot būtību un atbilstoši darbojas.
Pietiekami pārsteidza minifikācijas tehnika?
Tad mēģiniet pats. Samaziniet faila slogu un ļaujiet savai vietnei brīvi plūst visiem lietotājiem!
Tas mūs noved pie šī raksta par Minify In CSS beigām.
Ja vēlaties uzzināt vairāk par tīmekļa izstrādi, skatiet vietni autore Edureka. Tīmekļa attīstības sertifikācijas apmācība palīdzēs jums uzzināt, kā izveidot iespaidīgas vietnes, izmantojot HTML5, CSS3, Twitter Bootstrap 3, jQuery un Google API, un izvietot to Amazon Simple Storage Service (S3).
Ja jūs joprojām interesējat, ja jums ir kādi jautājumi, varat tos ievietot šī “Minify In CSS” emuāra komentāru sadaļā, un mēs pēc iespējas ātrāk sazināsimies ar jums.