Simplify Web front-end development with DECJ (i)

declarative JavaScript dynamic loading and browser event binding

Introduction

In Web front-end development, developers often need to deal with some general issues, such as:

Referencing multiple JavaScript files in a page that are dependent on each other

Referencing CSS files in a page

Browser event Bindings

form data padding, data packaging submission, data validation, and formatting

Page initialization logic

When dealing with these issues in the traditional imperative programming paradigm, developers have to repeatedly write code to invoke the relevant APIs to accomplish these common tasks. In fact, the developer's primary focus should be on the business logic implementation, not on the regular tasks that consume too much time. The declarative programming paradigm helps developers to quickly fix these common tasks with minimal effort, allowing them to focus more on the implementation of business logic.

DECJ is a JavaScript open source framework based on the declarative programming paradigm. This article describes how to use the DECJ framework to work around these common tasks in an efficient way that is nearly 0 encoded. This issue will introduce DECJ declarative JavaScript files dynamically on-demand loading and declarative cross browser event bindings.

Introduction to the DECJ framework

Advantages and main characteristics of DECJ

DECJ enables developers to perform modular declarative programming with the goal of simplifying the processing of common problems in Web application development, allowing developers to devote more effort to business logic processing. In short, the advantage of DECJ is:

Declarative programming: Enables developers to focus on writing code that must be written by them to improve development efficiency.

DECJ solves problems that are common to almost every Web application: Event binding, form data validation, formatting, form submission, and so on.

Code is document: The application of DECJ development, whose code is somewhat of a document.

The advantage of DECJ is the advantage of declarative programming. With declarative programming, DECJ enables developers to focus on "real" issues that need to be addressed when faced with problems that are often addressed in their day-to-day work.

For example, a piece of business processing logic needs to be executed when a button on a page is clicked. Obviously, this called business logic is what developers really want to focus on, because the business logic is what only people know, and any framework/library is not known and for developers. In contrast, a framework/library with imperative programming, when dealing with such problems, developers often have to be distracted from the problem of some non-commercial logic, such as how to get this button to respond to a click event. For example, if you are using jquery, the developer needs to be in the right place/time in the code, such as

When the OnLoad event for window is triggered, the jquery bind method is invoked before the button is clicked to perform a business logic. As shown in Listing 1 code:

Listing 1. Imperative programming: Using jquery to handle event bindings

$ (document). Ready (function () {//Load page after completion of the functions
   $ (' #aButton '). Bind (' click ', Function () {
     //write or invoke the business logic implementation code here
   });
});

With DECJ, developers need not care about the event handling APIs and where and when they are invoked. You can focus more on business logic. As shown in Listing 2 code:

Listing 2. Declarative programming: Using DECJ to handle event bindings

events:{
  "Click@abutton": function () {//button Abutton when clicked execute the functions
     ///write directly here or invoke the business logic implementation code
   }
}

As you can see, there is no call to the event API in the code in Listing 2, so developers can avoid having to pay attention to these APIs and when to call them. Developers can focus on how to respond to related events to achieve business logic. In addition, DECJ's application code can act as a document. For example, as shown in the code in Listing 2, for an event on an element on a page, a glance at the information that responds to that event handler helps pinpoint the problem because the person locating the problem can quickly confirm the information he needs.

This column more highlights: http://www.bianceng.cn/webkf/tools/