We Killed the Monster: WebForms Core 2.0 Released and the End of the Front-end Era of Terror

Source: Dev.to

Introduction: Anatomy of a Modern Nightmare

The world of web development had gone astray. The front‑end, once a simple tool for displaying information, had evolved into a monster. It bled developers dry with heavy frameworks, endless toolchains, multi‑gigabyte node_modules, and the dizzying complexity of state management.

At Elanat, we have slain this monster—not with another competing tool, but with a revolutionary paradigm shift. WebForms Core 2.0 is the definitive answer to the questions that modern frameworks (like React and Angular) and even hybrid solutions (like Blazor Server) have failed to answer.

Version 2 of the WebForms Core technology has been released, and the WebForms class in C# has been aligned with the WebFormsJS library.

The WebForms class for PHP has also been aligned with version 2, and we will soon update the WebForms classes for other languages (Python, Go, Java, etc.) to align with WebFormsJS v2.

≈ 99 % Performance Guarantee

In this release we not only tested new features, but also thoroughly evaluated all WebForms Core features from the beginning, fixing any bugs we encountered (most of which were minor). We used a regression‑testing model: after each round of corrections we retested every system feature to ensure the new changes did not break anything previously working. While testing performance, we also added several new features based on the needs we identified.

WebForms Core vs. Front‑end Frameworks (React, Vue, Angular)

Version 2 of WebForms Core has achieved a significant advantage over traditional front‑end frameworks by providing new and diverse features. The only limitation compared with those frameworks is a smaller ecosystem and developer community, so resources, plugins, and public documentation are not as extensive as for React or Vue. We will soon compensate by organizing documentation and creating various module packages.

WebForms Core is the most comprehensive platform for full‑stack development and an exceptional implementation of the server‑driven UI idea.

How to Use WebForms Core Technology?

Two steps are required:

1. Client side – Add the WebFormsJS script to your HTML page.

   <!-- Insert WebFormsJS script tag here -->

   Get the script from:

2. Server side – Import the WebForms class for your programming language.

   Get the class from:

   How to do it – Create an instance of the WebForms class on the server side and use its powerful functions.

   WebForms form = new WebForms();
   form.AddTag("", "h3");
   form.SetTextColor("", "lightblue");
   form.SetText("", "Hello World!");
   form.AddState("#state1");
   Write(form.Response());

Why Current Models Are Obsolete?

Almost the entire web today operates on two models:

WebForms Core 2.0 eliminates these time‑consuming, resource‑heavy steps by introducing Imperative Command Flow. Instead of sending whole data sets or HTML for comparison, the server sends direct commands.

• In Blazor Server, the server must maintain a copy of the client’s DOM and perform heavy diffing calculations.
• In WebForms Core, the server is stateless and simply says, “Turn the Main tag’s color to green.” That’s it! This results in near‑zero latency, negligible bandwidth consumption, and breathtaking server scalability.

Most Important Features in WebForms Core 2

1. Master Pages and Service Worker

Perhaps the most stunning part of version 2 is the Master Pages system. By combining a Service Worker and routeAlias on the client, the application’s main layout is cached forever. When a user clicks a link, the system recognizes the layer is already in memory, sends a Post‑Back header, and the server transmits commands only for the “ section.

You get the power of the server with the speed of a native application.

2. WasmBack and FrontBack

We have broken the boundaries of programming languages.

• WasmBack – Allows languages like Rust, C++, Go, and C# to use the WebForms class directly in the browser (WebAssembly).
• FrontBack – For the 2 % of scenarios requiring pure client logic, you no longer need messy JS spaghetti code. FrontBack lets JS modules generate WebForms commands.

WebForms Core is now an “Operating System for the Web” that speaks every language.

3. Unit Testing the DOM — From the Server

Frontend unit testing is usually fragile and slow. WebForms Core enables you to write server‑side tests that assert the exact DOM commands the server would emit, making tests deterministic, fast, and easy to maintain.

4. Smart Form Submissions: Only Send What Truly Changed

Traditional frameworks blindly resend entire form payloads, forcing the server to re‑validate, re‑parse, and re‑process data that the user never touched.

WebForms Core 2.0 introduces Smart Form Submissions. Only fields that have actually changed are transmitted to the server. This is not a cosmetic optimization — it is a state‑aware protocol feature.

