nl.hideout-lastation.com
Paradijs Voor Ontwerpers En Ontwikkelaars


The Battle Of Build Scripts: Gulp versus grunt

Ik heb al geschreven over hoe je met Gulp aan de slag kunt en hoe je aan de slag kunt met Grunt. Ze automatiseren allebei onze taken, ze gebruiken beiden Node en ze vereisen beide dat je taken maakt en plug-ins van een soort installeert . Maar vraag je je af over het verschil tussen de twee, of zelfs, wat is beter?

In dit artikel zal ik me vooral richten op de verschillen tussen deze twee projecten, die ertoe kunnen bijdragen dat jij kunt beslissen welke van de twee je misschien beter voor jezelf vindt. Ik zal een code gebruiken die misschien onbekend is. Als dat zo is, raad ik aan de twee eerder gepubliceerde artikelen te lezen voordat je begint.

Meer over Hongkiat.com

  • Hoe aan de slag te gaan met Gulp
  • Hoe aan de slag te gaan met Grunt

Snelheid

Het grootste verschil tussen Gulp en Grunt ligt in de manier waarop ze intern omgaan met hun automatiseringstaken . Gulp gebruikt knooppuntstreams terwijl Grunt tijdelijke bestanden gebruikt. Laten we dat gewoon in het Engels vertalen, nietwaar?

Stel dat u de SASS-code voor uw project wilt schrijven. Je zou je SASS-code willen compileren en deze dan misschien verkleinen.

Grunt behandelt dit met tussenliggende bestanden die schijf-I / O-bewerkingen zijn. Uw SASS-bestand wordt gecompileerd en vervolgens naar een tijdelijk bestand geschreven. Het tijdelijke bestand wordt gebruikt door de autoprefixer en het uiteindelijke product wordt vervolgens naar het doelbestand geschreven.

Gulp zorgt voor dit alles in het geheugen . Het SASS-bronbestand is gecompileerd, het resultaat is doorgegeven aan de autoprefixer zonder naar een bestand te zijn geschreven en het doelbestand is vervolgens uitgeschreven.

Vergeleken met in-memory operaties, schrijven de schijven traag, wat betekent dat Gulp een groot snelheidsvoordeel heeft (voorlopig). Een snelheidsvergelijking werd gedaan door tech.tmw waaruit blijkt dat de meeste taken op Gulp minstens twee keer zo snel zijn. Hoewel dit geen enorm wetenschappelijke studie was, is de neiging daar en ik heb hetzelfde gezien met mijn eigen projecten. Maar hoe groot is de impact van het verschil in snelheid?

Verschil in seconden

Voor de meeste projecten doet dit er niet toe. De meeste projecten zijn klein . Wanneer u een WordPress-thema of iets dergelijks aanmaakt, is het aantal bestanden waarmee u moet werken binnen een redelijke limiet. Het maakt echt niet uit of uw stylesheets zijn gecompileerd in 400ms of 800ms.

Bovendien kunnen de meeste projecten zodanig worden gestructureerd dat enkele van de meest intensieve problemen kunnen worden omzeild . Als u 50 SASS-bestanden hebt, kunt u ze net zo snel samenvoegen terwijl ze in ontwikkeling zijn, zodat ze niet automatisch moeten worden gefixeerd of verkleind. U hoeft geen beelden te optimaliseren telkens wanneer u een project opslaat, enzovoort.

Zelfs als je echt de grote wapens nodig hebt omdat je je werk naar een staging-server duwt of als je een repository bijwerkt, maakt een ingebouwde tijd van 5 seconden of 9 seconden dan een groot verschil?

Om het helemaal af te maken, zal Grunt ondersteuning voor piping toevoegen in de komende release van 0.5, wat de dingen aanzienlijk zal versnellen, waardoor dit een betwistbaar punt wordt.

De gemeenschap

Grunt bestaat al veel langer dan Gulp, dus het heeft een aanzienlijke gebruikersbasis. Grunt ontvangt momenteel gemiddeld ongeveer 37.000 downloads per dag, Gulp krijgt iets meer dan de helft van dat aantal, dichtbij de grens van 23.000. Dat gezegd hebbende, Gulp bestaat nog maar anderhalf jaar, en dat aantal is op zijn zachtst gezegd respectabel.

Grunt heeft momenteel meer dan 4000 plug-ins, terwijl Gulp meer dan 1200 plug-ins heeft. Volgens de trends van Google zoeken meer mensen naar Grunt-gerelateerde dingen, er zijn meer fora die ermee werken en over het algemeen meer community-ondersteuning.

Natuurlijk is Gulp up and coming, wat betekent dat dit waarschijnlijk op de lange termijn zal uitkomen . Dit is echter een barrière voor sommige ontwikkelaars, vooral degenen die Grunt-gebaseerde projecten gebruiken.

Ik zou erop willen wijzen dat de gemeenschappen voor beide buitengewoon aardig zijn . Voor zover ik kan vertellen is de relatie tussen de leiders in elke gemeenschap verbazingwekkend en zou het voor iedereen een voorbeeld moeten zijn. De maker van Gulp hielp de schrijver van de snelheidstestvergelijking de timing-nauwkeurigheden verbeteren, wat leidde tot een afname van tijdsverschillen. Dat is wat ik een heer noem!

Code Vs-configuratie

Blijkbaar is dit het omslagpunt voor velen, maar om eerlijk te zijn, ik kan het probleem hier niet persoonlijk zien.

Het argument gaat als volgt: Gulp is een goed voorbeeld dat code over configuratie een goede zaak kan zijn als de configuratie een beetje verwarrend wordt . Anderen zeggen dat terwijl dit waar is en Gulp gemakkelijker te lezen is, het moeilijker is om te schrijven omdat piping een beetje verwarrend kan zijn .

