CSS-minificering

Silktide tjekker, om de typografiark, som din side downloader, er blevet minificeret – omskrevet for at fjerne mellemrum, kommentarer og gentagelser, som kun er relevante for personer, der læser koden. Ikke-minificerede typografiark er større, end de behøver at være, hvilket gør siden langsommere om at blive vist.

ændrer ikke noget ved, hvordan siden ser ud. Eksempelvis:

/* Før minificering: læsbart, men tungt */
h1 {
  background-color: #000000;
}
h2 {
  background-color: #000000;
}

/* Efter: identisk resultat, en brøkdel af størrelsen */
h1,h2{background-color:#000}

Hvorfor dette er vigtigt

Typografiark blokerer som regel gengivelsen: Browseren downloader sidens , før den viser noget, så hver unødvendig byte i et typografiark forlænger direkte den tomme ventetid, før din side vises. Minificering reducerer rutinemæssigt størrelsen på typografiark betydeligt, og besparelsen gentages for hver besøgende ved hver ikke-cachelagret sidevisning.

Da minificering er automatisk og ikke ændrer funktionaliteten, er ikke-minificerede produktions-typografiark næsten altid en forglemmelse: et oversprunget trin i byggeprocessen eller udviklingsfiler, der er blevet udrullet ved en fejl.

Sådan løser du det

Slå CSS-minificering til i webstedets byggeproces. Alle moderne byggeværktøjer indeholder en minificering, som normalt er aktiveret som standard i produktionsbuilds.
Hvis webstedet ikke har en byggeproces, skal du tjekke : De fleste har en indstilling eller et plugin, der minificerer typografiark automatisk.
Som sidste udvej kan du køre filer gennem et selvstændigt minificeringsværktøj, før du uploader dem. Behold de læsbare originaler – det er dem, du redigerer, og du udgiver det minificerede output.
Hvis et rapporteret typografiark tilhører en tredjepart, skal du undersøge, om de tilbyder en minificeret version, hvilket de fleste gør.

Sådan tester Silktide dette

Indlæs siden i en rigtig browser ved hjælp af den enhedstype, forbindelseshastighed og testplacering, der er konfigureret til dine hastighedstests.
Undersøg hvert typografiark, som siden downloader, og vurder, hvor meget mindre det ville være, hvis det var minificeret.
Rapportér hver fil med en væsentlig mulig besparelse, og bedøm siden ud fra det samlede resultat: Omkring 50 KB i potentielle besparelser giver en lavere bedømmelse, og 250 KB eller mere bedømmes som dårligt.

Fejlfinding

Filen ser allerede minificeret ud

Minificeringsværktøjer varierer i, hvor aggressive de er, så et let komprimeret typografiark kan stadig indeholde væsentlige besparelser. Tjekket rapporterer, hvor meget mindre filen kunne være; at køre den gennem et aktuelt minificeringsværktøj indfanger normalt forskellen.

Vi har brug for læsbare typografier til fejlfinding

Behold læsbare kildefiler i dit projekt, og fejlfind med source maps, som lader browserens udviklingsværktøjer vise de oprindelige typografier, mens besøgende modtager den minificerede version. Du behøver aldrig at levere læsbar kode for at kunne fejlfinde læsbart.