The framework tracks the initial and current state, computes checksums, and guarantees that unchanged data is never resent.

The result

• Dramatically smaller request payloads
• Faster server processing
• Clear detection of real user intent
• A foundation for secure, large‑scale enterprise forms

This is form submission done correctly for the first time.

5. TriggerEvent: Programmatic Control Over User Interactions

With TriggerEvent, the server can execute any DOM event — click, input, submit, change, or custom events — without user interaction.

This enables

• Fully automated UI flows
• Complex orchestration without client‑side scripts
• Server‑driven UX logic that remains deterministic and testable

The server is no longer reacting to the UI.
The server is orchestrating it.

6. Custom DOM Events: Expanding the Browser’s Event Model

WebForms Core 2.0 allows developers to define entirely new DOM events on the server and bind them seamlessly to client elements. These custom events behave like first‑class browser events:

• They can be triggered
• They can be listened to
• They can be passed through the command pipeline
• They can be combined with native events

This effectively extends the browser’s event system using server logic — something no mainstream framework offers.

7. Async Command Execution: Non‑Blocking UI Without Complexity

Async Commands can be executed using async/await, delayed, or run independently — without breaking execution order or UI integrity.

• Heavy operations are isolated.
• Lightweight UI updates remain instant.
• No race conditions.
• No callback hell.

This is true asynchronous UI orchestration, server‑controlled and deterministic.

8. Automatic Gzip: Bandwidth as a First‑Class Concern

The framework natively supports

• Gzip compression for outgoing data
• Automatic decompression of incoming form data and file uploads

Applies transparently to

• Action Controls
• Form submissions
• File uploads
• Large payloads

The developer writes zero extra code.

9. JavaScript Modules Without Dependency Chaos

WebForms Core 2.0 fully embraces ES Modules:

• Native type="module" support
• Dynamic async loading
• Safe detection of method existence
• Direct invocation from server commands

You get modern JS capabilities without surrendering control to a client‑side framework.

10. Smart Templates & Deep Replace Engine

Smart Templates provide

• Placeholders anywhere (text, attributes, tag names)
• Deep‑traversal replacement
• Partial and surgical updates
• External template fetching from HTML, JSON, XML, or INI

Templates become living structures, enabling

• Large‑scale UI reuse
• Ultra‑fast updates
• Zero re‑rendering

WebForms Core 2.0 — Technical Reference (Feature List)

Version 2 of WebForms Core technology includes new, more powerful, and extensive features. Below is the complete feature list.

1. Architecture

1.1 Command Execution Model

• Optimization Pre‑Runner Queue System
• Dynamic Command Queue Management
• Preventing Concurrent Request Collisions
• Ordered Command Execution
• Debounce Delay

1.2 Async & Runtime Model

• Fully async WebFormsJS architecture
• Async Action Controls
• Awaitable Server Commands
• Async Cache & Session Access
• Async Delay Between Commands
• Async JavaScript Module Loading
• Async FrontBack Execution
• Async WasmBack Response Handling

1.3 Layout & Rendering Strategy

• Master Pages architecture
• Partial rendering via Post‑Back header
• Layout caching
• Cached layout reuse across routes
• Body onload routing detection
• Skip layout rendering on Post‑Back
• Combined HTML + ActionControl responses
• Comment‑mode rendering

2. Communication

2.1 HTTP & PostBack

• PostBack / GetBack / TagBack
• Action Control data submission
• Submit button support
• Form submission detection
• Form header injection (form=true)
• Change‑only form submission
• Serialized event data transport
• SendBack (non‑URL‑encoded payloads)
• GraphQL‑compatible transport
• GET encoding optimization

2.2 WebSocket

• Command‑based WebSocket responses
• WebSocket form detection
• Optimized data transmission
• Mixed HTML + Command responses
• Retry on WebSocket failure

All features are native, deterministic, and require no external libraries.

WebForms Core 2.0 – Feature Overview

1. Ket Logging

• Queue‑Safe WebSocket Execution

2. Server‑Sent Events (SSE)

• Native SSE support
• SSE broadcast from View / Controller / Model
• SSE ExportToLineBreak
• SSE retry & reconnect handling
• SSE console logging
• SSE configuration options
• SSE without middleware dependency

3. Network Optimization

