diff --git a/content/blog/custom-font-subset.ca.md b/content/blog/custom-font-subset.ca.md index 4a2620128..1faa9c21c 100644 --- a/content/blog/custom-font-subset.ca.md +++ b/content/blog/custom-font-subset.ca.md @@ -1,7 +1,7 @@ +++ title = "Optimitza la càrrega amb un subconjunt de font personalitzat" date = 2023-04-29 -updated = 2023-05-22 +updated = 2023-05-25 description = "Aprèn com crear un subconjunt personalitzat que només inclogui els glifs necessaris." [taxonomies] @@ -38,12 +38,12 @@ El següent script pren un fitxer `config.toml` i un fitxer de font com a entrad #!/usr/bin/env bash usage() { - echo "Usage: $0 [--config|-c CONFIG_FILE] [--font|-f FONT_FILE] [--output|-o OUTPUT_PATH]" + echo "Usage: $0 [--config | -c CONFIG_FILE] [--font | -f FONT_FILE] [--output | -o OUTPUT_PATH]" echo echo "Options:" echo " --config, -c Path to the config.toml file." echo " --font, -f Path to the font file." - echo " --output, -o Output path for the generated subset.css file (default: current directory)" + echo " --output, -o Output path for the generated custom_subset.css file (default: current directory)" echo " --help, -h Show this help message and exit" } @@ -125,7 +125,7 @@ unique_chars=$(echo "$combined" | grep -o . | sort -u | tr -d '\n') # Crea un fitxer temporal per a subset.woff2. temp_subset=$(mktemp) -# Executa la comanda pyftsubset amb els caràcters filtrats com a argument --text. +# Crea el subconjunto. pyftsubset "$font_file" \ --text="$unique_chars" \ --layout-features="*" --flavor="woff2" --output-file="$temp_subset" --with-zopfli @@ -134,7 +134,7 @@ pyftsubset "$font_file" \ base64_encoded_font=$(base64 -i "$temp_subset") echo "@font-face{font-family:\"Inter Subset\";src:url(data:application/font-woff2;base64,$base64_encoded_font);}" > "$output_path/custom_subset.css" -# Elimina el fitxer temporal subset.woff2 +# Elimina el fitxer temporal subset.woff2. rm "$temp_subset" ``` diff --git a/content/blog/custom-font-subset.es.md b/content/blog/custom-font-subset.es.md index 1612bc9d0..1ea23f4bc 100644 --- a/content/blog/custom-font-subset.es.md +++ b/content/blog/custom-font-subset.es.md @@ -1,7 +1,7 @@ +++ title = "Optimiza la carga con un subconjunto de fuente personalizado" date = 2023-04-29 -updated = 2023-05-22 +updated = 2023-05-25 description = "Aprende cómo crear un subconjunto personalizado que solo incluya los glifos necesarios." [taxonomies] @@ -38,12 +38,12 @@ El script que sigue toma un archivo `config.toml` y un archivo de fuente como en #!/usr/bin/env bash usage() { - echo "Usage: $0 [--config|-c CONFIG_FILE] [--font|-f FONT_FILE] [--output|-o OUTPUT_PATH]" + echo "Usage: $0 [--config | -c CONFIG_FILE] [--font | -f FONT_FILE] [--output | -o OUTPUT_PATH]" echo echo "Options:" echo " --config, -c Path to the config.toml file." echo " --font, -f Path to the font file." - echo " --output, -o Output path for the generated subset.css file (default: current directory)" + echo " --output, -o Output path for the generated custom_subset.css file (default: current directory)" echo " --help, -h Show this help message and exit" } @@ -116,7 +116,7 @@ if [ -n "$language_names" ]; then done fi -# Combina las cadenas extraídas.. +# Combina las cadenas extraídas. combined="$title$menu_names$language_names" # Obtiene los caracteres únicos. @@ -125,7 +125,7 @@ unique_chars=$(echo "$combined" | grep -o . | sort -u | tr -d '\n') # Crea un archivo temporal para subset.woff2. temp_subset=$(mktemp) -# Ejecuta el comando pyftsubset con los caracteres filtrados como argumento --text. +# Crea el subconjunto. pyftsubset "$font_file" \ --text="$unique_chars" \ --layout-features="*" --flavor="woff2" --output-file="$temp_subset" --with-zopfli diff --git a/content/blog/custom-font-subset.md b/content/blog/custom-font-subset.md index 21b24eee5..f7f7f7947 100644 --- a/content/blog/custom-font-subset.md +++ b/content/blog/custom-font-subset.md @@ -1,7 +1,7 @@ +++ title = "Optimise loading times with a custom font subset" date = 2023-04-29 -updated = 2023-05-22 +updated = 2023-05-25 description = "Learn how to create a custom subset that only includes the necessary glyphs." [taxonomies] @@ -38,7 +38,7 @@ The script below takes a `config.toml` file and a font file as input, extracts t #!/usr/bin/env bash usage() { - echo "Usage: $0 [--config|-c CONFIG_FILE] [--font|-f FONT_FILE] [--output|-o OUTPUT_PATH]" + echo "Usage: $0 [--config | -c CONFIG_FILE] [--font | -f FONT_FILE] [--output | -o OUTPUT_PATH]" echo echo "Options:" echo " --config, -c Path to the config.toml file." @@ -125,16 +125,19 @@ unique_chars=$(echo "$combined" | grep -o . | sort -u | tr -d '\n') # Create a temporary file for subset.woff2. temp_subset=$(mktemp) -# Run the pyftsubset command with the filtered characters as --text argument. +# Create the subset. pyftsubset "$font_file" \ --text="$unique_chars" \ --layout-features="*" --flavor="woff2" --output-file="$temp_subset" --with-zopfli +# Remove trailing slash from output path, if present. +output_path=${output_path%/} + # Base64 encode the temporary subset.woff2 file and create the CSS file. base64_encoded_font=$(base64 -i "$temp_subset") echo "@font-face{font-family:\"Inter Subset\";src:url(data:application/font-woff2;base64,$base64_encoded_font);}" > "$output_path/custom_subset.css" -# Remove the temporary subset.woff2 file +# Remove the temporary subset.woff2 file. rm "$temp_subset" ```