One <script> tag turns your live page into a review surface. Highlight, draw, pin and comment — anchored to the real content, saved in the browser, shared as a single JSON file.
>_
<script src="https://cdn.jsdelivr.net/npm/@reviewjs/annotate/annotate.js" defer></script>
Add it to your site Star on GitHub
↑ This page is live — select a sentence, press R to draw, P to pin, A for comments.
GO-TO-MARKET
We open with a two-week teaser, then give early access to our waitlist of 12,000 subscribers before the public announcement.
Paid social runs alongside, with the hero video as the centerpiece across every channel.
JD
Jane Doe
2m ago · highlight
#2
Can we pull the waitlist email a week earlier? Momentum matters.
Drops into anything that renders HTML
ReReact NxNext.js VuVue SvSvelte WPWordPress WfWebflow ShShopify
01 — The tools
Screenshots go stale and chat threads lose context. Six tools keep every note attached to the exact pixel, paragraph or region it’s about — each carrying its own threaded comment.
02 — Why reviewjs
No backend to stand up. Nothing to get past security review. It lives in the browser, exports JSON, and gets out of the way.
100%
Local · nothing leaves
No build step, no framework, no signup. Paste a line, reload, review.
Plain HTML, React, Vue, Svelte, WordPress, Webflow, Shopify, static sites.
Every comment is stored on the reviewer’s device. Nothing is sent anywhere.
Reviewers export feedback as JSON and send it; you import it with one click.
Floating toolbar, Figma-style comments panel, auto light/dark, full shortcuts.
~40 KB of vanilla JavaScript, zero dependencies, every evergreen browser.
Smart re-anchoring
Each text annotation stores the exact quote plus a short prefix and suffix. On load it re-finds that text, so highlights stay put even after you rewrite copy or the layout reflows. Delete the text entirely and the comment is kept, gracefully marked “orphaned.”
v1 the quick brown fox jumps
↓ you edit the paragraph
v2 a very quick brown fox leaps
✓ comment re-anchored automatically
04 — How it compares
Every major visual-feedback tool is paid SaaS that asks your reviewers to log in, install an extension, and trust a vendor to host your feedback. annotate.js is the local-first, open-source alternative.
Competitor pricing and capabilities are approximate, based on publicly listed 2026 plans, and change often. The honest trade-off: SaaS tools add cloud sync, real-time multiplayer and built-in Jira/Asana sync that annotate.js leaves to your own workflow. annotate.js is for teams who’d rather own a tiny, private layer than rent a heavy one.
05 — Who it’s for
Anywhere people need to point at a page and say “this, right here.”
Design
Box misalignments and circle off-brand color on the staging build before a release ships.
Agencies
Let clients mark up the staging site directly — no Loom, no spreadsheet of bugs, no logins to chase.
Content
Editors highlight sentences and leave revisions in context, on the live article, not in a separate doc.
Docs
Readers flag confusing steps right on the published page, where the confusion actually happens.
QA
Pin the exact element, attach a note, and export the batch straight to your tracker.
Teaching
Annotate student work and portfolios with threaded, resolvable comments — private to each machine.
06 — Anywhere
It’s a plain browser script, so the recipe is the same for every stack. Copy, paste, ship.
…and more: Angular Astro Squarespace Static sites Plain HTML Anything with a browser
Make it yours
No config files, no init code. Set a brand color, a project namespace, a default theme and a reviewer briefing — all on the script tag itself.
<!-- one tag, fully configured --> <script src="https://cdn.jsdelivr.net/npm/ @reviewjs/annotate/annotate.js" data-project="marketing-site" data-accent="#6d28d9" data-theme="auto" data-position="bottom-right" data-note="Focus on the hero copy & pricing — flag anything off-brand." defer ></script>
Questions
In the reviewer’s own browser via localStorage, namespaced by project and page. Nothing is ever sent to a server. To share, you export a JSON file and your teammate imports it — every note reappears anchored in place.
Yes — it’s a plain browser script. There are copy-paste recipes for React, Next.js, Vue, Svelte, WordPress, Webflow, Shopify and plain HTML in the README. The rule is the same everywhere: load it once, after the page renders.
Each text annotation stores the exact quote plus a short prefix and suffix. On load it re-finds that text, so notes survive copy edits and layout reflows. If the text is deleted entirely, the comment is kept but shown as “orphaned” rather than silently lost.
Yes. Load the script conditionally — e.g. only on a staging domain, or only for logged-in editors. Since it’s one tag, you control exactly when and where it appears.
Nothing. annotate.js is open source under the MIT license, free for personal and commercial use. No seats, no projects limit, no trial clock.
Every modern evergreen browser — Chrome, Edge, Firefox and Safari. It uses standard DOM APIs only, with no polyfills, and gracefully no-ops where localStorage is unavailable (private mode, sandboxed iframes).
07 — Get started
Copy one script tag, reload, and start marking up the live page. No build step, no framework, no signup.
>_
<script src="https://cdn.jsdelivr.net/npm/@reviewjs/annotate/annotate.js" defer></script>
Ready in 30 seconds · ~40 KB · every evergreen browser · no account required
此内容由惯性聚合(RSS阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。