Sisu
JavaScripti ülesannete jooksjad, nagu Grunt, on esiotsa arendajate seas ülipopulaarseks muutunud. Seda seetõttu, et need aitavad teha ühte asja, mida me kõik oma töös teha tahame - säästa aega!
Kuid kuna nüüd on saadaval enam kui 5000 (ja loendatav) Grunti pistikprogrammi, võib arendajatel olla raske neid teemante leida. Oleme heitnud pilgu meie ajale, mis Gruntisse takerdub, et leida ideaalne retsept Grunti pistikprogrammidest, mida peaksite kasutama.
01. Uglify
Iga esiotsa arendaja, kes on oma soola väärt, teab JavaScripti failide minimeerimise eelistest ja seda see pistikprogramm täpselt teebki. Selline on selle populaarsus, see on tegelikult lisatud ka Grunti alustamise juhendisse. Hoolimata nimest saab seda pistikprogrammi kasutada ka teie JavaScripti koodi kaunistamiseks - ehkki see pole tootmise jaoks eriti kasulik.
02. Sass
Võib tekkida mõningane arutelu selle üle, milline CSS-i eelprotsessor tegelikult roostet valitseb, kuid siin Stickyeyes oleme leppinud pigem Sassiga kui selle peamise konkurendi Lessiga. See pistikprogramm võimaldab meil kirjutada oma Sassi failid ja lasta need automaatselt CSS-i kompileerida. CSS-i eelprotsessori kasutamise eelised nõuavad eraldi artiklit, kuid võib kindlalt öelda, et kui te seda juba ei kasuta, olete peole väga hilja!
03. CSSMin
See pistikprogramm on Uglify CSS-i ekvivalent. See saab lihtsalt kõik määratud CSS-failid ja minimeerib need. Muidugi, kui kavatsete seda kasutada koos Sassi pistikprogrammiga, peate tagama, et see ülesanne käivitatakse pärast Sassi ülesannet.
CSSMinil on palju alternatiive, mis võivad ka CSS-failide suurust veidi erineva tehnika abil vähendada; CSS-i nano, CSS-i väänamine, CSS-i kahanemine jne. Kui soovite sellist tüüpi asju, lugege seda mugavat võrdlusalust.
04. Concat
Nagu nimigi ütleb, võtab see pistikprogramm lihtsalt mitu faili ja liidab need ühte. Nagu koodide minimeerimise puhul, on ka failide liitmine igivana parim tava lehe laadimisaja vähendamiseks.
Nii JavaScripti kui ka CSS-i tootmisel tuleks alati kasutada failide liitmist. Tavaliselt on see viimane käivitatav ülesanne - pärast CSS-i eeltöötluse ja minimeerimise ülesannet. Sellel pistikprogrammil on lihtne öelda, et kõik konkreetses kataloogis olevad failid liidetaks, kuid hoiduge failide liitmise järjekorrast - peate võib-olla andma kindla järjekorra või nimetama failid, et need oleksid alati liidetud soovitud järjekorras .
05. ImageMin
CSM-i ja Uglify-ga samamoodi tegeleb ImageMin veel ühe igivana lehe laadimise probleemiga - pildifaili suurusega. Kujutise minimeerimine on tavaliselt esimene optimeerimise pöördusport, seega on see pistikprogramm lehe kogufaili võimalikult väikseks vähendamiseks hädavajalik.
Kui töötate JPG, PNG, GIF või SVG-ga (üha populaarsemaks muutuv vektorkujutise formaat), tagab see pistikprogramm piltide failisuuruse kadudeta vähendamise ilma, et peaksite sõrme tõstma. Kui teie projektis on palju pilte, on mõistlik käivitada see ülesanne ainult tootmise poole pöördudes, selle asemel, et seda ülesannet käitada vaatamisüritusel (vt järgmist punkti).
06. Vaata
See pistikprogramm ei mõjuta tegelikult teie veebisaidi kasutajaliidest, kuid on äärmiselt kasulik tõhusa Grunt-protsessi loomisel. Watch hoiab lihtsalt silma peal kõigil teie määratud kataloogidel ja kui midagi muutub, käivitab see automaatselt teatud Grunti ülesanded.
Nii võite oma JavaScripti ülesannete käitamiseks seadistada kataloogis 'js' ühe vaatamistingimuse ja CSS-i ülesannete käitamiseks teise kausta 'css'. See tähendab, et te ei pea kunagi oma peamist Grunt-protsessi käsitsi käitama! Initsialiseerige lihtsalt nurisemiskella ülesanne enne muudatuste tegemist ja võite unustada, et see on isegi olemas.
Sõnad: Jamie Shields
Jamie Shields on digitaalse turunduse agentuuri Stickyeyes tagaosa arendaja.
Nagu nii? Loe seda!
- Grunt vs Gulp: Millise JavaScripti loomise tööriista peaksite valima?
- 8 viisi, kuidas oma Grunti seadistust paremaks muuta
- Parimad tasuta WordPressi teemad
