FPS Meter Overlay (Shell Shockers)

FPS counter with color warning (green/yellow/red)
Ask a question, post a review, or report the script.
Wrap lines
// ==UserScript==
// @name         FPS Meter Overlay (Shell Shockers)
// @namespace    http://tampermonkey.net/
// @version      1.2
// @description  FPS counter with color warning (green/yellow/red)
// @author       Arham
// @match        https://shellshock.io/*
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    const fpsBox = document.createElement("div");
    fpsBox.style.position = "fixed";
    fpsBox.style.top = "10px";
    fpsBox.style.left = "10px";
    fpsBox.style.zIndex = "999999";

    fpsBox.style.padding = "10px 14px";
    fpsBox.style.background = "black";
    fpsBox.style.fontFamily = "monospace";
    fpsBox.style.fontSize = "22px";
    fpsBox.style.fontWeight = "bold";
    fpsBox.style.borderRadius = "8px";
    fpsBox.style.pointerEvents = "none";
    fpsBox.style.border = "2px solid #00ff00";

    fpsBox.innerText = "FPS: ...";
    document.body.appendChild(fpsBox);

    let lastTime = performance.now();
    let frames = 0;
    let fps = 0;

    function updateColor(fps) {
        if (fps >= 50) {
            fpsBox.style.color = "#00ff00"; // green
            fpsBox.style.borderColor = "#00ff00";
        } else if (fps >= 30) {
            fpsBox.style.color = "#ffff00"; // yellow
            fpsBox.style.borderColor = "#ffff00";
        } else {
            fpsBox.style.color = "#ff0000"; // red
            fpsBox.style.borderColor = "#ff0000";
        }
    }

    function loop() {
        const now = performance.now();
        frames++;

        if (now >= lastTime + 1000) {
            fps = frames;
            frames = 0;
            lastTime = now;

            fpsBox.innerText = `FPS: ${fps}`;
            updateColor(fps);
        }

        requestAnimationFrame(loop);
    }

    loop();
})();