Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

🚥 Convert Google PageSpeed Insights audit scores of your websites to an SVG. Embed them on your website or README files. Keep results updated with GitHub Actions.

License

NotificationsYou must be signed in to change notification settings

Correia-jpv/pagespeed-insights-to-svg

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

23 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

PageSpeed Insights scores to SVG

Generate an SVG of your website's PageSpeed Insights scores

Guages

PWA

API and Usage

Important note: Do not embed url, instead embed generated svg

  • It takes time to perform audits of website. So embedding it directly would not render due to server timeout. Instead you must first visit and download the svg from the API with the desired parameters. And then embed that svg to your files.
  • Typically it takes a few seconds to obtain the results from the pagespeed API
  • Some servers don't allow (eg. google.com) or delay (eg. cloudflare) pagespeed crawler, so it may result in unexpected results.
  • The results may fluctuate slightly sometimes, you can use thetests parameter to get more accurate perfomance audit results.

API url

The API is called fromhttps://pagespeed-insights-svg.glitch.me

Simple usage

In simple form it will return result for all categories for desktop version of your website. Replaceyour_website_url with your website's url

https://pagespeed-insights-svg.glitch.me/?url=your_website_url

For example

https://pagespeed-insights-svg.glitch.me/?url=https://correiajpv.com

Theme

Default result is theme-agnostic i.e. looks good in both light and dark environment. But you can force one of two additional themes that arelight anddark.

https://pagespeed-insights-svg.glitch.me/?url=your_website_url&theme=dark

Strategy

Strategy specifies the type of device your website is audited for. You can specify strategy as eithermobile ordesktop. If none is specifieddesktop is chosen

https://pagespeed-insights-svg.glitch.me/?url=your_website_url&strategy=mobile

Category

There are 5 categories (in order)

  • Performance
  • Accessibility
  • Best Practices
  • SEO
  • Progressive Web App

By default all the categories are evaluated, but you can specify which categories to evaluate. The category parameter is a number. This is 5-bit number in binary, where if a bit is 1 then the corresponding category will be included.For example

+------------+------------+------------+------------+------------+|   Perf.    |    Acc.    |  Best pr.  |     SEO    |     PWA    |+------------+------------+------------+------------+------------+|      1     |      0     |      1     |      1     |      1     | => 0x10111 => 23+------------+------------+------------+------------+------------+

Only performance

https://pagespeed-insights-svg.glitch.me/?url=your_website_url&categories=16

All but PWA

https://pagespeed-insights-svg.glitch.me/?url=your_website_url&categories=30

Accuracy

Performance is volatile so you can request up to 3 performance audits to retrieve more precise results

https://pagespeed-insights-svg.glitch.me/?url=your_website_url&tests=3

Embedding into readme

After downloading svg you can embed into readme as following

  • markdown
![alt text](path/to/svg"tooltip text")
  • HTML
<palign="center"><imgsrc="/path/to/svg"width="XXXpx"></p>

Keep results updated with action workflow

Example

Resources

About

🚥 Convert Google PageSpeed Insights audit scores of your websites to an SVG. Embed them on your website or README files. Keep results updated with GitHub Actions.

Topics

Resources

License

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript100.0%

[8]ページ先頭

©2009-2025 Movatter.jp