How to Monitor Domvm with Vigilmon

Domvm is a tiny, blazing-fast virtual DOM library for building reactive UIs in JavaScript. Its minimal API and sub-10 KB footprint make it an attractive choice for performance-critical web apps. But lean bundle size doesn't insulate you from server outages, failed deployments, or silent background job crashes. Vigilmon provides continuous HTTP monitoring, heartbeat checks, and instant alert delivery so you detect failures the second they happen — not hours later.

What You'll Build

• A /health endpoint for your domvm Node.js backend
• Vigilmon HTTP monitors for your app and API
• A heartbeat monitor for scheduled background jobs
• Alert channels (email and Slack)
• An uptime badge rendered in your domvm UI

Prerequisites

• A Node.js project using domvm (with Express or a plain HTTP server)
• A free Vigilmon account

Step 1: Add a Health Endpoint

Domvm drives client-side UI updates, but your backend still needs an HTTP health endpoint that Vigilmon can probe at one-minute intervals:

// server.js
import express from "express";

const app = express();

app.get("/health", async (req, res) => {
  const checks = {};
  let degraded = false;

  // Database connectivity check
  try {
    // await db.query("SELECT 1");
    checks.database = "ok";
  } catch (err) {
    checks.database = `error: ${err.message}`;
    degraded = true;
  }

  // External API reachability check
  try {
    const response = await fetch("https://api.yourservice.com/ping", {
      signal: AbortSignal.timeout(3000),
    });
    checks.externalApi = response.ok ? "ok" : `http_${response.status}`;
  } catch {
    checks.externalApi = "unreachable";
    degraded = true;
  }

  res.status(degraded ? 503 : 200).json({
    status: degraded ? "degraded" : "ok",
    timestamp: new Date().toISOString(),
    checks,
  });
});

// Serve your domvm app's static assets
app.use(express.static("public"));

app.listen(process.env.PORT ?? 3000, () => {
  console.log("Server running on port", process.env.PORT ?? 3000);
});

Test it locally:

curl http://localhost:3000/health | jq .
# {"status":"ok","timestamp":"2026-07-03T...","checks":{"database":"ok","externalApi":"ok"}}

Step 2: Configure Vigilmon HTTP Monitors

Log in to Vigilmon → Monitors → New Monitor:

Monitor 1: Domvm App (Frontend)

| Field | Value | |---|---| | URL | https://yourapp.com/ | | Method | GET | | Expected status | 200 | | Expected body | A stable string from your HTML shell | | Check interval | 1 minute |

Monitor 2: Health API

| Field | Value | |---|---| | URL | https://yourapp.com/health | | Method | GET | | Expected status | 200 | | Expected body | "status":"ok" | | Check interval | 1 minute |

Two separate monitors mean a CDN failure (frontend unreachable, API healthy) is distinguishable from a backend database failure (API degraded, frontend still served).

Step 3: Heartbeat for Background Tasks

Domvm UIs often display data produced by background processes — API polls, scheduled imports, cache warming. A Vigilmon heartbeat detects when these jobs stop executing silently:

// scheduler.js
import cron from "node-cron";

const VIGILMON_HEARTBEAT_URL = process.env.VIGILMON_HEARTBEAT_URL ?? "";

async function pingHeartbeat() {
  if (!VIGILMON_HEARTBEAT_URL) return;
  try {
    await fetch(VIGILMON_HEARTBEAT_URL, { signal: AbortSignal.timeout(5000) });
  } catch {
    // Never let heartbeat errors crash the scheduler
  }
}

// Run every 10 minutes
cron.schedule("*/10 * * * *", async () => {
  try {
    await refreshViewData();
    await pingHeartbeat(); // Only ping after successful execution
  } catch (err) {
    console.error("[scheduler] View data refresh failed:", err);
    // No ping → Vigilmon alerts when the heartbeat window expires
  }
});

async function refreshViewData() {
  // Fetch and store the data your domvm views consume
}

Set up the heartbeat in Vigilmon:

1. Monitors → New Heartbeat Monitor
2. Set Expected interval to 20 minutes (2× the cron interval)
3. Add the ping URL to your environment:

VIGILMON_HEARTBEAT_URL=https://vigilmon.online/api/heartbeat/xxxxxxxx

Step 4: Embed an Uptime Badge in Your Domvm UI

Domvm's functional view API makes it easy to include a static Vigilmon badge in your component tree:

// app.js (client-side with domvm)
import { createView, defineElement } from "domvm";

const BADGE_URL = "https://vigilmon.online/api/badge/your-monitor-id.svg";
const STATUS_URL = "https://vigilmon.online/status/your-monitor-slug";

function AppView(vm, data) {
  return () => ["div.app",
    ["main", renderContent(data)],
    ["footer.footer",
      ["a", {
        href: STATUS_URL,
        target: "_blank",
        rel: "noopener noreferrer",
        "aria-label": "Service uptime status",
      },
        ["img", {
          src: BADGE_URL,
          alt: "Uptime",
          width: 120,
          height: 20,
        }],
      ],
    ],
  ];
}

function renderContent(data) {
  return ["p", data.message];
}

const vm = createView(AppView, { message: "Your app content here." });
vm.mount(document.getElementById("app"));

Because domvm only patches the virtual DOM nodes that differ between renders, the badge element is created once and remains untouched during subsequent state updates.

Step 5: Set Up Alert Channels

In Vigilmon's Alert Channels settings:

Email Alerts

1. Alert Channels → Email → add your on-call address
2. Attach the channel to both HTTP monitors and the heartbeat monitor

Slack Alerts

1. Create a Slack Incoming Webhook for your #alerts channel
2. Alert Channels → Webhook → paste the Slack webhook URL
3. Use this payload template:

{
  "text": "🚨 *{{ monitor.name }}* is DOWN\n{{ monitor.url }}\nStatus: {{ event.status }}\n<https://vigilmon.online|Open Vigilmon>"
}

Step 6: Verify Everything Works

# 1. Confirm health endpoint returns 200
curl -s https://yourapp.com/health | jq .status

# 2. Simulate a failure — break your DB connection string and redeploy
# Expected: health endpoint returns 503; Vigilmon alerts within ~2 minutes

# 3. Remove the heartbeat URL and let the scheduler run one cycle
# Expected: heartbeat alert fires after the grace window expires

# 4. In Vigilmon → "Test Alert" to confirm Slack/email delivery

Summary

| Monitor | What It Catches | |---|---| | HTTP app check | CDN failures, broken static file serving | | HTTP health API | Database, cache, and external dependency failures | | Heartbeat | Scheduler crashes, silent data refresh failures |

Next Steps

• Create separate Vigilmon projects for staging and production
• Use Vigilmon's response time graphs to correlate latency spikes with domvm re-render cycles
• Configure multi-channel alerting with different severity thresholds per environment

Ready to get started? Sign up for Vigilmon free — have your first monitor running in under 5 minutes.