Nono.MA

OCTOBER 15, 2020

To zip a folder and its content with Terminal you can use the zip command in the cli1, and here are a few other goodies you can use to simplify your workflow, making sure the folder is compressed properly, all subdirectories are compressed recursively, and the zip filename is automatically set using the current folder.

zip -qr9 ../$(basename "$PWD").zip *

Anatomy of a zip command

  • zip is the command that archives files and folders
  • -qr9 are the arguments for the command
    • -q (or "quiet operation") is the argument to zip silently, without listing the files that are being added (useful for not to clutter Terminal or notebook outputs)
    • -r (or "recurse into directories") is the argument to zip everything in the directory recursively, and not only files at the first level
    • -9 (or "compress better") is the argument to trade speed for compression, the operation will take longer to complete but the compression will be better, use -1 to "compress faster" or -0 to "store only," without compression
  • ../$(basename "$PWD").zip is the argument that defines the name of your zip file
    • ../ specifies the file should be one level up in the directory structure
    • basename is a command to obtain the folder or file name of a path
    • pwd is a command to obtain the current path of the Terminal (in our case the folder path)
    • .zip specifies the file extension
  • * is the argument of the files to compress, the asterisk is to zip everything in the current directory (and subdirectories due to the -r argument) - you could list individual files instead (say, file.txt file.json file.png) or multiple wildcards (say, *.txt *.json *.png)

  1. Command-line interface. 

OCTOBER 1, 2020

Note: This document is incomplete and work-in-progress.

Here are different ways to convert (or rasterize) SVG graphics to PNG.

Librsvg

brew install librsvg

Then the rsvg-convert command should be available in your terminal.

rsvg-convert --help

# Usage:
#   rsvg-convert [OPTION…] [FILE...] - SVG Converter
# 
# Help Options:
#   -?, --help                                                  Show help options
# 
# Application Options:
#   -d, --dpi-x=<float>                                         pixels per inch [optional; defaults to 90dpi]
#   -p, --dpi-y=<float>                                         pixels per inch [optional; defaults to 90dpi]
#   -x, --x-zoom=<float>                                        x zoom factor [optional; defaults to 1.0]
#   -y, --y-zoom=<float>                                        y zoom factor [optional; defaults to 1.0]
#   -z, --zoom=<float>                                          zoom factor [optional; defaults to 1.0]
#   -w, --width=<int>                                           width [optional; defaults to the SVG's width]
#   -h, --height=<int>                                          height [optional; defaults to the SVG's height]
#   -f, --format=[png, pdf, ps, eps, svg, xml, recording]       save format [optional; defaults to 'png']
#   -o, --output                                                output filename [optional; defaults to stdout]
#   -i, --export-id=<object id>                                 SVG id of object to export [optional; defaults to exporting all objects]
#   -a, --keep-aspect-ratio                                     whether to preserve the aspect ratio [optional; defaults to FALSE]
#   -b, --background-color=[black, white, #abccee, #aaa...]     set the background color [optional; defaults to None]
#   -s, --stylesheet                                            Filename of CSS stylesheet
#   -u, --unlimited                                             Allow huge SVG files
#   --keep-image-data                                           Keep image data
#   --no-keep-image-data                                        Don't keep image data
#   -v, --version                                               show version information

ImageMagick

InkScape

brew cask install inkscape
inkscape --action-list

