hyperscript is an easy and approachable language designed for modern front-end web development

writeText(#snippet's innerText)
  on navigator.clipboard
put 'copied!' into me
wait 1s
put 'copy' into me

see it in action →

hyperscript makes writing event handlers and highly responsive user interfaces trivial with native language support for async behavior—easier than callbacks, promises, even async/await.

Events as first class citizens in the language—clean syntax for receiving and sending events, as well as event-driven control flow

DOM-oriented syntax—seamless integrated CSS id, CSS class and CSS query literals

First-class web workers

Async-transparent runtime—highly responsive user experiences without callback hell

Pluggable & extendable parser & grammar

Debugger to step through hyperscript code

Inspired by HyperTalk (not AppleScript)

Companion of htmx | Comparison with vanilla JS and jQuery | Read the docs | Try it on the playground Install: <script src="https://unpkg.com/hyperscript.org@0.8.2"></script>

β hyperscript is in active development and is working to a 1.0 release. At this time, the syntax and core feature set are considered to be reasonably complete. Key areas of focus for 1.0 include additional test cases and documentation improvements. Please join us at the #hyperscript discord channel as we push to 1.0! Thank you!

NB: because hyperscript relies on promises, it does not strive for IE11 compatibility, unlike htmx.

examples

<button _="on click toggle .big-text">
  Toggle the "big-text" class on me on click
</button>

<div _="on mouseenter toggle .visible on #help until mouseleave">
  Mouse Over Me!
</div>
<div id="help"> I'm a helpful message!</div>

Mouse Over Me!

I'm a helpful message!

<button _="on click log me then call alert('yep, it’s an alert')">
  Show An Alert
</button>