software

WebForms Core 2 in NodeJS - Don't use React, Vue, or Angular

Published: (December 25, 2025 at 07:06 PM EST)
6 min read
Source: Dev.to

Source: Dev.to – WebForms Core 2 in Node.js – Don’t use React, Vue, or Angular

Overview

The mental image most developers associate with server‑driven frameworks is usually the same: slow, stateful, feature‑poor, and tightly coupled with always‑on online interaction.

WebForms Core – a technology developed by Elanat – breaks this long‑held stereotype at a fundamental level.

A Brief History of Web Development

RevolutionWhat Changed
AJAXFreed the browser from full‑page reloads.
Asynchronous servers (e.g., Nginx)Transformed backend scalability and performance.
WebForms CoreRepresents the larger of the two revolutions – a brand‑new paradigm for server‑driven web development.

WebForms Core is not just another framework, nor is it an incremental improvement on existing models. It introduces a command‑and‑run model that moves the web away from the traditional state/UI retrieval cycle.

Comparing WebForms Core and Blazor Server

AspectWebForms Core (Command Flow)Blazor Server (Diff Flow)
Core paradigmThe server sends direct commands to mutate the DOM (e.g., <code>bc=green</code>).The server maintains a virtual DOM, calculates differences (diffs), and sends those updates.
Bandwidth usageVery low – only lightweight commands are transmitted.Moderate‑to‑high – depends on the size of each diff.
Server processingVery light – no diff calculation required.Heavy – continuous diff calculation on every update.
Connection stateCompletely stateless.Mandatory stateful – all application state lives on the server.
Server scalabilityExcellent – no diff overhead, lightweight connections.Limited – each user needs a persistent SignalR circuit plus diff processing.
LatencyVery low – commands are executed immediately.Moderate – added latency from diff calculation and transmission.
Developer experienceSimilar to traditional server‑side programming with fine‑grained DOM control.Component‑based (React/Vue‑like) but using C#.
EcosystemWorks with any backend language..NET‑only (C#).

How to Use WebForms Core

1️⃣ Client‑Side – Add the WebFormsJS script

<!-- Include the WebFormsJS library -->
<script src="https://cdn.jsdelivr.net/gh/webforms-core/Web_forms/web-forms.js"></script>

You can also download the script directly from the repository:
WebFormsJS (GitHub)

2️⃣ Server‑Side – Import the WebForms class

Choose the class that matches your server‑side language and add it to your project:

  • C# / .NET – WebForms.cs
  • Java – WebForms.java
  • PHP – WebForms.php
  • Node.js – webforms.js

Download the appropriate file(s) from the official repository:
WebForms Classes (GitHub)

Now you’re ready to start building forms with WebForms Core!

WebForms Core 2

WebForms Core 2 was released a few days ago and ships with 50+ powerful new features. Elanat is actively porting the WebForms class from C# to other popular web languages:

LanguageStatus
PHPAvailable
Node.jsAvailable
…othersPlanned (next two weeks)

Feature Highlights

  • Service Worker
  • Custom Event
  • Async capability
  • Module loading
  • WebAssembly execution
  • Format Storage
  • Master Pages
  • Front/Back (dual‑render)
  • Fetch escape
  • Queue management
  • Trigger Event
  • Server‑Sent Events (SSE)
  • Update mechanism
  • Placeholder & External Template
  • Comment Mode
  • Retry Mechanism
  • Reflection capability
  • Automatic Gzip for data & files
  • Unit‑testing tool
  • JavaScript function assignment
  • …and many more

WebForms Core 2 in NodeJS

Async Feature – Example (Node.js)

The following example demonstrates the Async feature using Node.js, Express, and WebForms Core.

// server.js
const express    = require('express');
const bodyParser = require('body-parser');
const { WebForms, Fetch } = require('./WebForms');

const app = express();
const PORT = 3000;

app.use(express.static('public'));
app.use(bodyParser.urlencoded({ extended: true }));

app.get('/', (req, res) => {
    const form = new WebForms();

    if (req.query.test_async) {
        // Synchronous messages
        form.message('Message before Async 1');
        form.message('Message before Async 2');
        form.message('Message before Async 3');

        // Switch to async mode
        form.async();

        // Asynchronous fetch (will be resolved later)
        form.message(Fetch.loadUrl('/delay'));

        // More synchronous messages that will appear **after** the async result
        form.message('Message after Async 1');
        form.message('Message after Async 2');

        // Send the assembled response
        res.send(form.render());
    } else {
        // Show a button that triggers the async test
        res.send(`
            <html>
                <body style="font-family:Arial,Helvetica,sans-serif;">
                    <form method="GET">
                        <button type="submit" name="test_async" value="1">
                            Run Async Test
                        </button>
                    </form>
                </body>
            </html>
        `);
    }
});

// Simulated delayed endpoint
app.get('/delay', (req, res) => {
    setTimeout(() => {
        res.send('Async in WebForms Core works fine!');
    }, 2000); // 2‑second delay
});

app.listen(PORT, () => console.log(`Server listening on http://localhost:${PORT}`));

Explanation

  1. Synchronous messages are added first.
  2. form.async() tells WebForms Core that subsequent messages may be asynchronous.
  3. Fetch.loadUrl('/delay') registers a request whose result will be inserted once the /delay endpoint replies (after 2 seconds).
  4. After the async call, more synchronous messages are queued.
  5. When the client receives the response, the messages appear in the exact order they were added, demonstrating seamless mixing of sync and async operations.

Want to Try It Yourself?

  1. Clone the repository

    git clone https://github.com/webforms-core/Web_forms.git
cd Web_forms

  2. Install dependencies (Node.js example)

    npm install

  3. Run the demo server

    node server.js

  4. Open http://localhost:3000 in your browser and click Run Async Test.

Closing Thoughts

WebForms Core challenges the conventional view that server‑driven frameworks must be slow, stateful, and heavyweight. By sending tiny, direct commands instead of diff‑heavy payloads, it achieves:

  • Very low bandwidth consumption
  • Minimal server CPU load
  • Stateless connections that scale effortlessly
  • Near‑instant latency for UI updates

If you’re looking for a modern, language‑agnostic, and highly performant alternative to Blazor Server—or any other server‑driven UI stack—WebForms Core is worth a deep dive.

Happy coding! 🚀

Example Server‑Side Code (Node.js)

// … previous code …

form.message("Message after Async 4"); // Next command
form.message("Message after Async 5"); // Next command
form.message("Message after Async 6"); // Next command

res.send(form.response());
} else {
    form.setGetEvent("", "onclick", "?test_async=true");

    res.send(`
        Using WebForms Core

        <button onclick="location.search='?test_async=true'">
            Click me to test async
        </button>
    ` + form.exportToHtmlComment());
}
});

