Tufte-css: Ajouter une compilation au projet
Une version ajoutée pourrait créer une version réduite du CSS, appelée tufle.min.css , elle pourrait également ajouter automatiquement tous les préfixes de fournisseur nécessaires via Autoprefixer/PostCSS.
Pour que tout cela fonctionne, nous pourrions procéder de deux manières :
Créez une branche master, qui se construit sur la branche
gh-pages, idéalement avec Travis, afin que cela se produise à chaque mise à jour du master.Créez un dossier
srcqui contient la source et un dossier de sortie appelédestqui contient les artefacts de build. Ensuite, pointez simplement sur la version de destination dans le code HTML. Vous devrez peut-être installer npm et valider vous-même les fichiers de construction.
Je recommanderais la version 1, et je serais en mesure de configurer la plupart avec un PR. Mais nous aurions besoin d'un contributeur/propriétaire pour configurer les branches. Mais ce serait dans mon esprit la meilleure solution. Faites-moi savoir ce que vous préférez.
L'émission n°119 en bénéficierait grandement. Et les personnes souhaitant utiliser cette bibliothèque pourraient également utiliser la version optimisée.
Saturate
Tous les 5 commentaires
Cela ajouterait également la possibilité d'utiliser un processeur comme LESS ou SCSS, mais cela pourrait être excessif, vu que la taille de ce projet est assez petite. Je ne recommanderais donc pas vraiment cela.
Saturate
le 6 nov. 2017
La minification n'affecterait que tufte.css , pas les fichiers de polices, n'est-ce pas ?
Mes tests montrent cette économie d'environ 4 Ko.
daveliepmann
le 6 nov. 2017
Cela semble juste, dans mon test, nous sommes passés de 12172 bytes octets à 7839 bytes . Cela peut sembler peu, mais tout compte. Je suppose que la partie autoprefixer aiderait également à la minimiser et à la maintenir.
À l'heure actuelle, vous définissez de nombreux préfixes de fournisseurs inutilisés, ceux-ci ne sont utilisés que par les très anciennes versions de Google et Firefox, étant donné qu'ils sont mis à jour eux-mêmes, presque personne n'utilise les anciennes versions. Cela ne fait que gonfler le fichier CSS, et le CSS est très important pour le rendu de la page.
Les polices ne sont pas affectées, woff2 est déjà compressé. Mais s'ils existaient sur Google Font ou un autre service, vous pourriez gagner un peu en les mettant en cache. Cela permettrait également à d'autres personnes d'accéder plus facilement à la police, pour le moment, elles doivent la télécharger - mais la police pourrait ne pas être disponible sur un CDN (réseau de diffusion de contenu).
Le plus grand avantage serait peut-être d'intégrer le CSS critique du site Web dans le code html - cela pourrait également être fait avec l'étape de construction, mais n'aiderait pas les autres personnes qui utilisent les styles.
Saturate
le 6 nov. 2017
De nombreux projets Web utilisent désormais npm comme gestionnaire de packages. Ce serait formidable si vous incluiez un fichier package.json avec une étape de construction et publiiez le package dans le registre npm. Cela permettrait une installation, une importation et des mises à niveau faciles.
tacomanator
le 9 nov. 2017
@Saturate, je viens de remarquer pleinement cette partie de votre commentaire :
À l'heure actuelle, vous définissez de nombreux préfixes de fournisseurs inutilisés, ceux-ci ne sont utilisés que par les très anciennes versions de Google et Firefox, étant donné qu'ils sont mis à jour eux-mêmes, presque personne n'utilise les anciennes versions. C'est juste gonfler le fichier CSS
Je ne vois pas où Tufte CSS fait cela. L'exécuter via le préfixe automatique ne supprime que certains background-size . Voyez-vous plus de code supprimé potentiel ici ?
daveliepmann
le 2 sept. 2019
Questions connexes
langford
·
21Commentaires
gamecubate
·
10Commentaires
daveliepmann
·
29Commentaires
danielnixon
·
3Commentaires
fustkilas
·
5Commentaires
Commentaire le plus utile
De nombreux projets Web utilisent désormais npm comme gestionnaire de packages. Ce serait formidable si vous incluiez un fichier package.json avec une étape de construction et publiiez le package dans le registre npm. Cela permettrait une installation, une importation et des mises à niveau faciles.