The Vercel Usage page provides insight into your resource usage across your projects. In this guide, you will learn how to use this page to reduce the usage of three common metrics:
- Bandwidth
- Serverless Functions
- Images
How to Use the Usage Page
The Usage page will show the usage of all projects in your Vercel account by default.
- Step 1: To investigate the usage of a specific team, switch the scope of your account to the specific team from the scope selector on the top left.
- Step 2: It is recommended to look at usage over the last 30 days to determine patterns. Change the billing cycle dropdown under Usage to Last 30 days.
- Step 3: To identify which project is causing high usage, change the Projects dropdown to a specific project until you identify the project with high usage. You can type in the dropdown to filter for projects. If you have many projects, you can also scroll down to the graph with high values and mouse over each vertical bar to display the top four projects contributing to this value.
- Step 4: Drill down further into a specific project by using the All Functions dropdown to select a specific Function. You can also type in the dropdown to filter for functions based on their file name.
- Step 5: Use the summary bar to identify areas for reduction. The summary bar is below the filter dropdowns with a summary of the total values for Networking (bandwidth), Functions (execution), Builds (build time), and Other (images) based on your current filters (date range, project, and function name).
Any value that is close to, or has exceeded limits, will be highlighted.
- Step 6: Jump to the specific sections displaying high usage and use the graphs to identify where the problem is happening based on the additional guidance provided below.
Bandwidth Usage
Check your Top Paths to find the top consuming resources. Once you have identified which project and path is using the most bandwidth, explore further based on your use case:
- If you are using Serverless Functions, you can investigate which Function has the highest execution values and work on optimizing the code for that function. Note that Serverless Functions also consume bandwidth.
- If your high Usage is coming from static assets, as shown by the Bandwidth graph under Networking, move large media files such as images and videos to a third-party storage solution.
Serverless Function Usage
To reduce the GB-hours (Execution) of your Serverless Functions, make sure that you are using edge caching and Cache-Control headers. If you are using Incremental Static Regeneration, note that Function invocations that happen on page revalidation are counted on the Usage tab (both for GB-hours and bandwidth).
For more on lowering Serverless Function usage, refer to How can I reduce my Serverless Execution usage on Vercel?.
Image Optimization Usage
If you are using next/image with Next.js applications, your Image Optimization usage will be displayed under the Other section. Source images are what count towards your Image Optimization usage. This is what you provide as the src tag in the Image component and not the optimized versions that are served to the user when requested.
Since your usage is based on the billing period, the usage count of the source images will be reset at the beginning of each period. Every time you change the value of the src tag during a billing period, an additional count will be added for that same Image component. Therefore, to reduce your image optimization usage, you could consider the following:
- Minimize the amount of times you change the
srcproperty during a billing period. - Reduce the number of entries in
domainsorremotePatternsconfig or change the pattern to be more specific.