Why should you care?

MarkupVerse apps keep critical markup in HTML and enhance with JS modules.

See it live — copy this example

Save as demo.html and open in your browser, or use Run Example below.

<script type="module">
import { formatINR } from '/js/mv-currency.js';
document.querySelector('[data-balance]').textContent =
  formatINR(8420.55);
</script>
<p>Available: <strong data-balance>…</strong></p>

Run Example »

Edit the code below and click Run to see the result in Toolliyo’s live editor.

What happened?

• type="module" defers by default.
• Put non-critical scripts before .
• DOM query after elements exist.

Practice next

1. Use type="module" import.
2. Target data-balance attribute.
3. Keep HTML meaningful without JS.
4. Add nomodule fallback script.
5. Use defer on classic script.

Remember

Modules defer. Enhance, don’t replace content. Scripts near body end.

MarkupVerse balance format

Account page shows raw number, JS formats INR.

Outcome: Readable ₹8,420.55 after module loads.