Thinking of Web front-end frame and class library

Speaking of the front-end frame, I was also drunk. Now go to the interview or chat with peers, the framework of the fortress, the framework is very sharp.

Of course not to belittle the framework, but there is a way to kill chicken with sledgehammer feeling. Website technology exists for the business, except that it is meaningless, the framework is the same. In the technology selection and architecture design, divorced from the reality of the development of the website business, blindly pursuing fashionable new technology, may backfire, the website development into the rugged path. Like a daily average PV only hundreds of small e-commerce website, but to yell "some treasure is so", and then build Application server cluster, using Distributed File system and distributed database system ... A bunch of balabala to handle high-concurrency, massive data access. I want to say, does it make sense?

Misunderstanding of the front-end frame

The value of the site is that it can provide users with what value, is what the site can do, but not how it is done, so in the site is still very small when the framework of the pursuit of the site is trifles, outweigh the benefits. Front-end Framework Similarly, if it is a simple page-based product, the application just relies on the server to generate Web pages and views, and only need to use some simple JavaScript or jquery to make the application more interactive, then a jquery front-end Class library can be, There is really no need to use some tall frame.

Of course, the framework is really useful, and the point is that we need to know when to use the framework. The experience and success model of big company projects is important, it is worth learning from, but we can not become blindly blind. Only a deep understanding of the front-end framework, know when to use what the framework to solve any problem, can be targeted, directly hit the key.

The difference between front-end frame and front-end class library

Before using the framework, I think it is important to understand where the differences between class libraries (such as jquery) and frameworks (such as ANGULARJS) are.

Simply put, a class library solves a code or module-level reuse or encapsulation of complexity, such as encapsulating a functional module that solves a complex problem into a function that provides a simple interface. Library It is a tool that provides a number of packaged methods, with and without depending on ourselves, the code structure that is used and does not affect us.

The framework is more about the reuse of pattern levels and the specification of program organization. The pattern here refers to MVC, which, in order to decouple M and V, shifts complex coupling relationships from frequently changing business code to internal digestion within a framework that does not change frequently. is to provide a solution for an area to improve development efficiency, and if we choose to use a framework, we should follow the rules set out in that framework.

The main difference between the two is that jquery is centered on DOM operations, the framework, which is exactly the MVC framework, is centered on the model, and DOM operations are attached. Therefore, the model-centric final goal is to bring a complete set of workflow changes, so that background engineers can write the front-end model code, the background and front-end, interactive designers to deal with the interaction between the UI and the model, UI designers can focus on, barrier-free processing of HTML source, They are presented to the interaction engineer in the form of an interface template. This set of collaborative mechanisms can greatly improve the efficiency of development. Using the MVC framework makes the front-end tasks better decoupled.

Front-end MVC framework Idea

We know that the traditional MVC pattern divides an application into a model layer, a view layer, a control layer (Controller). They play different roles in the application system and perform different tasks.

• Model: The data model, which is used to package data related to the business logic of the application or to process the data, and the models can access the data directly.
• View: Views are used for purposeful display of data, there is generally no procedural logic in the view, and in order to implement the latest functionality on the view, the view needs to access the data model it monitors.
• Controller: Controllers regulate the connection between the model and the view, which controls the process of the application, processes the events, and responds, not only to the user's behavior but also to changes in the data model. By capturing user events, the model layer is notified of the corresponding update processing, and the updates and changes to the model layer are notified to the view, making the views change accordingly. So the controller guarantees the consistency of the view and the model.

　　

　　Then the performance in the front end. The responsibilities of the various parts of the front-end MVC:

　　

My understanding of the front-end view is that the parts that are directly related to the elements on the page belong to the view. Includes Html,css and part of the direct control page element JS. You can get the data from the model and display it on the page. The changes and requests for the data are given to the controller for processing.

What about the controller? As the model and view binder, the controller forwards the view request to the appropriate model and, if necessary, updates the view. The controller itself can also be used as the model observer to obtain the model change. As the controller itself, there should be no code that involves page elements.

Finally, the model, the communication with the backend, the AJAX request, and the processing of the data belong to model work. The model itself does not know who the view is, who is the controller. It provides only a few methods for the view and controller calls, and notifies its observer view or controller of the change. Obviously, the model is decoupled from the page element.

　　Although there are many differences between frameworks based on the MVC model, in general, the model is responsible for preserving the data required by vier and the processing logic, such as reading, writing, updating, deleting, validating, converting, etc. View is responsible for receiving and displaying the data provided by the model and receiving input from the user, responding to events, and promptly returning updates back to the user after the model has been updated. The controller handles the business logic and the event logic.

To the enemy, the remedy

The front-end framework and class libraries are becoming richer today. Choosing a pair of frame or class library is particularly important, I think there is no need to blindly follow suit, see what frame fire on the fart to chew one weeks, and then because the project work, and after a few months after all forget.

So I think it's important to build a solid foundation that focuses on understanding the role of libraries and frameworks, what kind of frameworks are used to solve problems, and then it's best to study the API when the project needs to be used.

Finally, we need to understand the limitations of MVC's application in front-end development, and simple projects that use the MVC framework can lead to more complex projects. Of course, with the increasing complexity of the web front-end, the development of the front-end MVC framework, it is believed that in the future application software complex products, the MVC framework will bring the efficiency leap to the front-end work.

　　

The above is just my front-end framework and class library some superficial understanding, do not like to spray, but also hope you can put forward a better learning framework and class library methods. Make progress together and learn together.

Original: http://www.imooc.com/article/1368

Thinking of Web front-end frame and class library