search

danielroe / page-speed.dev

https://page-speed.dev
MIT License
316 stars 13 forks source link

Embeddable SVG status badges 📛 #26

Open JamieSlome opened 5 months ago

JamieSlome commented 5 months ago

Suggested improvements 🔨

As page-speed.dev serves as a performance and usability metric for websites, web developers and site owners should be able to transparently share their scores via an embeddable HTML element or Markdown badge.

Requirements 📏

  1. The badge should be able to present real-time (or close to real-time via cache) scores for Lighthouse and Core Web Vitals
  2. The status badge should be embeddable as an HTML element or Markdown image
  3. Customisability over the contents of the badge, i.e. choose to display Lighthouse or Core Web Vitals, or both

Considerations 💭

This is fairly similar to the OpenGraph code and infrastructure in place; perhaps we could re-use to support the implementation of status badges and embeddable elements.

JamieSlome commented 5 months ago

@danielroe - am I on the right track?

api/
crux/
run/
badge/
├─ [domain].get.ts

badge/[domain].get.ts

export default defineCachedEventHandler(async event => {
  .
  .
  const image = ...
  return image.toString()
})
danielroe commented 5 months ago

Yep! But I think we can directly return an SVG string rather than a binary image.