Website Performance Optimization portfolio project

Website Optimization project, and this is Project Rubric

Part 1: Optimize PageSpeed Insights score for index.html

Optimizing CRP(Critical Rendering Path) to make index.html achieves a PageSpeed score of at least 90 for Mobile and Desktop.

Getting Started

Open index.min.html file in your browser or review online here

• Concat and Minify it all in one file
• Leverage Browser Caching
• Reduce image size
• Optimize image
• Update README file

Part 2: Optimize Frames per Second in pizza.html

Make it render with a consistent frame-rate at 60fps when scrolling and time to resize pizzas is less than 5 ms using the pizza size slider.

Getting Started

Open views/pizza.html file in your browser or review online here

• FSL issues - link 1, link 2
• Micro Optimization - link 1, link 2, link 3
• Optimize script logic - link 1, link 2, link 3
• Reduce re-paint - link 1
• Reduce CSS selector complexity
• Comments in views/js/main.js
• Optimize image
• Update README file

Others

• TinyPNG
• Secure tunnels to localhost
• Browsersync
• Gulp.js
• Web Font Loader