A added build could create a minified version off the CSS, called tufle.min.css, it could also auto-add all the vendor prefixes needed via Autoprefixer/PostCSS.
To make all this work, we could do it two ways:
Create a master branch, that builds to the
gh-pagesbranch, ideally with Travis, so that it happens each time the master is updated.Create a
srcfolder that holds the source, and a output folder calleddestthat holds the build artifacts. Then just point to the dest version in the HTML. You could have to install npm, and commit the build files youself.
I would recommend version 1, and I would be able to set most of it up with a PR. But we would need a contributor/owner to configure the branches. But this would in my mind be the best solution. Let me know what you'd prefer.
The issue in #119 would benefit greatly from this. And people looking to use this library could also use the optimized version.
Saturate
All 5 comments
This would also add the possibility, to use a processor like LESS or SCSS, however this might be overkill, seeing the size of this project is pretty small. So I would not really recommend this.
Saturate
on 6 Nov 2017
Minification would only affect tufte.css, not the font files, correct?
My tests show this saving ~4kb.
daveliepmann
on 6 Nov 2017
That sounds about right, in my test we went from 12172 bytes bytes to 7839 bytes. This might not sound like a lot, but it all counts. I guess the autoprefixer-part would also help minimizing it and help maintaining it.
Right now you define a lot of unused vendor prefixes, these are only used by very old versions of Google and Firefox, seeing as these are updated them self, almost no body are using the old versions. This is just bloating the CSS file, and the CSS is very important for the rendering of the page.
The font's are not affected, woff2 is already compressed. But if they existed on Google Font or another service, you could gain a bit by caching them. This would also make it easier for other people to gain access to the font, right now they need to download it - but the font might not be available on a CDN (Content Delivery Network).
The maybe biggest benefit would be to inline the Critical CSS for the website into the html - this could be done with the build step as well, but would not help other people that are using the styles.
Saturate
on 6 Nov 2017
Many web projects now use npm as a package manager. It would be great if you include a package.json file with a build step and publish the package to the npm registry. This would allow easy install, import, and upgrades.
tacomanator
on 9 Nov 2017
@Saturate I just fully noticed this part of your comment:
Right now you define a lot of unused vendor prefixes, these are only used by very old versions of Google and Firefox, seeing as these are updated them self, almost no body are using the old versions. This is just bloating the CSS file
I don't see where Tufte CSS does this. Running it through the auto-prefixer only deletes some background-size. Do you see more potential deleted code here?
daveliepmann
on 2 Sep 2019
Related issues
danielnixon
·
3Comments
fustkilas
·
5Comments
adamschwartz
·
16Comments
gamecubate
·
10Comments
daveliepmann
·
29Comments
Most helpful comment
Many web projects now use npm as a package manager. It would be great if you include a package.json file with a build step and publish the package to the npm registry. This would allow easy install, import, and upgrades.