Lately I’ve been having lots of fun creating procedurally generated artwork. These art pieces are drawn by a computer following a series of predefined steps and making random choices along the way. My favorite piece so far generates solar systems.
Your <head> is the single biggest render-blocking part of your page—ensuring it is well-formed is critical. ct.css is a diagnostic CSS snippet that exposes potential performance issues in your page’s tags.
Working on a codebase with no dependencies has been a way of rediscovering exactly what I get for free in 2021, and what value I’m adding by bringing frameworks, transpilers and bundlers to the mix. I’d like to share what I learned (and what I needed to unlearn) in the process.
This post is just some simple thoughts on animating a humble box as an accordion. This just means an element which open and closes vertically with an animation. I’m going to cover some nuances on this, but the short version of this post is: for a few seconds, it’s probably fine, even if you’re animating the height (or friends) property to do so.
Add a build step: Tools are available that can automatically lint code, identify problems, concatenate, minify, reduce image sizes, and more. Automation makes life easier, and you’re less likely to forget an optimization step.
Document your stylesheets: A style guide with documented examples will make your code easier to pick up and maintain. You’ll be able to identify and remove old CSS without breaking a sweat.