From the course: Vanilla JavaScript: Web Performance Optimization APIs

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Use the Resource Timing API

Use the Resource Timing API - JavaScript Tutorial

From the course: Vanilla JavaScript: Web Performance Optimization APIs

Start my 1-month free trial

Use the Resource Timing API

- [Instructor] Do you remember that we saw this diagram with all the available timings for a document load? What happens with each resource, each JavaScript file, CSS file, webfont, image, SVG, or any document that you are loading? We do have an additional API known as Resource Timing API, and in this case, we have a simplified version of the diagram because there is no HTML, there is no parsing, where we can also get the information per resource. So let's see this in action. Now going back to the code, you can load 03_03 > Begin from the Exercise Files and after we have already played with the Navigation Timing API, we are going to add, after that, Resource Timing API. So the Resource Timing API is pretty simple. We also have to get the entries, so let's call this resEntries from resources. And in this case, we are going to getEntriesByType and the type's going to be resource. And here, we need to go through all the entries, so I'm going to use forEach, entry, similar to what we did…

Contents