Lighthouse • 1 min read

Automated Lighthouse Check: Getting Started

Foo's Automated Lighthouse Check can be used to monitor the overall quality of your website and provide a historical record of changes. You can track SEO, performance, accessibility, best practice and progressive web app standards. It uses Google's Lighthouse under the hood to provide a granular set of metrics and scores in these categories.

To get started follow these steps to start tracking web pages.

  1. Register for an account.
  2. Add URLs you'd like to track in the dashboard.
  3. For a detailed view of of a page's results you can click into the "more" link of a given page results card in the dashboard screen.
  4. You can trigger audits manually by clicking the refresh icon at the bottom right of the screen once in the URL details page by following the previous step.
  5. View full page reports by clicking "view full report" for any results card in the URL details page.
  6. From this detail page you can click the "edit" button in the top right to update default Lighthouse settings, add extra headers, and Slack alerting.

Note: With free accounts you can trigger Lighthouse audits manually and keep a record of changes, however for automatic runs you'll need a premium account. You can choose this route whenever you feel comfortable and cancel anytime. Sign up for a premium account by navigating to the pricing page.

Next.js, GraphQL, Recoil, MUI and More: A New Web Stack Reviewed
Next.js

Next.js, GraphQL, Recoil, MUI and More: A New Web Stack Reviewed

With our website redesign we revamped our technology stack. This post reviews choices including Next.js, GraphQL, MUI (Material UI), and TypeScript.

Read more

A New Day in SEO and a New Foo - Lighthouse, Web Vitals and Page Experience
foo

A New Day in SEO and a New Foo - Lighthouse, Web Vitals and Page Experience

An overview of the newly released version of www.foo.software, a website leveraging Lighthouse, Web Vitals and Binoculars tools to provide page experience testing services.

Read more

How to Collect and Analyze Web Vitals from Next.js for Page Experience
Web Vitals

How to Collect and Analyze Web Vitals from Next.js for Page Experience

Google's Web Vitals is becoming the standard for measuring page experience. As of version 9.4 of Next.js, it provides a built-in method for capturing and reporting Core Web Vitals. This post illustrates how to collect Web Vitals metrics from a Next.js app and send them to a service for storage.

Read more