Way js

A javascript Web framework

Html, Signals
& Web Components

Look Mum, no jsx!

and the build step is optional again

I think these 3 go so well together. as minimal as possible with all the power of a full framework

HTML first

Just write html again, no jsx, no vdom, what you see is what you get. the framework jsut attaches itself to the dom via custom html attributes . write vanilla html & js again, and work directly with the actual dom again.

Web Components

But we still want components, they are such a powerful way to composition your page or app. Write function components, and use them by their name like you would in jsx, web components already let us do that. Pass in props etc. just like in any js framework.

Signals

But web components alone don't have any reactivity. With signals we get fine grained reactivity, and can update just the relevant dom nodes and their attributes.

DOM

all state is automatically available to all child nodes, just like css-variables, while custom events bubble up the dom tree. forget about prop drilling and passing callbacks around, use the DOM!

Basics

Define a component with `Way.comp('field',()=>{...})`, anything you return will be available in dynamic attributes in your html.
Attach it to any dom node with `x-comp="field"` and all children can now access the 'name' variable.

Hi my name is:
"{name.value.toUpperCase()}"

please enter your name

Props

Now we can build complex logic by passing signals between components as props. Let's reuse our counter component and use it for a countdown

Counter : {count}

Forms

Input and form valdiation is one of the main reasons that client side interactivity is needed. So I wanted to build this right into the framework.
The error is automatically shown in the related aria-describedby element if there is one.

Define a form with `way.form('login',...)`, apply it to any form element with `<form x-form="login" >`

Build smooth MPAs

With ViewTransitions (jsut landed in Firefox!) your MPA will like an SPA.
Make your routes even faster with new speculation rules and a polyfill - our extra library.

Also I'm using the browser Signal proposal. If or when they land in the browser this is another part the browser will provide for us out the box!

Web platform & html first

Frameworks should be compatible with html, vanilla js & web-components, so we can stop vendor lock-in. You shouldn't be stuck with a framework because of a component library.

All libraries should be compatible with your stack, why are we rebuilding the same features in each framework?