Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Frontend Performance Engineering
Rating: 4.4 out of 5(47 ratings)
89 students

Frontend Performance Engineering

Performance Engineering, Performance Testing
Created bySid Sriram
Last updated 4/2024
English

What you'll learn

  • INTRODUCTION OF FRONTEND PERFORMANCE ENGINEERING
  • UNDERSTANDING WEB PERFORMANCE FUNDAMENTALS
  • OPTIMIZING WEB ASSETS
  • RESPONSIVE WEB DESIGN FOR PERFORMANCE
  • JAVASCRIPT PERFORMANCE OPTIMIZATION
  • CSS PERFORMANCE OPTIMIZATION
  • LIVE DEMO

Course content

1 section7 lectures1h 57m total length
  • Introduction25:05
  • Understanding Web Performance Fundamentals18:11
  • Optimizing Web Assets Final19:07
  • Responsive Web Design for Performance6:00
  • JavaScript Performance Optimization17:03
  • CSS Performance Optimization9:56
  • DEMO22:00

Requirements

  • No Programming experience required

Description

Module 1: Introduction to Front-end Performance Engineering

1.1 What is Front-end Performance Engineering?

1.2 Why Front-end Performance Matters

1.3 Key Metrics for Measuring Performance

1.4 Tools for Performance Measurement and Analysis


Module 2: Understanding Web Performance Fundamentals

2.1 HTTP Basics and Performance Implications

2.2 Browser Rendering Process

2.3 Critical Rendering Path

2.4 Network Performance Optimization

2.5 Caching Strategies


Module 3: Optimizing Web Assets

3.1 Optimizing Images: Formats, Compression, and Lazy Loading

3.2 Minification and Bundling of CSS and JavaScript

3.3 Efficient Font Loading Techniques

3.4 Defer vs. Async Loading of Scripts

3.5 Handling Third-party Scripts and Dependencies


Module 4: Responsive Web Design for Performance

4.1 Responsive Design Principles and Techniques

4.2 Viewport Optimization

4.3 Media Queries and Breakpoints

4.4 Adaptive Images and Media


Module 5: JavaScript Performance Optimization

5.1 Identifying and Eliminating JavaScript Bottlenecks

5.2 Reducing Execution Time with Optimized Algorithms

5.3 Memory Management and Garbage Collection

5.4 Async Programming and Promises

5.5 Progressive Web Apps (PWAs) for Performance


Module 6: CSS Performance Optimization

6.1 Efficient CSS Selectors

6.2 CSS Preprocessing and Postprocessing

6.3 Critical CSS Generation

6.4 CSS Grids and Flexbox for Performance

6.5 CSS Transitions and Animations

Who this course is for:

  • Performance Testers
  • Performance Engineers
  • Chaos Engineers