In my introductory post, I shared about the CSS analysis tool named Parker. In this post, we’ll cover installing Parker on your local machine so you are able to analyze your own code.
Before performing any of the following steps, you’ll need to install Parker and its dependencies. Parker runs from the command line, so you’ll need to open your favorite terminal app. I’m on a Mac, so I’ll be using Terminal. I’ll provide the instructions here for installing everything on a Mac, sorry Windows peeps. If you need assistance or run into difficulties with installing any particular thing, visit that tool’s site or try StackExchange. Here’s what you’ll need to install to follow along:
- Xcode dev tools
- Homebrew
- node.js & npm
- Parker
- _s
Installing Xcode and the Developer Tools
Open Terminal and hit enter after typing/pasting:
xcode-select --install
This should open an application installer wizard for the developer tools. Go through the prompts and install the package. (Source: OS X Daily)
Installing Homebrew
Once that’s finished, install Homebrew, which makes installing packages on OS X easier. In Terminal, hit enter after typing/pasting:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
This script installs Homebrew. It will ask for confirmation that you want to install it. Follow the prompts. (Source: Homebrew)
Installing node.js and npm
Once Homebrew is installed, installing node.js is fairly simple. In Terminal, hit enter after typing/pasting (Source: George Ornbo):
brew install node
Installing Parker
Installing Parker at this point should be fairly simple. In Terminal, hit enter after typing/pasting:
npm install -g parker
The “-g” installs Parker globally, so you can access it from anywhere in your system (rather than just inside a specific project or folder). (Source: Harry Roberts)
Copy _s
Lastly, we’ll need a copy of _s. Open Finder and decide where you want to save _s. This can be any folder; I put my copy of _s in Dropbox. In Terminal type/paste:
cd
Be sure to leave a space at the end! Drag your work folder from Finder to Terminal. This puts the path to your work folder into Terminal. Hit enter and your working directory in Terminal changes to your work folder. Use git to clone the _s repo from Github and work with it on your computer. In Terminal, hit enter after typing/pasting:
git clone [email protected]:Automattic/_s.git
Wrapping Up
In the next post, we’ll use Parker to create a baseline measurement so we can see if any of our optimizations are effective. I’ll also explain what each result in the report from Parker means.