With Foo's Vercel Integration, you can monitor performance, SEO and page quality via Lighthouse of your production deployments automatically.
Foo's Vercel integration does the following:
- On every successful Vercel production deployment, Foo will run both mobile and desktop Lighthouse audits against all pages you've added on Foo matching the production domains you've specified during setup.
- Results of each Lighthouse audit are persisted to your account and surfaced in historical timelines of scores for each page. See the demo's for a full picture. In the timeline chart each Vercel deployment will be displayed as a marker and annotation of the deployment. This way, if you have a premium plan in which Lighthouse runs occur throughout the day or if you've manually triggered any, the ones ran via Vercel can be easily identified by these markers (screenshot below).
- Number of Lighthouse audits ran per day are limited by account plan "triggered Lighthouse runs per day".
The above screenshots illustrate what Foo's Vercel integration provides. The deployment markers are clearly identified on the charts which show a timeline of all Lighthouse runs per page via Foo (figure 1). Hover over the marker to see the annotation (figure 2). We populate the associated GitHub commit message if applicable (ex: "feat: all the things"). Stay tuned for commit messages from other Git hosts. Click on the marker to see details of the Lighthouse run (figure 3) and access the full report (figure 4).
How to Setup Foo's Vercel Integration
To set up the integration, you need to have a Vercel account and a Foo account. If you don't have a Vercel account, you can sign up for free. If you don't have a Foo account, you can sign up for free.
To set up the integration, follow these steps:
- Go to the Foo integration page on Vercel.
- Click Add integration.
- Select the Vercel account you want to connect to Foo. Click Continue.
- Select the Vercel projects you want Foo to have access to. Click Continue.
- Review requested permissions and proceed if you agree.
- You will be redirected to Foo, you will see a checklist of your production domains. Select the domains you'd like to run Lighthouse against per deployment. After this setup, you will later specify exact pages of these domains. If you ever need to change these domains in the future, you can simply delete this integration and then add it again (you will not lose any data).
- Login or register with Foo on the next screen.
- At the end of this flow be sure to click Finish.
Configure Foo's Vercel Integration After Setup
After you set up the integration, you can configure it by going to the Vercel dashboard, where you can find the Foo integration.
To configure the integration, follow these steps:
- Find the Foo integration in the list of integrations.
- Click Configure.
- This will always navigate you to www.foo.software with a reminder on how to add pages to run Lighthouse audits on for Vercel deployments.
- Make sure you've confirmed your email with Foo by clicking on the link you should have received in an email from us. If you didn't receive this email, please contact us.
- On this screen you can add or update pages for Vercel deployments or unrelated pages (limited by your account plan).
Adding More Domains at a Later Time
If you need to add more domains to this integration at a later time, you can simply delete this integration and add it again. You will not lose any data.
Using Foo Beyond Vercel Integration
Foo provides the best value when coupled with integrations like Foo's Vercel integration, Slack and more with a premium plan. The more pages you add, the better perspective you'll gain about general website page quality and how your website stacks up. The free plan may be all that you need, however you will have a limited number of Lighthouse runs per day. To maximize Foo's offerings, checkout the premium plans here and upgrade anytime!
Checkout the below article for a better summary of services provided by Foo:
Adam Henson