How to persist form data across page reloads with Way.js?

Add the way-data and way-persistent='true' attributes to your form element; Way.js automatically saves inputs to localStorage and restores them on load, as shown in the quick start.

Can I use Way.js with React or Vue?

Yes, but it's not recommended—Way.js manipulates the DOM directly, which can conflict with virtual DOM systems. For simple binding in framework projects, consider built-in options like React hooks.

Way.js vs Alpine.js for simple interactivity?

Both offer HTML-centric binding, but Alpine.js is more actively maintained with a richer feature set. Way.js has built-in localStorage persistence, while Alpine.js requires extra setup for state survival.

How to handle dynamic lists or arrays in Way.js?

Use the way-repeat attribute on a container element; it duplicates DOM nodes for each item in an array and sets scopes automatically, detailed in the repeats section with examples.

Is Way.js still actively developed?

No, the GitHub repository shows minimal recent activity, and the README dates back to 2014. For production, consider newer libraries with ongoing support.

How to add custom data formatting in Way.js?

Use the registerTransform method to define a function, then apply it via the way-transform attribute, as demonstrated in the transforms section for extending functionality.

Does Way.js work with server-side rendering (SSR)?

No, it's client-only and depends on browser APIs like localStorage, so SSR frameworks won't execute its binding logic without JavaScript hydration.

way.js — Lightweight Data Binding Library

What is way.js?

Way.js is a lightweight JavaScript library that provides two-way data binding between HTML elements and JavaScript data models. It allows developers to bind form inputs, spans, and other elements to data paths, with automatic synchronization and persistence via localStorage. The library requires minimal JavaScript code, using HTML attributes for configuration.

Target Audience

Frontend developers building interactive web applications who want simple, persistent data binding without heavy frameworks. It's ideal for projects where minimal JavaScript overhead and quick setup are priorities.

Value Proposition

Way.js stands out for its simplicity, zero dependencies, and built-in persistence. Unlike larger frameworks, it focuses solely on data binding, offering a straightforward HTML-centric approach that reduces boilerplate code and integrates easily into any stack.

Simple, lightweight, persistent two-way databinding

Use Cases

Best For

Adding persistent form state to static websites
Creating simple interactive prototypes without a framework
Binding data between HTML elements and JavaScript with minimal code
Implementing two-way data binding in legacy or vanilla JS projects
Building lightweight apps that require state persistence across page reloads
Extending existing projects with data binding without refactoring

Not Ideal For

Projects requiring complex state management with actions, reducers, or middleware
Teams building large-scale, performance-critical single-page applications
Applications needing real-time data sync or offline-first capabilities beyond localStorage
Developers using modern frameworks like React or Vue who prefer integrated reactivity systems

Pros & Cons

Pros

Zero-Dependency Simplicity

Works with any JavaScript environment without external libraries, as highlighted in the README's 'framework-agnostic' and 'no dependencies' claims, making integration effortless.

Built-in State Persistence

Automatically syncs data to localStorage via attributes like way-persistent, preserving state across page reloads with minimal configuration, shown in the quick start example.

HTML-First Configuration

Uses custom HTML attributes such as way-data for binding, reducing JavaScript boilerplate and enabling quick prototyping directly in markup.

Lightweight and Extensible

Small library size focused solely on data binding, with an API for custom transforms and watchers, allowing tailored enhancements without bloat.

Cons

Limited Feature Set

Offers only basic transforms and marks filters as experimental with bugs, requiring manual code for advanced data manipulation or validation.

Performance and Scalability Concerns

Relies on DOM scanning with configurable timeouts (e.g., way.options.timeoutDOM), which can introduce lag in dynamic or large applications.

Outdated and Under-Maintained

The project appears stagnant since 2014, with incomplete documentation and testing noted in the 'To do' section, raising reliability issues for long-term use.

Frequently Asked Questions

What is way.js?

Target Audience

Value Proposition

Use Cases

Best For

Adding persistent form state to static websites
Creating simple interactive prototypes without a framework
Binding data between HTML elements and JavaScript with minimal code
Implementing two-way data binding in legacy or vanilla JS projects
Building lightweight apps that require state persistence across page reloads
Extending existing projects with data binding without refactoring

Not Ideal For

Projects requiring complex state management with actions, reducers, or middleware
Teams building large-scale, performance-critical single-page applications
Applications needing real-time data sync or offline-first capabilities beyond localStorage
Developers using modern frameworks like React or Vue who prefer integrated reactivity systems

Pros & Cons

Pros

Zero-Dependency Simplicity

Works with any JavaScript environment without external libraries, as highlighted in the README's 'framework-agnostic' and 'no dependencies' claims, making integration effortless.

Built-in State Persistence

Automatically syncs data to localStorage via attributes like way-persistent, preserving state across page reloads with minimal configuration, shown in the quick start example.

HTML-First Configuration

Uses custom HTML attributes such as way-data for binding, reducing JavaScript boilerplate and enabling quick prototyping directly in markup.

Lightweight and Extensible

Small library size focused solely on data binding, with an API for custom transforms and watchers, allowing tailored enhancements without bloat.

Cons

Limited Feature Set

Offers only basic transforms and marks filters as experimental with bugs, requiring manual code for advanced data manipulation or validation.

Performance and Scalability Concerns

Relies on DOM scanning with configurable timeouts (e.g., way.options.timeoutDOM), which can introduce lag in dynamic or large applications.

Outdated and Under-Maintained

The project appears stagnant since 2014, with incomplete documentation and testing noted in the 'To do' section, raising reliability issues for long-term use.

Frequently Asked Questions

way.js

What is way.js?

Overview

Use Cases

Best For

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions

Related Projects

Found a gem we're missing?

way.js

What is way.js?

Overview

Use Cases

Best For

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions

Related Projects

Found a gem we're missing?