Afbeeldingsoptimalisatie
Een Script dat website-afbeeldingen verkleint naar hun maximale resolutie op de pagina — ontstaan uit de FC-site die honderd keer te groot lanceerde.
Het scriptje is live en beschikbaar om te downloaden; de tool is klaar voor gebruik, maar heeft momenteel geen GUI — die ga ik mogelijk later nog maken.
Het ontstond uit een heel praktische behoefte: afbeeldingen optimaliseren. Toen ik de FC-website bouwde, maakte ik screenshots van onze in-game characters in de hoogst mogelijke resolutie. Ik zag het niet zitten om ze te optimaliseren en trok me daar destijds weinig van aan — ik wilde de site snel online hebben, het enthousiasme delen en mensen het laten spele met de "easter eggs" die ik aan het maken was. V1.0 lanceerde met een grootte die ongeveer honderd keer te groot was, en het leek er even op alsof we een dial-up modem hadden.
Later na zag ik het ook niet zitten om elke afbeelding handmatig te bewerken; ik had andere dingen te doen. Dus schreef ik een script dat ze automatisch verkleint, gebaseerd op de maximale resolutie waarop elke afbeelding daadwerkelijk gebruikt wordt op de site.
Aanvullende informatie
Steekpunten
- Ontstaan uit de lancering van de FC-site — assets in volledige resolutie online, gevolgd door een honderdvoudig grootte probleem om op te lossen.
- Werkt op elk webproject; specifiek afgestemd op Alterna design-kit-componenten.
- Automatisch verkleinen naar de maximale on-site resolutie van elke afbeelding; uit te voeren vóór de build.
- Voorgecompileerde download is alleen voor Linux; macOS- en Windows-builds vanuit de broncode op GitLab.
- Configureerbare paden; optionele verwijdering of verplaatsing van ongebruikte en originele bestanden.
Wat begon als een snel, rommelig scriptje, werd handig genoeg om netjes op te schonen: een tool die afbeeldingen verkleint naar de grootte waarop ze gebruikt worden op de website. Het is niet het meest spannende project, maar het is erg nuttig — ik houd de mooie originele afbeeldingen voor later, draai het script vóór het opleveren, en vermijd vies zware pagina's die aanvoelen alsof je jaren 90 internet hebt.
Het script is beschikbaar om te downloaden en kan uitgevoerd worden vanuit de rootmap van elk webproject, maar is specifiek geoptimaliseerd om te werken met Alterna design-kit-componenten. Het kan geconfigureerd worden voor verschillende mappen of beperkt worden tot bepaalde paden. Het kan ook ongebruikte afbeeldingen en originele bestanden verwijderen, of ongebruikte en originele bestanden kopiëren/verplaatsen naar een locatie van je keuze.
De voorgecompileerde download is alleen voor Linux — dat is wat ik thuis op al mijn apparaten gebruik. macOS- en Windows-builds zouden vanuit de broncode op GitLab goed te maken moeten zijn als je die nodig hebt.