WebFormsJS is the browser-side runtime of WebForms Core. It is not simply a JavaScript library for manipulating the DOM. It provides the execution environment through which WebForms Core commands are interpreted and executed in the browser.
WebFormsJS combines several roles within a single browser runtime:
As the Executor, WebFormsJS executes Action Controls generated by a Commander. As a DSL Parser, it interprets the WebForms Core command language. As a Runtime, it provides the browser-side environment required by WebForms Core. As an HTML Automator, it automates interactions with standard HTML and browser behavior. As a State Manager, it manages the browser-side state required by WebForms Core operations.
WebFormsJS runs directly in the browser and operates on the actual browser environment.
Unlike an application framework that primarily maintains an abstract representation of the interface, WebFormsJS works directly with the browser's HTML, DOM, events, browser APIs, requests, and other runtime capabilities.
This makes WebFormsJS the execution environment in which WebForms Core commands become actual browser operations.
The most visible role of WebFormsJS is its role as the Executor.
When a server-side WebForms class generates Action Controls, WebFormsJS receives them and executes them.
The Executor does not need to know why an application requested an operation. It only needs to understand the WebForms Core command and perform the operation defined by that command.
This separation keeps application logic and browser execution independent from each other.
WebForms Core uses a command-oriented DSL to represent browser operations. WebFormsJS contains the parser required to interpret this DSL.
A command can contain an operation, a target, parameters, conditions, execution information, or other values required by the WebForms Core protocol.
The DSL therefore does not need to be translated into a separate client-side application language before it can be executed. WebFormsJS interprets the WebForms Core protocol directly.
WebFormsJS provides much more than command parsing.
The runtime contains the browser-side capabilities required by WebForms Core to perform operations involving the DOM, events, requests, state, storage, browser history, communication mechanisms, and other browser functionality.
Consequently, WebFormsJS can support a broad range of interactive behaviors without requiring application-specific JavaScript for every operation.
The WebFormsJS runtime can therefore approach the capabilities normally associated with direct JavaScript programming while allowing many of those operations to be generated from the WebForms Core command model.
One of the important roles of WebFormsJS is the automation of standard HTML behavior.
WebFormsJS can take control of standard browser interactions according to its configuration and WebForms Core behavior. This includes automatically handling Submit interactions and internal links so that they can participate in WebForms Core request and response processing.
This behavior is enabled by default through WebFormsJS options such as:
For example, Submit buttons can automatically participate in the WebForms Core request flow without requiring the developer to manually attach JavaScript to every button.
Likewise, internal HTML links can be handled by WebFormsJS so that their normal browser navigation behavior can be prevented when appropriate and replaced with the corresponding WebForms Core request behavior.
The result is that ordinary HTML elements can become part of an interactive application without requiring framework-specific markup to be added to each element.
WebFormsJS does not require HTML to be replaced with a proprietary component representation.
The HTML remains ordinary HTML:
WebFormsJS can enhance the behavior of these standard elements at runtime.
This is an important part of the HTML-faithful design of WebForms Core. The developer does not need to replace standard HTML with framework-specific elements merely to obtain interactive behavior.
WebFormsJS also provides the client-side infrastructure required to communicate with the server.
When an HTML interaction or a WebForms Core command initiates a request, WebFormsJS can create and manage the corresponding request and process the returned response.
WebForms Core requests include a Post-Back request header:
This allows the server to distinguish a WebForms Core request from an ordinary request when the application needs to do so.
For example, a server can use this information to determine that a request is an interactive WebForms Core operation and avoid returning content such as a complete layout when only an interactive response is required.
The mechanism applies both to requests generated automatically by WebFormsJS and to requests explicitly assigned through WebForms Core commands.
WebFormsJS is designed to recognize the type of response it receives.
If the response begins with the WebForms Core marker:
WebFormsJS interprets the response as a WebForms Core command response and executes its Action Controls.
This allows a server to return commands without returning HTML.
WebFormsJS can also receive ordinary HTML content.
When the response is not a WebForms Core command response, WebFormsJS can place the returned content into the location specified by WebFormsOptions.ResponseLocation.
The default response location is the document body:
This provides a second response mode:
Therefore, WebFormsJS does not require every server response to use the same representation. It can distinguish between command responses and HTML responses at runtime.
WebForms Core can also transport HTML and Action Controls together.
In this mode, the Action Controls can be exported as an HTML comment:
WebFormsJS can recognize a WebForms Core comment whose content begins with [web-forms], extract the Action Controls, and execute them.
This makes it possible to send a document and executable browser operations in the same response.
WebFormsJS processes HTML comments even during the initial page load. If a comment begins with [web-forms], the Action Controls within it are extracted and executed; thus, this feature is not limited to subsequent responses.
The two mechanisms can therefore be summarized as:
Response() is appropriate when the response should contain WebForms Core commands without returning HTML.
ExportToHtmlComment() is appropriate when HTML is being returned and the Action Controls should travel with that HTML as comments.
WebFormsJS also manages browser-side state used by WebForms Core.
The runtime can preserve and retrieve information from the browser environment and use that information during later command execution.
This state management is performed on the client. It does not require the server to maintain a complete copy of the browser DOM or every detail of the previous browser interaction.
WebFormsJS provides access to many capabilities of the browser environment through the WebForms Core command model.
These capabilities can include DOM manipulation, events, URL and browser history, screen information, navigator information, storage, timing, communication, and other browser operations.
As a result, WebForms Core can go beyond simple CRUD interfaces. WebFormsJS can participate in rich interactive behaviors, including complex DOM interactions, interactive two-dimensional animations, Drag and Drop, browser communication, and other behaviors that would traditionally be implemented directly in JavaScript.
The important distinction is that JavaScript remains available when it is appropriate. WebForms Core does not attempt to remove the capabilities of JavaScript from web development. Instead, WebFormsJS provides a higher-level runtime and command interface through which many of those capabilities can be controlled without requiring application-specific JavaScript for every interaction.
The relationship between the server-side WebForms class and WebFormsJS can therefore be represented as:
The WebForms class determines and generates commands. WebFormsJS interprets those commands, manages the required browser runtime, and executes the requested operations.
WebFormsJS does not require a Virtual DOM as the fundamental mechanism for browser updates.
It operates directly on the browser's actual DOM and other browser structures.
The runtime therefore does not need to maintain a complete virtual representation of the page merely to determine what changed. When the Commander specifies a targeted operation, WebFormsJS can execute that operation against the appropriate browser target.
WebFormsJS also goes beyond request management.
AJAX provides a mechanism for asynchronous communication with a server. WebFormsJS provides a broader runtime in which communication is only one part of the system.
This is why WebFormsJS should be understood as a browser runtime, rather than simply as a request library.
WebFormsJS itself is JavaScript, but using WebForms Core does not mean that developers must write application-specific JavaScript for every interactive feature.
The runtime provides the infrastructure required to perform many browser operations automatically or through WebForms Core commands.
Application-specific JavaScript remains possible and can be used when required. WebFormsJS provides the runtime layer that makes it unnecessary for many common interaction scenarios.
WebFormsJS enables the execution of JavaScript methods and module methods and allows their output to be captured. This output can be utilized in the subsequent WebForms Core workflow and made available to the WebForms class for server-side scenarios.
One of the defining characteristics of WebFormsJS is that it sits at the boundary between HTML documents and executable WebForms Core commands.
This makes the runtime capable of participating in both traditional HTML responses and command-oriented WebForms Core responses.
When HTML and Action Controls are combined, WebFormsJS can process both representations from the same response.
WebForms Core is not complete merely because a WebForms class can generate commands. Those commands require an execution environment in the browser.
WebFormsJS provides that environment.
The WebForms class and WebFormsJS therefore form two complementary parts of the same architecture.
The Commander determines what should happen. WebFormsJS provides the runtime that determines how that command is executed in the browser environment.
WebFormsJS is the browser runtime that makes the WebForms Core command architecture executable.
It simultaneously acts as an Executor, DSL Parser, Runtime, HTML Automator, and State Manager.
Its responsibilities include interpreting Action Controls, manipulating the actual DOM, automating standard HTML interactions, managing requests and responses, processing WebForms Core commands contained in responses or HTML comments, maintaining browser-side state, and exposing a broad range of browser capabilities to the WebForms Core execution model.
The overall relationship can be summarized as:
WebFormsJS is therefore not simply a JavaScript helper library. It is the browser-side execution environment of WebForms Core, providing the runtime capabilities that allow a command generated by a Commander to become an actual operation in the browser.