Yes, it’s not only possible, it’s a damn good idea and one of the best engineering decisions you can make. Always? Of course not. JavaScript frameworks make a lot of sense in a lot of situations and I quite like using them. jQuery too, has it’s place. Horses for courses.

But seriously…

Today’s “course” is my very own website; A rebuild specifically. This site is simple and project objectives were simpler still.

1. Sub-second page load times
2. Update copy and message ( it had been years after all )
3. Make more prettier – despite not being a designer

We’ll assume I was widely successful with objectives 2 and 3 focus on performance. The goal here is one CSS file and one JavaScript file – because we’re perfectionists.

Theme

I generally prefer the Roots Sage starter theme, however it’s far too much for what I wanted here. Instead, I started with Automattic’s _underscores theme. This theme is already a bare bones Developer starter there but I slimmed it down further still. Initially, I didn’t set out to remove jQuery. However, I got to thinking that there was nothing I really needed it for. And removing jQuery is simple. While we’re at it,  let’s can the ContactForm7 script.

Now we’re jQuery-less but we can do better. There are still a couple other scripts hanging around. No optimization is too small; wp-emoji-release.min.js and wp-embed.min.js. If you’re ok living life without perfect emoji support, I’d recommend disabling emojis as well. wp-embed.min.js facilitates oEmbeds. More on that here. There’s a real possibility you don’t need this either.

CSS

CSS frameworks have gotten a little out of control in size. Both Bootstrap and Foundation are well over 100k. Again, way overkill for a personal site. Instead I chose Milligram which is 9k ( ~2k Gziped). The entire CSS for this site is 21k (5k Gzipped). Milligram is bare bones but I quite like it and a total breeze to pick up.

Build

Nothing out of the ordinary here. Live reloading enabled by browserSync. SASS build (thanks Milligram). I do like to set a node variable and only minify files if process.env.NODE_ENV == 'production' since that operation is rather expensive.

Plugins?

Not many. Akismet, Contact Form 7 & Yoast SEO. I removed three plugins. Disqus was considerably slower loading then native WordPress comments. SyntaxHighlighter Evolved is a great plugin for posting code but it’s still a PIA to post code on WordPress so I’ve moved to Github Gists. Advanced Custom Fields was replaced in favor of native post metadata.

Hosting?

Is important! Currently, this website is hosted by WP Engine. I also have some server space with CloudWays and have been quite impressed with their infrastructure and performance. I may move my site there.

Success?

Every site’s metrics for success are different, but I’m consistently seeing page load speeds of ~half a second and the homepage page size is a svelte 88k. Is it “more prettier”? Subjective, but I think so.