Skip to content
O'Reilly home
Learning Path

Web Performance Optimization Basics

Start
Time to complete: 6h 10m

Published byO'Reilly Media, Inc.

CreatedDecember 2019

In today’s increasingly demanding online world, one of the quickest ways to drive existing or potential customers and users to a competitor is by having a nonperformant website or app. With users becoming more discerning, you need to ensure that you’re providing the best web experience possible. This reality has pushed performance optimization to be one of the most important disciplines in app and website development. Well-designed and smooth-performing apps and sites can lead to greater conversion rates and a better user experience (UX) in all contexts.

In this learning path, designed for intermediate-level developers with an understanding of HTML, CSS, JavaScript, and web technologies in general, your host Max Firtman, shows you some of the most important things you can do to boost the performance of your web assets. As the saying goes, you can’t fix what you can’t measure, so to begin, you’ll learn the important metrics to monitor and how to measure them. Max also shows you how to set goals for your web content, find issues that can negatively affect UX, and apply some basic techniques that will improve user perception. You’ll also benefit from practical examples and formative assessment to help you absorb and retain what you’ve learned. This learning path is only the beginning of your optimization journey, so at the end we provide suggestions on how to continue along the path to delivering the best web assets you can.

What you’ll learn—and how you can apply it

  • Set modern performance goals for your web content
  • Detect problems and bottlenecks, and create a plan to mitigate them
  • Enhance the user experience of your content, improving engagement and conversion rates
  • Audit your website and web apps to see what's missing and how you can improve perception metrics

This learning path is for you because…

  • You’re a web developer or designer looking to increase user experience and perception
  • You're a web performance engineer looking to understand the modern metrics and techniques
  • You work with webs and PWAs looking to offer the fastest possible experience to your users
  • You want to become a performance engineer looking to understand the basics of web performance optimization

Prerequisites:

  • You should have a basic understanding of HTML, CSS, and JavaScript
  • You should have some knowledge of web technologies such as server-side rendering versus client-side rendering with JavaScript
  • You should be familiar with how a website is rendered on browsers and how to use a browser in general

Materials or downloads needed in advance:

  • Node.js 10+
  • The latest version of Chrome and Firefox installed

Further Resources:

  • Web Performance in Practice: This online training course provides a practical live experience on understanding web performance.
  • Hacking Web Performance: This report introduces advanced and extreme techniques that you can apply to websites to improve web performance after the basics.
  • High Performance Networking: A complete book to understand the network layer and why some web performance techniques ask you to do certain things.
  • High Performance Mobile Web: Chapter 5 offers an insight of the APIs available on the client side to measure and improve performance; from Chapter 6 you can find a complete list of techniques and additional resources to improve performance.
  • Designing for Performance: A complete reference from a designer's point of view about performance tuning apps and websites.