Voordat ik ingewicht, is hier hetzelfde voorbeeld eerst in Grunt, dan in Gulp:

 grunt.initConfig ({sass: {dist: {bestanden: [{src: 'dev / *. scss', dest: '.tmp / styles', expand: true, ext: '.css'}]}}, autoprefixer : {dist: {bestanden: [{expand: true, cwd: '.tmp / styles', src: '{, * /} *. css', dest: 'css / styles'}]}}, watch: { stijlen: {bestanden: ['dev / *. scss'], taken: ['sass: dist', 'autoprefixer: dist']}}}); grunt.registerTask ('standaard', ['styles', 'watch']); 
 gulp.task ('sass', function () {gulp.src ('dev / *. scss') .pipe (sass ()) .pipe (autoprefixer ()) .pipe (gulp.dest ('css / styles') ));}); gulp.task ('default', function () {gulp.run ('sass'); gulp.watch ('dev / *. scss', function () {gulp.run ('sass');});} ); 

Mijn mening is dat het er echt niet toe doet. Natuurlijk, als je de eerste manier gewend bent, moet je misschien wat tijd besteden aan het uitzoeken van de tweede, maar dit is ook waar andersom. Dus voor mij is het "het is verwarrend" argument volkomen ongeldig. Elke nieuwe methode die je leert, is in het begin verwarrend, maar als je de tijd neemt om de logica van elk te begrijpen, wordt het allemaal opgelost.

Dat gezegd hebbende, heb ik persoonlijk de voorkeur voor de API van Gulp omdat die zuiverder is en deze weerspiegelt de manier waarop ik meer dan Grunt denk. Dit is natuurlijk volledig subjectief en is helemaal geen probleem met Grunt, het is gewoon mijn persoonlijke voorkeur.

Hoe te kiezen

Ik denk niet dat er enige twijfel bestaat over het feit dat zowel Grunt en Gulp geweldige hulpmiddelen zijn en mensen hebben geholpen om talloze uren te besparen door de jaren heen. Grunt is nu een beetje langzamer, maar heeft een veel grotere community. Gulp is sneller, heeft een schonere API, maar mist de gebruikersbasis.

Ik denk dat de beslissing uiteindelijk neerkomt op continuïteit, beschikbare plug-ins en voorkeuren .

(1) Als je nu een tijdje Grunt / Gulp gebruikt en je bent er blij mee, is er geen reden om over te schakelen.

(2) Als uw project plug-ins vereist die niet door Gulp worden geleverd en u niet bereid bent om er zelf een te schrijven, moet u met Grunt gaan.

(3) Als de bovenstaande twee overwegingen niet op u van toepassing zijn, heeft dit de voorkeur. Ik raad aan om beide te proberen en te zien welke je bijblijft .

Zoals ik al zei, heb ik ervoor gekozen Gulp te gebruiken omdat ik zijn schonere API beter vind, maar ik voel me prima bij Grunt als een project hierom vraagt. Wat je niet moet doen, is lezen dat de heer Know-it-all zei dat Gulp beter is en het accepteert. Hoewel er verschillen zijn, is er geen duidelijke winnaar en beide projecten kunnen en zullen naast elkaar bestaan . Probeer ze uit en verzin je eigen gedachten.

Opmerking: misschien wilt u ook rekening houden met meningen van gebruikers zoals Keith Cirkel (een Javascript-consultant) die u adviseert geen van beide te gebruiken. In zijn interessante Waarom we zouden moeten stoppen met het gebruik van Grunt & Gulp-artikel, stelt hij voor om npm te gebruiken.

Verder lezen

Er zijn veel andere uitstekende artikelen over dit onderwerp. Ik zou het volgende van harte aanbevelen voor verder lezen; het doet nooit pijn om te lezen wat anderen te zeggen hebben!

  • Grunt vs Gulp - Beyond the Numbers (bedankt voor de duidelijke voorbeelden)
  • Gulp, Grom, wat dan ook
  • Kies: Grunt, Gulp of npm?
  • Speedtesting Gulp en grom
  • Waarom zouden we stoppen met het gebruik van Grunt & Gulp
  • Build Wars (gebruik de pijlen om te navigeren)
  • Niet nodig om te grommen, neem een ​​slok frisse lucht

8 iPhone- en Android-apps om Cinemagraph te maken

8 iPhone- en Android-apps om Cinemagraph te maken

Cinemagraphs maken GIF-animaties met kleine elementen die bewegen terwijl de rest van de foto statisch blijft. Omdat het noch een statische afbeelding, noch een echte geanimeerde GIF is, betovert een cinemagraph de toeschouwer op mysterieuze manieren.Hoewel je handmatig cinemagraphs kunt maken, maar het zou veel oefening en expertise vereisen als je een gewone foto-editor gebruikt

(Technische en ontwerptips)

Hoe je wedstrijdschema's voor de Wereldbeker kunt converteren naar je tijdzone [Quicktip]

Hoe je wedstrijdschema's voor de Wereldbeker kunt converteren naar je tijdzone [Quicktip]

Behalve dat je weet waar je de volgende wedstrijd live kunt kijken, is een van de grootste kopzorgen bij het volgen van de World Cup het verschil in tijdzone. Het is vreselijk om jezelf midden in de nacht naar boven te slepen om erachter te komen dat je de eerste helft (of de hele wedstrijd!) Hebt gemist omdat je de starttijd verkeerd hebt ingeschat

(Technische en ontwerptips)