Web page production needs to be integrated into modular thinking

Recently been "modular" ridden, but also the article is PPT, was forced to think of a lot of related things. Organize my time for the "modular" thinking, most of my own work in the page to reconstruct the experience and understanding of the job, to a certain extent, there are limitations, but also hope that they can be warm to know new.

"Modularity" is just a trendy term for the techniques and methods we used to use, like "Ajax." However, as a page to reconstruct the development of a trend, more and more attention, not consciously also mouthful of "modular", but you really understand what is "modular"?

What is modularity?

The "Modular" interpretation, in the CNKI there are 28 kinds. It can be seen that "modular" thinking is widely used. Closest to the "modularity" of page refactoring, the existing explanation should be explained in software development.

First look at Baidu entry is how to explain the "modular":
Modularity refers to the process of dividing a software system into several modules from top to bottom when solving a complex problem. Each module completes a specific sub function, and all modules are assembled in a way that becomes a whole and accomplishes the functions required by the entire system. Modules have the following basic attributes: interface, function, logic, state, function, state and interface reflect the external characteristics of the module, logic reflects its internal characteristics. In the software architecture, modules are components that can be combined, decomposed, and replaced. ”

Related books are quite a lot, interested students can search. It is important to emphasize that what we draw from is a way of thinking.

Why does page making need to be modular?

Site content more and more bloated code , gradually affecting the client experience (mainly open speed), affecting the maintenance of efficiency. Is there any way to solve these problems?

We can easily think of: reduce code redundancy, improve code reuse rate, image compression, and so on, and how to achieve this? Modular thinking can be solved, that is, can effectively reduce code redundancy, improve code reuse rate, more importantly, can support to many people maintenance, reduce maintenance costs. CSS writing is more flexible, easy to generate code coupling, the use of modularity can also reduce the degree of coupling to a certain extent, the location of the bug is also helpful. Therefore, we should focus on the site early on and use of "modular thinking" to write the site.

We have often mentioned the site performance optimization, a considerable part of the "modular" content, such as improving code reuse, improve development efficiency, and so on, "modular" the advantages of many, I probably listed:

• Increase code reuse Rate
• Improve development efficiency and reduce communication costs
• Reduce coupling
• Reduce publishing risk
• Reduce bug location time and fix costs
• Improve page fault tolerance
• Better implementation of fast iterations
• Better support for Grayscale publishing

One of the most important points, I think, is to "increase the rate of code Reuse," which is one of the most important features of modularity.

How to achieve "modularity"?

The main problem here is the "modularity" of HTML and CSS, and we can look at how the skins are implemented:

• Same class name, change file (JS)
• Same file, change class name (JS)

The interface between HTML and CSS is realized:

• Three ways to introduce CSS
• Class name

To better implement this interface, need to have relevant (interaction, design, page, development) Agreement, rules, specifications, such as: all the current state are using the same class name "Nonce", all the performance of gray to use the original class name plus "_n", the way the tab is implemented, and so on. With these conventions, rules, and specifications, HTML code can easily be templated, unified Interface Specification.

There are two misunderstandings that need to be recognized first:

• Modularity is not going to be able to be used anywhere (the modular code snippet has the applicable scope limit and requires an environment that provides the interface rules)
• Modularity is not something that cannot be changed (the modular code snippet can be modified according to actual needs)

Completely self-contained modules are placed in the same project, because the project has its own performance, interactive unity, so the modules must appear in a similar part, these parts can be proposed as a public definition, reduce redundancy, then there will be coupling problems, complete decoupling is impossible, so modularity is very important is " Moderately coupled. " With a public definition, you have to adjust the way the module style is implemented, and this adjustment also affects how the interface is implemented.