Ein Artikel, der Grunt für eine automatisierte Webperformance-Optimierung nutzt, ist in der aktuellen WEAVE 03/2013 abgedruckt. Dort zeige ich, wie man einer Webanwendung durch ein flinkes Build-Script Beine machen kann.
Die WEAVE, eine Schwesterzeitschrift der PAGE, ist das Fachmagazin für Gestalter, Konzeptioner, Auftraggeber und Developer interaktiver Medien. Sie berichtet im Zwei-Monats-Takt über Trends, Projekte und Technologien.
Neben ausführlichen Case Studies, Interviews und Portraits bietet die WEAVE auch einen Workshop-Teil, der in Step-by-Step-Anleitungen Tools und Workflows vermittelt.
In einer solchen Step-by-Step-Anleitungen zeige ich, wie man einer Webanwendung durch ein flinkes Build-Script Beine machen kann.
In acht nachvollziehbaren Schritten (Software installieren und Umgebung einrichten, Projekt mit Yeoman bootstrappen, Dateien zusammenfassen, Code analysieren / Coding Conventions sicherstellen mit JSHint, Quelltext minifizieren, CSS optimieren mit Compass, HTML automatisch anpassen mit UseMin, Bilder verlustfrei re-komprimieren mit OptiPNG und JPEGTran, …) wird in diesem Tutorial ein Frontend-Projekt optimiert. Dabei kommen die Tools Grunt, Yeoman und Bower, unterstützt durch SASS, Compass, OptiPNG und JPEGTran zum Einsatz.
Ein Beispielprojekt für diesen Workflow findet man auf GitHub.