• Automatic GZIP data compression (client → server)
• Automatic GZIP file compression (client → client)
• Small command payloads
• Skip unchanged‑data transmission

4. DOM & UI Commands

4.1 DOM Selection

• Advanced tag selectors
• Multiple‑tag selection (*)
• Query‑All support across outputs
• Deep DOM traversal
• External HTML tag extraction

4.2 DOM Manipulation

• Replace (text / attribute / value)
• Placeholder‑based replace
• Deep replace traversal
• Update structure
• Increase / decrease numeric values
• Append / insert / remove operations
• Reflection (attribute & child inheritance)
• HTML part injection
• Template‑based rendering

4.3 UI State & Interaction

• TriggerEvent (artificial DOM events)
• Custom DOM events
• Window‑level event binding
• Element‑reached event
• Scroll‑to‑bottom event
• InputPlace (window / element)
• Automatic loader system
• Flicker prevention
• Interaction lock during requests

5. State, Storage & Security

5.1 State Management

• Client‑side cache management
• Client‑side session management
• Add / insert cache values
• Add / insert session‑cache values
• Awaitable storage operations
• FormatStorage with variables
• Template storage
• Variable injection into storage

5.2 Integrity & Validation

• Checksum generation
• SHA‑256 hash support
• Server‑side checksum validation
• Hash storage & lookup
• HasHash condition checks
• Detect‑executed‑action controls
• Prevent duplicate submissions
• Data‑integrity verification

5.3 Security Controls

• Security configuration options
• XSS mitigation layer
• Module‑execution restrictions
• Method‑existence validation
• Browser‑capability detection
• Unsupported‑feature logging

6. Runtime Extensions & Cross‑Platform

6.1 WasmBack

• WebForms execution in WebAssembly
• Shared WebForms class (server & WASM)
• Action‑control detection in WASM responses
• Multi‑language support (C#, Rust, Go, C++)
• WASM command application to HTML

6.2 FrontBack

• Server‑less WebForms execution
• JavaScript‑based WebForms class
• Page‑load execution in front‑end
• HTML & action‑control generation in JS
• Hybrid front / server scenarios

6.3 JavaScript Modules

• Native ES‑module support (type="module" enforcement)
• Dynamic module loading
• Module‑method discovery
• JavaScript‑function assignment to DOM events
• Custom JS function invocation from server

7. Tooling, Testing & Diagnostics

7.1 Testing

• Integrated unit‑testing tool
• DOM‑equality assertion
• Deep DOM comparison
• Form‑value assertions
• Attribute & class comparison
• Non‑blocking test reporting
• Regression‑testing strategy

7.2 Logging & Debugging

• Console‑message injection
• Structured logging system
• Error categorization
• Network‑error detection
• Retry logging
• Browser‑support logs

7.3 Reliability & Control

• Retry mechanism
• Max‑retry count
• Retry‑interval control
• Request‑queue management
• Interval assignment with ID
• Delete‑interval support

8. Fetch & External Resources

• InputPlace upgrade for HTML fetching
• External HTML‑template fetch
• JSON fetch (nested keys)
• XML fetch (XPath)
• INI fetch (key / line index)
• Event fetch (evt)
• Escaped fetch (@@)
• Location‑property access (href, pathname, host, …)

9. Progressive Web App (PWA)

• Service‑worker integration
• Route‑alias configuration
• Enhanced offline capability
• One‑time layout fetch
• Cached‑layout rehydration
• Native‑app‑like navigation

These features make WebForms Core 2.0 the most powerful full‑stack development infrastructure, completely erasing the boundaries between server and client.

Note: The list above applies to version 2. Earlier releases also introduced powerful capabilities that paved the way for this technology.

Why Is This a Revolution?

Imagine a developer who spent years mastering complex JavaScript frameworks suddenly realizing they can build a real‑time, PWA‑ready, high‑performance app using only their C# (or any popular programming‑language) knowledge. This is the moment “Technology” becomes “Magic.”

The front‑end monster is dead. Paradigm shift: Write once, control everywhere.

Why WebForms Core stands out

• Unparalleled DOM manipulation
• Complete event management
• Advanced state management
• Powerful template system
• Server‑side management, heavy processing on the client
• Unprecedented comprehensiveness – everything in one package
• Changing the way we think about front‑end / back‑end
• Offline performance in a server‑driven approach