Vanilla JS & HTML

Quick setup

From your project folder, run:

readmeter add

The installer copies the widget to public/ or static/ and injects the script into all .html files in your project.

Multi-page apps

Add the script to every page that uses Firestore (e.g. index.html, user.html, content.html):

<!-- In each HTML file, before Firebase -->
<script src="/readmeter-widget.js"></script>

Manual read tracking

If you have custom Firestore logic or use the modular SDK, call recordRead manually:

window.ReadMeter?.recordRead({
  reads: 5,
  collection: 'users',
  type: 'getDocs',
  caller: 'fetchUsers',
})

Enable on any host

The widget only shows on localhost by default. To enable on production (for debugging), add ?readmeter=1 to the URL, or run in the console:

localStorage.setItem('readmeter', '1')

Then reload. Safe to leave the script in your build — it won't run in production unless force-enabled.

Next steps

• Best Practices
• Troubleshooting