watching-you is a zero-dependency JavaScript and TypeScript library for building browser animations in which one DOM element continuously follows the mouse, another DOM element, or even an input value, aimed at front-end developers working in vanilla JavaScript, React or Vue.

What it is

watching-you is a client-side animation library that lives in the browser DOM ecosystem. It is written in TypeScript and published under the ISC licence, with a small core and separate framework packages: core for vanilla JavaScript, react and vue. Every framework build is dependency-free, and the core code is only about 3kb after gzip compression.

The concrete problem it solves is the glue code normally required to make an element track something else on the page. Instead of writing custom, framework-specific tracking logic for every project, a developer describes what should be watched — the mouse, another DOM element, or an input value — and the library handles the animation. Because the approach is DOM-based, responsive layouts are supported naturally rather than being a special case, and the library automatically stops watching when the element is not on the screen. That makes it a replacement for hand-rolled, per-framework tracking code in front-end work.

Key capabilities

• Watches the mouse, another DOM element, or input values, so the thing being followed is not limited to the cursor.
• Ships matching packages for three targets: core for vanilla JavaScript, react, and vue.
• Has zero dependencies in every framework build, with core code around 3kb after gzip compression.
• Is written in TypeScript throughout.
• Is DOM-based, which the project describes as making responsive web design support easy.
• Automatically stops watching when the element leaves the screen.
• Can be used without any compiler through the UMD build watching-you.umd.cjs, available from the jsDelivr CDN.

Who uses it and how

• Teams running vanilla JavaScript or WordPress sites can import the UMD build from the jsDelivr CDN and use watching-you directly, with no build step at all.
• React and Vue applications use the dedicated packages, which carry the same concept into each framework's component model.
• The project's Storybook, built with React, acts as a working reference that other frameworks can reproduce; it demonstrates examples named Login Form, Iron Chain, "Cena is watching you" and Svg Path Watcher.
• Projects that need older browser coverage can add Babel with polyfills to reach IE11, below the default baseline of Chrome 70+, Firefox 73+, Safari 14.1+, Edge 80+ and Opera 70+.
• Sites with responsive layouts benefit from the DOM-based design, since the animation follows the rendered element rather than fixed coordinates.

Getting started

Use the core package for vanilla JavaScript or the react and vue packages, or import the UMD build watching-you.umd.cjs straight from the jsDelivr CDN when no compiler is available. Documentation for each package is linked from the project homepage and the Storybook.

How it compares

No comparable or paid products are named in the facts for this entry, so watching-you stands alone in this registry. It is an ISC-licensed, zero-dependency browser library rather than a hosted service, so there is no vendor, subscription or data-handling relationship to weigh against alternatives.

When to use it — and when not to

Because it is a zero-dependency, DOM-based browser library, there is no database, storage or mail service to operate; the trade-off is that everything happens client-side and depends on the browser features listed in the compatibility table. The project warns that the API is still subject to change until version 1.0.0 is released, so teams that need a frozen, long-stable interface should wait. There are also practical constraints: when watching an input or textarea the text-align attribute must be left, inline elements such as span ignore transform unless given a display value, and a transition: transform .1s may be needed depending on the effect.