Website Performance Optimization portfolio project

Getting started

First, close this repository then set up a local server using python and ngrok

1. Check out the repository
2. To inspect the site on your phone, you can run a local server

$> cd /path/to/your-project-folder
$> python -m SimpleHTTPServer 8080

1. Open a browser and visit localhost:8080
2. Download and install ngrok to the top-level of your project directory to make your local server accessible remotely.

$> cd /path/to/your-project-folder
$> ./ngrok http 8080

1. Copy the public URL ngrok gives you and try running it through PageSpeed Insights! Optional: More on integrating ngrok, Grunt and PageSpeed.

index.html

PageSpeed Results

Mobile: 91
Web: 93

Optimizations

-Inlined CSS

-Minified CSS and JS

-Moved scripts to the bottom

-Reduced image sizes and added height/width to all images in html

pizza.html

Optimizations

-moved math operations outside of for loop within the updatePositions() method

-stored newwidth inside of a variable to ensure it is only called once within changePizzaSizes() method