Given the problem of static websites, dynamic web technologies such as php, jsp, asp, etc. Were subsequently born. The so-called dynamic web site is not animated by pages, but by the fact that pages are generated by technological means. For example, on bank billing pages, zhang san and li si will see different data, but only one dynamic page on the server will suffice, and when zhang san and zi each visit the dynamic page, two different HTML pages will be generated dynamically, as reflected in the dynamic generation of HTML。
Take php dynamic website technology, for example, with the following processes:
Service render and client render
Whether static or dynamic websites, if the server returns content later after the browser sends a request (possibly a web problem), the browser can only wait, be blocked, with the effect of long white screens, high irons and fast meals in today's fast-paced mode of life ... These habits are entrenched when a page does not come out for about three seconds, and we do not even want to wait。
So to improve the user experience, a technology, ajax, was born in 2005 that allows browsers to send requests to servers without hindrance, and the users are not aware, and when the server returns the data, the page is then partially updated on the basis of the data. With the ajax technology, coupled with jquery, it has largely become the main development model at the front end, and this has been the glorious period of nearly 10 years since jquery (with better choices now, of course - vue/react/augular)。
Next, there is a need to focus on the concept: rendering. So-called rendering is the process of filling data with HTML labels。
Again, for example, to view the billing scene, the billing data are generally stored in a database, so the php code searchs the data from the database and collages it into an HTML tag code, a process that occurs on the server and is called a service rendering. The process is as follows:
Client requests a display of the HTML page that is rendered by the service, and if the user triggers an update of the page, you can also obtain backend data (currently basically in json format) through ajax, thereby enabling a partial update of the page. The more typical scene has the effect of touching the bottom to load more list contents, and when the page scrolls at the bottom, the contents on the page will not disappear, but will show at the bottom a new page of the data requested by ajax, which is very good experience. Then if the server returns only json data, the page will pass javasThe cript code displays data in HTML labels, and this data fill labels occur in browsers, the so-called client rendering。
The jquery era is essentially a combination of service rendering and client rendering, with a general home page using service rendering and a home page display, where subsequent partial updates are generally based on ajax, using client rendering to enhance interactive experience。
Separate back and back
As the internet continues to flourish, client-based business scenes based on ajax are becoming more complex, making it increasingly cumbersome and difficult to maintain codes by collating json data into HTML labels. While front-end engines such as art-template have emerged and have improved to some extent, the handling of events, which still needs to be operated on its own, does not address the root causes of the problem。
In 2009, a technology was created to create a more prosperous development model in the front line: node. Js
Node. Js can get javasCript operates in a non-browser environment and provides the capability to connect to the bottom operating system api. After more than a decade of development, this ecology has flourished. The emerging front-end framework is largely built on the node. Js ecology, including the currently popular angularjs, vue, react。
The emerging front-end framework, such as react, essentially subverts the development model of the front-end code, freeing programmers from cumbersome dom operations and simply focusing on data processing and operations, thus significantly simplifying the achievement of the front-end code. Moreover, the more important point is that the back and back end are completely separated from the project structure and development process so that the front and back ends can be more focused (which can actually be a little less hair), whereas many of the previous back ends were largely full-scale work。
In this development mode of back-to-back separation, the processes are as follows:
In this pattern of back- and back-end separation, the interface with the back-end only requires an interface (details of the interface include the address of the request, the manner of the request, the parameters of the request, the result of the return of the back-end), which is not technology-related, so the technical configuration of the front-end can be designed freely and the front-end can choose react, vue, etc., and the back-end can choose java, php, python, etc。
For the front end, a major change is that the front-end project can be individually engineered and independently designed, developed, tested, deployed online and operational. The process is not easy to handle on a back end, so the former post of engineer has a place and can be challenged by the back end engineer。
