Web Performance Monitor

I've been wanting and needing a dashboard for continuously testing out the performance of my site and I've never really found anything that met my needs. In the end, I put together a Web Performance Monitor.

It consists of three parts:

  • A PageSpeed library module webperf-lib-psi
    • This essentially takes either a list of URL's or a sitemap and runs it through the PageSpeed Insights API and emits events when a new result, run completion or error event occurs.
  • A Cron Job-esque module called webperf-monitor
    • Running this module with a config file containing database credentials and a sitemap URL, the tool will use the aforementioned library to crawl over a set of URLs, get the PageSpeed Scores for each of them and stash the results into a database.
  • The final piece of the jigsaw is the web front-end webperf-monitor-frontend
    • This is an uber simple NodeJS app which creates a web front-end for the data which is now stored in a database.

You can checkout what the end result is like at gauntface.com/perfmatters/

Example Screenshot of Web Perf Monitor

The end goal of this, is that over time I can extend it to include support for webpagetest.org as well as data hints from Google Analytics to create things like screenshots of the 10 most popular devices which visit my site.

Clearly I'm a way off from this grand vision, but anyone wanting to try it out, please do, pull requests and issues are welcome.

As always #PerfMatters

Orig Photo: https://flic.kr/p/6DDvQP