jmills runofthemill

Why

Sage doesn't come with Purgecss (or uncss, etc.)
Say, we use Bulma -- suddenly dist/main.css grows by 400K!
Let's purge it!
Oh dang, we need to whitelist /\.wp-/, /\.post-type/, /myfancylightbox/...
Wait we are whitelisting pretty much everything from /resource/assets/styles!
Isn't there an option to purge /node_modules/**/* only?
Nope.
purgecss start ignore, strategically placed, to the rescue!

update 1: add a FAQ section
update 2: benchmark chart and feature comparison table
update 3:
- improve the table with missing features for antigen
- new zplg times result

Snippets frequently used with Sage

Tested only on Ubuntu 24.04, KDE Neon User Edition (based on Ubuntu 24.04) and OSX Mojave or higher.

will probably work on other newer versions, with no changes, or with few changes in non-python dependencies (apt-get packages)

NOTE: Don't create a .sh file and run it all at once. It may will not work. Copy, paste, and execute each command below manually. :-)

# DO NOT RUN THIS AS A ROOT USER

	<?php

	// Adjust FacetWP "Radio" HTML output to be friendlier with our theme
	add_filter('facetwp_facet_html', function ($output, $params) {

	// Check that this facet is a "radio" type facet before proceeding.
	if ('radio' == $params['facet']['type']) {

	// Initialize our variables
	$output = '';

	import React from 'react'

	const PostListing = ({post}) => (
	<article>
	<h3>{post.frontmatter.title}</h3>
	<span>{post.frontmatter.date}</span>
	<p>{post.excerpt}</p>
	</article>
	)

	root() {
	local root
	if [[ "$PWD" == "/trellis" ]]; then
	root=${PWD%/trellis*}
	elif [[ "$PWD" == "/site" ]]; then
	root=${PWD%/site*}
	elif [[ -d "$PWD/trellis" \|\| -d "$PWD/site" ]]; then
	root=${PWD}
	fi

	#!/bin/bash

	# Regolith aka Un-Bedrock
	# "But what if we need to hand it off to another agency?" No more!
	# This script converts a Bedrock site to a normal WordPress structure.
	# Run it from the root of a Bedrock project.
	# Created by Nathan Knowler and Daniel Roe

	echo "Converting Bedrock to a normal WordPress file structure..."

	import React, { Component } from 'react';

	import FruitContext from './FruitContext';
	import FruityComponent from './FruityComponent';

	export class App extends Component {
	state = {
	fruit: 'apple',
	}