# action-list         :  Print a list of actions and exit.
# convert-dpi-method  :  Import DPI convert method.
# export-area         :  Export area.
# export-area-drawing :  Export drawing area.
# export-area-page    :  Export page area.
# export-area-snap    :  Export snap area to integer values.
# export-background   :  Export background color.
# export-background-opacity:  Export background opacity.
# export-do           :  Do export.
# export-dpi          :  Export DPI.
# export-filename     :  Export file name.
# export-height       :  Export height.
# export-id           :  Export id(s).
# export-id-only      :  Export id(s) only.
# export-ignore-filters:  Export ignore filters.
# export-latex        :  Export LaTeX.
# export-margin       :  Export margin.
# export-overwrite    :  Export over-write file.
# export-pdf-version  :  Export PDF version.
# export-plain-svg    :  Export as plain SVG.
# export-ps-level     :  Export PostScript level.
# export-text-to-path :  Export convert text to paths.
# export-type         :  Export file type.
# export-use-hints    :  Export using saved hints.
# export-width        :  Export width.
# file-close          :  Close active document.
# file-new            :  Open new document using template.
# file-open           :  Open file.
# inkscape-version    :  Print Inkscape version and exit.
# no-convert-baseline :  Import convert text baselines.
# object-set-attribute:  Set or update an attribute on selected objects. Usage: object-set-attribute:attribute name, attribute value;
# object-set-property :  Set or update a property on selected objects. Usage: object-set-property:property name, property value;
# object-to-path      :  Convert shapes to paths.
# object-unlink-clones:  Unlink clones and symbols.
# open-page           :  Import page number.
# query-all           :  Query 'x', 'y', 'width', and 'height'.
# query-height        :  Query 'height' value(s) of object(s).
# query-width         :  Query 'width' value(s) of object(s).
# query-x             :  Query 'x' value(s) of selected objects.
# query-y             :  Query 'y' value(s) of selected objects.
# quit-inkscape       :  Immediately quit Inkscape.
# select              :  Select by ID (Deprecated)
# select-all          :  Select all. Options: 'all' (every object including groups), 'layers', 'no-layers' (top level objects in layers), 'groups' (all groups including layers), 'no-groups' (all objects other than groups and layers, default).
# select-by-class     :  Select by class
# select-by-element   :  Select by SVG element (e.g. 'rect').
# select-by-id        :  Select by ID
# select-by-selector  :  Select by CSS selector
# select-clear        :  Selection clear
# select-invert       :  Invert selection. Options: 'all', 'layers', 'no-layers', 'groups', 'no-groups' (default).
# select-list         :  Print a list of objects in current selection.
# system-data-directory:  Print system data directory and exit.
# transform-remove    :  Remove any transforms from selected objects.
# transform-rotate    :  Rotate selected objects by degrees.
# transform-scale     :  Scale selected objects by scale factor.
# transform-translate :  Translate selected objects (dx,dy).
# unselect            :  Unselect by ID (Deprecated)
# unselect-by-id      :  Unselect by ID
# user-data-directory :  Print user data directory and exit.
# vacuum-defs         :  Remove unused definitions (gradients, etc.).
# verb                :  Execute verb(s).
# verb-list           :  Print a list of verbs and exit.
# window-close        :  Close the active window.
# window-open         :  Open a window for the active document. GUI only.
inkscape --export-format="png" in.svg

svgexport

npm install -g svgexport
svgexport infile.svg outfile.png

Cairo

cairosvg

dom-to-image

To-do.

APRIL 11, 2020

Many platforms—among which are Google PageSpeed or ImgIX—recommend serving animated assets over video formats as opposed to GIF animations. GIFs are heavy, and data transfer can be reduced somewhere between two and twenty times (when using the webm format) and, on top of that, videos can be streamed.

From GIF to MP4

ffmpeg -i animation.gif animation.mp4

From GIF to webm

ffmpeg -i animation.gif -c vp9 -b:v 0 -crf 12 my-animation.webm
  • crf · The range of the CRF scale is 0–51, where 0 is lossless, 23 is the default, and 51 is worst quality possible. A lower value generally leads to higher quality, and a subjectively sane range is 17–28. Consider 17 or 18 to be visually lossless or nearly so; it should look the same or nearly the same as the input but it isn't technically lossless. The range is exponential, so increasing the CRF value +6 results in roughly half the bitrate / file size, while -6 leads to roughly twice the bitrate. Choose the highest CRF value that still provides an acceptable quality. If the output looks good, then try a higher value. If it looks bad, choose a lower value.
  • b:v maximum bit rate allowed. Higher means better quality.

MARCH 30, 2020

gs -dNOPAUSE -sDEVICE=pdfwrite \
-sOUTPUTFILE=/output/path/combined.pdf \
-dBATCH /input/path/to/pdfs/*.pdf

Want to see older publications? Visit the archive.

Listen to Getting Simple .