Vue 3

Use the useTrueLink composable.

<script setup lang="ts">
    import { computed } from "vue";
    import { useTrueLink } from "true-link/vue";

    const v = useTrueLink({ pingUrl: "/health" });
    const label = computed(() =>
            v.value
                    ? `Online: ${v.value.isOnline} · Strength: ${v.value.strength}`
                    : "SSR…"
    );
</script>

<template>
    <div style="padding: 12px; border: 1px solid #ddd;">
        {{ label }}
    </div>
</template>

If this library helps, you can support development.