app.get("/delay", (req, res) => {
  setTimeout(() => {
    res.send("Async in WebForms Core work fine!");
  }, 2000);
});

app.listen(PORT, () => {
  console.log(`Server is running on http://localhost:${PORT}`);
});

The image below shows the page’s behavior after clicking the button: all six messages appear immediately, while the message “Async in WebForms Core work fine!” is delayed by two seconds and executed last.

WebForms Core technology in NodeJS

Calling form.async(); makes the next command execute asynchronously.
If you have many commands, use the startBracket and endBracket methods.

Example with Asynchronous Brackets

form.message("Message before Async 3"); // Previous command
form.async();
form.startBracket();
form.message(Fetch.loadUrl("/delay"));
form.addTag("", "h1");
form.setText("", Fetch.method("heavyTask"));
form.endBracket();
form.message("Message after Async 4"); // Next command

Note:
WebForms Core consists of two parts: server and client.

  • Client side: the library WebFormsJS (web-forms.js).
  • Server side: a class named WebForms with an extension that matches the server language (e.g., .cs for C#, .js for Node.js).
    Do not confuse the server‑side class with the client‑side web-forms.js library.

A Truly Multi‑Language UI Technology

One of the most overlooked — yet revolutionary — aspects of WebForms Core is this:

The same UI runtime works across multiple server languages.

The exact same WebFormsJS engine can be driven by:

  • PHP
  • Node.js
  • .NET
  • Python
  • Java
  • Any popular programming language on the web

This means

  • No language‑specific front‑end frameworks
  • No duplicated UI logic
  • No rewriting UI behavior when switching backend stacks

The UI protocol is language‑agnostic.
Only the server‑side authoring language changes.

More Than Features: A Coherent Architecture

WebForms Core can:

  • Build real game loops
  • React to DOM mutations
  • Provide advanced offline storage
  • Perform client‑side diffs
  • Trigger logic based on DOM conditions

All of that is impressive, but the async example proves something deeper: WebForms Core has a temporal model of UI. Time is not an afterthought; it is part of the UI DSL itself.

A Fair Comparison

TechnologyAsync UI Model
ReactPowerful, but complex
VueSimpler, JS‑centric
Blazor ServerHeavy, stateful
WebForms CoreDeclarative, non‑blocking, language‑agnostic

Final Thoughts

This Node.js example is small, but its implications are large. It demonstrates that:

  • Server‑authored UI can be asynchronous.
  • Async does not require client‑side code.
  • UI timing can be declarative.
  • One runtime can serve many languages.

WebForms Core is a powerful stateless server‑side technology that provides full remote DOM control. It is an ambitious and radical technology that aims to dethrone React, Vue, and Angular.

A language‑independent, rule‑driven, time‑aware UI architecture.

And that is not a trick—it is a new category of UI frameworks.

Back to Blog

Related posts

Read more »