ai-agent

web-performance-monitoring-system

Name: web-performance-monitoring-system
Author: wangweianger

Monitor performance with this system, ideal for founders using NodeJS and VueJS.

From the repo · “A complete performance monitoring system.”

intermediate⏱ 30 minutes💵 Free tier + paid plans

457 stars109 forksJavaScriptGuide quality 8/10 · reviewed Jul 1Updated 3/16/2019100% free · open source

What it is

Tracks how fast your website loads so you can fix slowdowns.

Real use case example

"A founder, Sarah, creates a performance monitoring system for her e-commerce website built in NodeJS and VueJS. She sets up the system to monitor her website's loading speed and configure alerts when performance drops. With this system, she finds and addresses a slow database query, improving site speed by 20% in 3 days."

Best insideCursorContinue

When to use it

•When optimizing a slow-loading NodeJS application
•When debugging performance issues in a VueJS single-page application
•When ensuring a seamless user experience across different browsers and devices

Ready-to-paste prompt

node index.js --app=http://example.com --metrics=cpu,memory

Heads up: Make sure you have NodeJS version 14 or higher installed, as the monitoring system relies on modern JavaScript features

Saves to your device

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

🛠️ Technical setup

Expect 20–40 minutes in a terminal — or let your AI agent drive it.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/web-performance-monitoring-system && curl -fsSL https://workflowstacks.com/api/skills/web-performance-monitoring-system/claude-skill -o ~/.claude/skills/web-performance-monitoring-system/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

How web-performance-monitoring-system works

Codeflow

Free to inspect

Web-performance-monitoring-system is a very large JavaScript project (~71k lines across 235 code files). It is a full software project: use it through its install path rather than reading it end to end. Last commit 93 months ago, no license file, has a test suite.

Size

Very large codebase

~71k lines · 235 code files · days to read — use, don't read

Setup

Developer setup

A real software project. Use it via its install path; don't expect to read it all.

Runs on

Node.js

No API keys detected

JavaScript 43%PLpgSQL 26%CSS 23%HTML 7%

Where to start reading

1
README.md
Start here — what it does and how to install it
2
src/app.js
Where the program starts running
3
package.json
Dependencies and the commands it exposes
4
demo/01.png
A worked example — copy this to get going

What's in each folder

src/Core code — the actual logic468 files

demo/Examples you can copy7 files

READMEHas testsThin docsNo CIExamples includedNo licenseLast update 93 mo ago

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

🛠️ Technical setup

Expect 20–40 minutes in a terminal — or let your AI agent drive it.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/web-performance-monitoring-system && curl -fsSL https://workflowstacks.com/api/skills/web-performance-monitoring-system/claude-skill -o ~/.claude/skills/web-performance-monitoring-system/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

Quick Actions

Details

Creator

wangweianger

Language

JavaScript

Do this with a working workflow

Pages we wrote and tested that put a skill like this to work — importable n8n templates, outcome guides and Claude Desktop configs.

Outcome guide

Automate your weekly client reports

Keep each client’s metrics in a Google Sheet. Every Monday the workflow reads the week’s numbers, writes a plain-English narrative — what moved, why, and what’s next — and emails it to the client.

Outcome guide

Score your leads by ideal-customer fit

You describe your ideal customer once and keep leads in a Google Sheet. The workflow scores each 1–5 for fit with a one-line reason, so you sort and work the best first.