Research And Implementation Of Key Technologies In Web Front-End Framework Based On MVC Pattern

With the Internet entering into the Web2.0time, various Web browserapplications have prompted a large number of emerging, the front-end of the websitehas undergone enormous changes, the webpage no longer just contains the single textand images, a variety of rich media contents make the web page more vivid, theinteractive web forms strength the experience of users for web application, webfront-end technology in the development process has also been more and moreextensive utilization.A result of the popularity of Web applications is users increase high expectationsof the website, which makes that the website continuously extends its front-end scale,more and more front-end scripts are added to the system, and as a consequence, thefront-end development codes emerge huge scale, complexity of organization andmaintenance, low code reusability, and poor expandability. To develop a reasonablefront-end development framework, and following the development of standards andspecifications will become increasingly important.In this paper, for reference of the MVC Pattern in back-end architecture, byanalyzing the issues in traditional front-end development approach process encounters,combining with the existing front-end design patterns, relying on the front-endtechnology of JavaScript, jQuery, DOM, Ajax and JSON, combining theory andpractice, we implement the front-end framework on the basis of MVC Pattern. Thefront-end framework established in the paper makes the front-end development followthe modular development approach, and separate different types of logic.Consequently, the framework decreases the interdependent relationship and achievesdecoupling and reuse of the front-end codes, and then lowers the complexity ofextension and maintenance in applications, and the specific research process is as follows:Firstly, we design the various parts of the front-end framework in accordancewith the hierarchical structure theory. The framework consists of a model object, acollection object, a controller object, a view object and a asynchronous request object,and we analyze the function of each object needs to do, and then design the propertiesand methods the object involves.Secondly, we encode and realize the initialization of the objects and the functionsin objects. An innovative point is to achieve a template engine which separates theJavaScript code with the HTML code fragment. It makes easier to maintain the codesby adopting the template engine to implement page view rendering, and improves theefficiency of page rendering. Another innovation is optimizing the Ajax asynchronousrequest scheduling in the synchronous request object. We adopt the request priorityqueue and promoting the priority based on waiting time which reduces the userrequests waiting time, and prevents user requests could not get the response for a longtime.Finally, we test and compare the efficiency of the template rendering engine inthe paper with the current popular template engine, and the response time of applyingthe Ajax asynchronous request scheduling strategy with the common Ajax request,and the response time by using the front-end framework and the others in the samenumber of requests. The results shows that the efficiency of page rendering and pageresponse under the front-end framework of the paper has been greatly improved. Thendescribe the process and the feasibility of the framework with the news managementsystem application.