---
layout: lesson
title: "Performance, CloudFlare & web fonts"
desc: "Watch some videos looking at how to check the performance of your website, set up CloudFlare for better performance & delaying font loading."

hide_show_for_marks: true
hide_markbot: true

extra_tutorials:
  - title: "Performance"
    url: performance
  - title: "Advanced performance"
    url: advanced-performance
  - title: "Advanced performance checklist"
    url: advanced-performance-checklist
    highlight: true
  - title: "Advanced performance slide deck"
    url: "/courses/web-dev-5/advanced-performance/"

steps:
  - title: "Browser developer tools"
    before: |
      This video is a quick introduction to using the browser developer tools to test the performance of your website.
    video: "8OGVUvrInWo"
  - title: "Online tools"
    before: |
      Learn about some online tools for testing website performance.
    video: "ifMHChSpZfE"
  - title: "CloudFlare settings"
    before: |
      Look at the settings inside CloudFlare to help you pass performance tests.
    video: "mb6q-MG8LWs"
  - title: "Delaying font rendering"
    before: |
      Learn how to get your website visible on screen more quickly by delaying the web fonts from rendering.
    video: "B-J5IEjilO0"
---

---
layout: lesson
title: "Performance, CloudFlare & web fonts"
desc: "Watch some videos looking at how to check the performance of your website, set up CloudFlare for better performance & delaying font loading."

hide_show_for_marks: true
hide_markbot: true

extra_tutorials:
  - title: "Performance"
    url: performance
  - title: "Advanced performance"
    url: advanced-performance
  - title: "Advanced performance checklist"
    url: advanced-performance-checklist
    highlight: true
  - title: "Advanced performance slide deck"
    url: "/courses/web-dev-5/advanced-performance/"

steps:
  - title: "Browser developer tools"
    before: |
      This video is a quick introduction to using the browser developer tools to test the performance of your website.
    video: "8OGVUvrInWo"
  - title: "Online tools"
    before: |
      Learn about some online tools for testing website performance.
    video: "ifMHChSpZfE"
  - title: "CloudFlare settings"
    before: |
      Look at the settings inside CloudFlare to help you pass performance tests.
    video: "mb6q-MG8LWs"
  - title: "Sub-setting fonts"
    before: |
      Learn how reduce the download size of the fonts on your website by removing all the extra characters that you don’t actually use on your website.

      *This is only necessary when using Google Fonts in combination with the “Delaying font rendering” technique described below.*
    video: "CVTt4msJVXM"
  - title: "Delaying font rendering"
    before: |
      Learn how to get your website visible on screen more quickly by delaying the web fonts from rendering.

      *This is only necessary when using Google Fonts—Typekit will already do this for you.*
    video: "B-J5IEjilO0"
---

Add a missing video and clarify some instructions
Add a missing video and clarify some instructions
