Recipes

Customizing the UI

Copy for LLMs
Last updated by
Harlan Wilton
 in doc: clean up.

Introduction

Unlighthouse's client interface can be customized to display the metrics most relevant to your needs. Modify columns, add custom data, and tailor the UI to your workflow.

Customizing Columns

Replace or add columns to display specific Lighthouse metrics:

Example: Replace FCP with Server Response Time

import { defineUnlighthouseConfig } from 'unlighthouse/config'

export default defineUnlighthouseConfig({
  hooks: {
    'resolved-config': function (config) {
      config.client.columns.performance[2] = {
        cols: 1,
        label: 'Response Time',
        tooltip: 'Time for the server to respond',
        sortKey: 'numericValue',
        key: 'report.audits.server-response-time',
      }
    },
  },
})
See the Column API Reference for all available column options.
Edit this page
Markdown For LLMs
Did this page help you?

URL Discovery

Learn how Unlighthouse discovers pages using sitemaps, robots.txt, and internal link crawling.

Improving Accuracy

Optimize Lighthouse scan accuracy with multiple samples and reduced concurrency for more reliable results.