###Part 1: Optimize PageSpeed Insights score
- Clone the repository
- To inspect the site, you will need to run a local server
1. Go to your project directory
$> cd /path/to/your-project-folder
2. Start a simple local python server
$> python -m SimpleHTTPServer 8080
- Open a browser and visit localhost:8080
- Download and install ngrok to create a tunnel to your local server
- After installation run ngrok on the port of your local server in your project folder
$> ngrok http 8080
- Ngrok will then generate a url that you can use to test in PageSpeed Insights.
- Copy the public URL ngrok gives you and run it through PageSpeed Insights!
- Download and install nodeJS, Grunt and NPM.
- After installing nodeJS, cd to the project directory and type:
npm install
After this, you should be able to run Grunt.
- Eliminated render-blocking by loading JS asynchronously
- Inlined critical CSS and minified JS and CSS by using Grunt critical, uglify, cssmin
- optimized images to reduce filesize
###Part 2: Optimize Frames per Second
- Update functions where needed so that they don't run more than needed
- Changed document.querySelector to document.getElementByClassName
- Calculate number of pizzas based on window height to reduce the amount of objects created
- Moved variables outside of for loops where necessary such as in the updatePositions function
- Used CSS transform instead of style.left
- Used more efficient requestAnimationFrame
- Stored phase values in array so it is not necessary to calculate them more than once
- Remove steps out of for loop that only need to run once
- Changed document.querySelector to document.getElementByClassName