Shulou(Shulou.com)06/01 Report--

In this issue, the editor will bring you about what the JavaScript framework of the rich client era is like. The article is rich in content and analyzes and describes it from a professional point of view. I hope you can get something after reading this article.

At the 17th Baidu Technology Salon hosted by Baidu and organized by InfoQ on August 20, Dong Rui, a front-end engineer from Baidu Business search Department, and Cheng Fu, a senior software engineer from IBM China Development Center, shared topics related to the JavaScript framework, covering the application of the enterprise RIA framework and the Dojo framework in actual product development.

Theme 1: full-site Ajax application development and ER (Enterprise RIA) framework (video, MP3 and Slides downloads)

Dong Rui, a front-end engineer from Baidu, was the first to share with you, covering the introduction of full-site Ajax applications, the introduction of ER (Enterprise RIA) framework, and the application development of whole-site Ajax and ER frameworks, with emphasis on the application of full-site Ajax and ER frameworks in practical development. Dong Rui first listed the common problems encountered in development:

URL sensitivity

The forward and backward of the browser

Handle the request behavior corresponding to Location (data loading, view rendering, etc.)

There are too many Action, it's a mess.

How to manage data

Data may be used by multiple scenarios

It's uncomfortable to write HTML fragments in JavaScript (line breaks, escapes, etc.)

UI control management interface interaction

Rendering of complex blocks

Frequent new and append

The Js file loaded when entering the page is too large.

In the ER framework, the main solutions are:

Encapsulate Locator (when Locator changes, Locator notifies Router to distribute to a JavaScript Function for processing)

Controller is handed over to an Object for processing (Action)

Action selects and matches the model and view to complete the processing of user behavior.

Classify the Action of similar business logic

Storage container for data

Event listening Mechanism for propertychange

Public and private grading

Use HTML comments

Support for unclosed declaration

Support for references to model and JS Object: ${}

No support for process control

A convenient way to create controls by customizing ui tags

Use "*" to easily reference data in Context

When controller chooses Action according to path, it loads automatically to solve the problem that loading Js file is too large.

In addition, Dong Rui also shares his experience in development through specific code examples and corresponding summaries from common scenarios such as directory structure, hierarchical structure of architecture, JavaScript management at development time, CSS management at development time, template management at development time, and packaging and compression.

Finally, Dong Rui summarized the characteristics of the ER framework: achieving the encapsulation of history, forward and backward functions, URL sensitivity, handling requests corresponding to Location, providing data environment, data model, convenience for writing HTML fragments, control loading and business behavior, demand loading, directory structure and source code management during development.

Topic 2: Dojo in actual product development (video, MP3 and Slides downloads)

Chengfu mainly starts from the world of JavaScript framework, explains why it chooses Dojo as an open source product, then introduces the Dojo development in the actual product and project, and finally summarizes the experience and lessons encountered in its long-term use.

Chengfu mentioned in his speech that IBM chose Dojo as the RIA standard framework of IBM because Dojo has the characteristics of high interactivity, enterprise intranet and suitable for team development. At present, in IBM, the products that widely use Dojo framework are IBM Mashup Center, IBM Connections and Lotus Live.

Next, Chengfu focuses on the Dojo development process and matters needing attention in the actual project. Only the basic development process of Dojo is:

Interface sketch (sketch design)

Layout (manually controlled using layout components)

Components (using standard components, extending standard components, custom components, or reusing other components, etc.)

Interface (component interaction)

Chengfu recommends the use of a roadmap for components: finding components, using components directly, extending components, and custom components that maximize the functionality of components. In addition, Chengfu also analyzes the component from the level of properties and methods, and introduces the creation, destruction, interaction and extension of the component. There are the following points to be aware of when customizing components:

Tradeoff of component granularity (reusable vs performance).

Lifecycle management (creation and destruction) of components.

Follow conventions (naming properties and methods, using dijit._widget methods).

Make good use of templates and containers (use HTML templates to create basic skeletons and inherit dijit._Container to manage internal subcomponents).

Finally, Chengfu shared his experiences and lessons in development, and the main non-functional requirements he is facing at present are:

Performance problem

Memory occupancy and memory leak problems

Accessibility

Unit testing

The coping mechanisms for the above problems are: packaging and compressing the code, controlling the number of components on the page, adding correct component destruction logic, and so on. In addition, Dojo is the first JavaScript framework to support a library of fully accessible components, as well as the W3C ARIA standard. The work of unit testing is to carry out logical unit testing through D.O.H, and D.O.H Robot can also be used for interface-related unit testing.

Open Space (Open discussion session)

As in previous sessions, in order to allow participants to have more time to communicate with each other, this event still has an Open Space (Open discussion) session. In addition to lecturers Dong Rui and Chengfu, Wang Ming, Yang Fei and Jia Xun also participated in the panel discussion. In the summary session of Open Space, several guests summarized the contents of the discussion:

Dong Rui shared the topic of "Web resource (text) compression", mainly mentioned some compression strategies of JavaScript and HTML, as well as optimization strategies for search engines. Cheng Fu continued the topic of his speech, "the Application of JS Framework in practical Development". Participants were very interested in Dojo. Cheng Fu answered related questions, and everyone had an in-depth discussion. Finally, some questions about common RIA frameworks were also discussed. In addition, Wang Ming, Yang Fei and Jia Jiao shared topics such as "Zend Framework rapid development and PHP performance optimization", "rich client and lightweight Internet applications" and "Node.js prospects".

This is what the JavaScript framework of the rich client era is like. If you happen to have similar doubts, you might as well refer to the above analysis to understand. If you want to know more about it, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.